(text "{% extends \"root.lisp\" %} {% block head %}")
(title
    (text "{{ components::chat_name(chat=chat, members=members) }} - {{ name }}"))
(text "{% endblock %} {% block body %}")
(div
    ("class" "flex w_full gap_2 justify_between items_center")
    (div
        ("class" "tabs short bar flex")
        (a
            ("class" "button tab camo")
            ("href" "/chats")
            (text "chats"))
        (a
            ("class" "button tab")
            ("href" "/chats/{{ chat.id }}")
            (text "{{ components::chat_name(chat=chat, members=members, advanced=true, avatar_size=\"18px\") }}"))))
(div
    ("class" "flex flex_col card_nest reverse")
    ("style" "flex: 1 0 auto")
    (div
        ("class" "card flex flex_rev_col gap_2")
        ("style" "flex: 1 0 auto")
        ("id" "messages_stream")
        (text "{% if chat.last_message_created > 0 -%}")
        (div
            ("class" "flex gap_ch items_center")
            ("id" "delivered_read_status")
            (text "{% if chat.last_message_read_by|length <= 1 -%}")
            ; just delivered
            (text "{{ icon \"check\" }}")
            (text "{{ chat.last_message_created|int|date(format=\"%Y-%m-%d %H:%M\", timezone=\"Etc/UTC\") }} UTC }}")
            (text "{%- else -%}")
            ; 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) }}")
            (text "{%- endfor %}")
            (text "{%- endif %}"))
        (text "{%- endif %}")

        (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 %}"))
    (form
        ("class" "card flex flex_row items_center gap_2")
        (input
            ("type" "text")
            ("class" "w_full")
            ("name" "content")
            ("id" "content")
            ("placeholder" "Send a message to {{ components::chat_name(chat=chat, members=members) }}"))
        (button
            ("class" "button")
            (text "{{ icon \"send\" }}"))))

(script
    (text ""))
(text "{% endblock %}")