add: user status

crates/app/src/public/html/components.html

@@ -973,4 +973,128 @@ can_manage_message=false, grouped=false) -%}
         </div>
     </div>
 </div>
+{%- endmacro %} {% macro user_menu() -%}
+<div class="inner">
+    <b class="title">{{ user.username }}</b>
+    <a href="/@{{ user.username }}">
+        {{ icon "circle-user-round" }}
+        <span>{{ text "auth:link.my_profile" }}</span>
+    </a>
+
+    <a href="/settings">
+        {{ icon "settings" }}
+        <span>{{ text "auth:link.settings" }}</span>
+    </a>
+
+    {% if is_helper %}
+    <b class="title">{{ text "general:label.mod" }}</b>
+
+    <a href="/mod_panel/audit_log">
+        {{ icon "scroll-text" }}
+        <span>{{ text "general:link.audit_log" }}</span>
+    </a>
+
+    <a href="/mod_panel/reports">
+        {{ icon "flag" }}
+        <span>{{ text "general:link.reports" }}</span>
+    </a>
+
+    <a href="/mod_panel/ip_bans">
+        {{ icon "ban" }}
+        <span>{{ text "general:link.ip_bans" }}</span>
+    </a>
+
+    <a href="/mod_panel/stats">
+        {{ icon "chart-line" }}
+        <span>{{ text "general:link.stats" }}</span>
+    </a>
+    {% endif %}
+
+    <b class="title">{{ config.name }}</b>
+
+    <a href="https://github.com/trisuaso/tetratto">
+        {{ icon "code" }}
+        <span>{{ text "general:link.source_code" }}</span>
+    </a>
+
+    <a href="https://trisuaso.github.io/tetratto">
+        {{ icon "book" }}
+        <span>{{ text "general:link.reference" }}</span>
+    </a>
+
+    <div class="title"></div>
+    <button onclick="trigger('me::switch_account')">
+        {{ icon "ellipsis" }}
+        <span>{{ text "general:action.switch_account" }}</span>
+    </button>
+
+    <button class="red" onclick="trigger('me::logout')">
+        {{ icon "log-out" }}
+        <span>{{ text "auth:action.logout" }}</span>
+    </button>
+</div>
+{%- endmacro %} {% macro user_status(other_user) -%} {% if
+other_user.settings.status %}
+<div class="flex items-center gap-2">
+    <span>{{ other_user.settings.status }}</span>
+
+    <!-- connection icon -->
+    {% if (other_user.connections.LastFm[1].data and
+    other_user.connections.LastFm[1].data.track) or
+    (other_user.connections.Spotify[1].data and
+    other_user.connections.Spotify[1].data.track) %} {{ icon "music" }} {% endif
+    %}
+</div>
+{% elif other_user.connections.LastFm[0].data.name and
+other_user.connections.LastFm[1].data and
+other_user.connections.LastFm[1].data.track %}
+<div class="flex items-center gap-2">
+    {{ icon "music" }}
+    <span
+        ><b>Listening to</b> {{ other_user.connections.LastFm[1].data.artist
+        }}</span
+    >
+</div>
+{% elif other_user.connections.Spotify[0].data.name and
+other_user.connections.Spotify[1].data and
+other_user.connections.Spotify[1].data.track %}
+<div class="flex items-center gap-2">
+    {{ icon "music" }}
+    <span
+        ><b>Listening to</b> {{ other_user.connections.Spotify[1].data.artist
+        }}</span
+    >
+</div>
+{% endif %} {%- endmacro %} {% macro user_plate(user, show_menu=false,
+secondary=false) -%}
+<div
+    class="flex gap-2 items-center card tiny user_plate {% if secondary %}secondary{% endif %}"
+>
+    <a href="/@{{ user.username }}">
+        {{ self::avatar(username=user.username, size="42px",
+        selector_type="username") }}
+    </a>
+
+    <div
+        class="flex justify-center flex-col"
+        style="{% if show_menu %}width: 60%{% endif %}"
+    >
+        {{ self::full_username(user=user) }}
+        <div class="user_status">{{ self::user_status(other_user=user) }}</div>
+    </div>
+
+    {% if show_menu %}
+    <div class="dropdown">
+        <button
+            class="camo small square"
+            onclick="trigger('atto::hooks::dropdown', [event])"
+            exclude="dropdown"
+        >
+            {{ icon "settings" c(dropdown-arrow) }}
+        </button>
+
+        {{ self::user_menu() }}
+    </div>
+    {% endif %}
+</div>
 {%- endmacro %}