From fdddbc2bb4c7ce769e3ccb724b8cfa1ab63950a0 Mon Sep 17 00:00:00 2001
From: thePR0M3TH3AN <53631862+PR0M3TH3AN@users.noreply.github.com>
Date: Tue, 7 Jul 2026 11:43:28 -0400
Subject: [PATCH] Profile button: gold admin ring + fire on session restore
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Make the super-admin/admin signal unmistakable on your own profile button:
a gold ring around the avatar (with a thin page-colored gap so it reads as
a ring, not a border) in addition to the corner star.

- applicationBootstrap.js: refreshAdminStar toggles an is-admin class on the
  profile button using applyAdminStar's return value.
- CSS: #profileButton.is-admin > div draws the gold ring (box-shadow, not
  clipped by the avatar's overflow).
- uiCoordinator.js: refresh the admin star/ring inside applyAuthenticatedUiState
  so it also lights on session restore, not only a fresh login — the likely
  reason it wasn't showing.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 css/tailwind.source.css       | 10 ++++++++++
 js/app/uiCoordinator.js       |  6 ++++++
 js/ui/applicationBootstrap.js |  8 +++++++-
 3 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/css/tailwind.source.css b/css/tailwind.source.css
index 4f34dda1..eae3d05f 100644
--- a/css/tailwind.source.css
+++ b/css/tailwind.source.css
@@ -280,6 +280,16 @@
     left: var(--space-2xs);
   }
 
+  /* Gold ring around the avatar when the logged-in user is an admin — the
+     unmistakable "you're an admin" signal on your own profile button. A thin
+     page-colored gap separates the avatar from the ring so it reads as a ring,
+     not a border. Box-shadow isn't clipped by the avatar's own overflow. */
+  #profileButton.is-admin > div {
+    box-shadow:
+      0 0 0 var(--border-width-hairline) var(--color-page),
+      0 0 0 calc(var(--border-width-hairline) * 3) var(--status-warning);
+  }
+
   .header-icon-toggle[data-theme-state="light"]:hover,
   .header-icon-toggle[data-theme-state="light"]:focus-visible {
     color: var(--color-text);
diff --git a/js/app/uiCoordinator.js b/js/app/uiCoordinator.js
index ed3923f6..a743ed2f 100644
--- a/js/app/uiCoordinator.js
+++ b/js/app/uiCoordinator.js
@@ -128,6 +128,12 @@ export function createUiCoordinator(deps) {
       if (exploreLink) {
         exploreLink.classList.remove("hidden");
       }
+
+      // Light the admin star/ring whenever the authenticated UI is applied —
+      // this covers session restore, not just a fresh login.
+      if (typeof this.refreshAdminStar === "function") {
+        this.refreshAdminStar();
+      }
     },
 
     applyLoggedOutUiState() {
diff --git a/js/ui/applicationBootstrap.js b/js/ui/applicationBootstrap.js
index 7ab731a7..c3b05a67 100644
--- a/js/ui/applicationBootstrap.js
+++ b/js/ui/applicationBootstrap.js
@@ -987,7 +987,13 @@ export default class ApplicationBootstrap {
           typeof app.getCurrentUserNpub === "function"
             ? app.getCurrentUserNpub()
             : "";
-        applyAdminStar(app.profileButton, npub || "");
+        // applyAdminStar returns whether the user is an admin; use it to also
+        // toggle the gold ring around the profile avatar (the flagship signal
+        // on your own button — the corner star stays the shared marker).
+        const isAdmin = applyAdminStar(app.profileButton, npub || "");
+        if (app.profileButton && app.profileButton.classList) {
+          app.profileButton.classList.toggle("is-admin", Boolean(isAdmin));
+        }
       } catch (error) {
         devLogger.warn("[Application] Failed to refresh admin star", error);
       }