add: increase group maximum, better read receipts

app/templates_src/chat.lisp

@@ -23,14 +23,18 @@
     ("class" "flex flex_col card_nest reverse")
     ("style" "flex: 1 0 auto")
     (div
-        ("class" "card flex flex_rev_col gap_2")
+        ("class" "flex flex_col")
         ("style" "flex: 1 0 auto; max-height: 80dvh; overflow: auto")
-        ("id" "messages_stream")
-        (text "{% if messages|length == 0 -%}")
-        (i ("class" "flex gap_ch items_center fade") (text "{{ icon \"star\" }} This is the start of the chat!"))
-        (text "{%- endif %}")
+        (div
+            ("class" "card flex flex_rev_col gap_2")
+            ("style" "flex: 1 0 auto")
+            ("id" "messages_stream")
+            (text "{% if messages|length == 0 -%}")
+            (i ("class" "flex gap_ch items_center fade") (text "{{ icon \"star\" }} This is the start of the chat!"))
+            (text "{%- endif %}")
 
-        (div ("ui_ident" "data_marker")))
+            (div ("ui_ident" "data_marker")))
+        (div ("id" "read_receipt_zone") ("class" "card") ("style" "min-height: 32.5px; position: sticky; bottom: 0")))
     (form
         ("class" "card flex flex_row items_center gap_2")
         ("onsubmit" "create_message(event)")
@@ -49,5 +53,9 @@
     (text "create_streamer(\"{{ chat.id }}\", document.querySelector(\"[ui_ident=data_marker]\"));
     sock_con();
     mark_message_read();
-    read_receipt();"))
+    read_receipt();
+
+    setTimeout(() => {
+        scroll_bottom();
+    }, 500);"))
 (text "{% endblock %}")

app/templates_src/read_receipt.lisp

@@ -11,7 +11,7 @@
     ; delivered and read by at least two people
     (text "{{ icon \"check-check\" }}")
     (text "{% for uid in chat.last_message_read_by -%}")
-    (text "{{ components::avatar(id=uid) }}")
+    (a ("href" "/@{{ uid }}?redirect=true") (text "{{ components::avatar(id=uid) }}"))
     (text "{%- endfor %}")
     (text "{%- endif %}"))
 (text "{%- endif %}")