debug(auth): add visible debug border and user state to AuthPanel

src/components/dm/AuthPanel.astro

@@ -4,50 +4,55 @@ import DmButton from './DmButton.astro';
 const user = Astro.locals.user;
 ---
 
-{!user ? (
+<!-- DEBUG: user={JSON.stringify(user)} -->
-  <div class="flex flex-col sm:flex-row gap-3" data-auth-state="logged-out">
+<div class="border border-dashed border-[var(--accent)] rounded-lg p-2 min-w-[200px]">
-    <DmButton
+  <div class="text-xs text-[var(--accent)] mb-1 font-mono">AuthPanel: {user ? 'logged-in' : 'logged-out'}</div>
-      href="/api/auth/login/vk"
+  
-      variant="primary"
+  {!user ? (
-      size="md"
+    <div class="flex flex-col sm:flex-row gap-3" data-auth-state="logged-out">
-      class="bg-[#4C75A3] hover:bg-[#3d5f85] active:bg-[#2f4a68] shadow-[#4C75A3]/25"
+      <DmButton
-    >
+        href="/api/auth/login/vk"
-      Войти через VK
+        variant="primary"
-    </DmButton>
+        size="md"
-    <DmButton
+        class="bg-[#4C75A3] hover:bg-[#3d5f85] active:bg-[#2f4a68] shadow-[#4C75A3]/25"
-      href="/api/auth/login/yandex"
+      >
-      variant="primary"
+        Войти через VK
-      size="md"
+      </DmButton>
-      class="bg-[#FC3F1D] hover:bg-[#e03518] active:bg-[#c42d14] shadow-[#FC3F1D]/25"
+      <DmButton
-    >
+        href="/api/auth/login/yandex"
-      Войти через Яндекс
+        variant="primary"
-    </DmButton>
+        size="md"
-  </div>
+        class="bg-[#FC3F1D] hover:bg-[#e03518] active:bg-[#c42d14] shadow-[#FC3F1D]/25"
-) : (
+      >
-  <div class="flex items-center gap-3 flex-wrap" data-auth-state="logged-in" data-user-name={user.name}>
+        Войти через Яндекс
-    {user.avatar ? (
+      </DmButton>
-      <img
+    </div>
-        src={user.avatar}
+  ) : (
-        alt={user.name}
+    <div class="flex items-center gap-3 flex-wrap" data-auth-state="logged-in" data-user-name={user.name}>
-        class="w-8 h-8 rounded-full object-cover border border-[var(--border-color)]"
+      {user.avatar ? (
-        width="32"
+        <img
-        height="32"
+          src={user.avatar}
-      />
+          alt={user.name}
-    ) : (
+          class="w-8 h-8 rounded-full object-cover border border-[var(--border-color)]"
-      <div class="w-8 h-8 rounded-full bg-[var(--bg-secondary)] border border-[var(--border-color)] flex items-center justify-center text-sm font-semibold text-[var(--text-secondary)]">
+          width="32"
-        {user.name.charAt(0).toUpperCase()}
+          height="32"
-      </div>
+        />
-    )}
+      ) : (
-    <span class="text-[var(--text-primary)] font-medium">{user.name}</span>
+        <div class="w-8 h-8 rounded-full bg-[var(--bg-secondary)] border border-[var(--border-color)] flex items-center justify-center text-sm font-semibold text-[var(--text-secondary)]">
-    <DmButton
+          {user.name.charAt(0).toUpperCase()}
-      href="/api/auth/logout"
+        </div>
-      variant="ghost"
+      )}
-      size="sm"
+      <span class="text-[var(--text-primary)] font-medium">{user.name}</span>
-    >
+      <DmButton
-      Выйти
+        href="/api/auth/logout"
-    </DmButton>
+        variant="ghost"
-  </div>
+        size="sm"
-)}
+      >
+        Выйти
+      </DmButton>
+    </div>
+  )}
+</div>
 
 <script>
   (function () {