Mirror/vega
1
0
Fork 0
mirror of https://github.com/hoornet/vega.git synced 2026-05-10 06:09:12 -07:00
Code Issues Packages Projects Releases Wiki Activity

Make logged-out state visually obvious with top banner

Browse Source
This commit is contained in:
Jure
2026-04-04 21:07:09 +02:00
parent a7088a494c
commit fa1eb0d89b
2 changed files with 14 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/App.tsx
View File

@@ -28,6 +28,7 @@ const V4VView = lazy(() => import("./components/v4v/V4VView").then(m => ({ defau
const DebugPanel = lazy(() => import("./components/shared/DebugPanel").then(m => ({ default: m.DebugPanel }))); const DebugPanel = lazy(() => import("./components/shared/DebugPanel").then(m => ({ default: m.DebugPanel })));
const HelpModal = lazy(() => import("./components/shared/HelpModal").then(m => ({ default: m.HelpModal }))); const HelpModal = lazy(() => import("./components/shared/HelpModal").then(m => ({ default: m.HelpModal })));
import { useUIStore } from "./stores/ui"; import { useUIStore } from "./stores/ui";
import { useUserStore } from "./stores/user";
import { getTheme, applyTheme } from "./lib/themes"; import { getTheme, applyTheme } from "./lib/themes";
import { useUpdater } from "./hooks/useUpdater"; import { useUpdater } from "./hooks/useUpdater";
import { useKeyboardShortcuts } from "./hooks/useKeyboardShortcuts"; import { useKeyboardShortcuts } from "./hooks/useKeyboardShortcuts";
@@ -55,6 +56,16 @@ function UpdateBanner() {
); );
} }
function ReadOnlyBanner() {
const loggedIn = useUserStore((s) => s.loggedIn);
if (loggedIn) return null;
return (
<div className="flex items-center justify-center gap-2 px-4 py-1.5 bg-warning/10 border-b border-warning/30 text-[11px] shrink-0">
<span className="text-warning">Read-only mode — sign in to post, react, and zap</span>
</div>
);
}
function App() { function App() {
const currentView = useUIStore((s) => s.currentView); const currentView = useUIStore((s) => s.currentView);
const showHelp = useUIStore((s) => s.showHelp); const showHelp = useUIStore((s) => s.showHelp);
@@ -108,6 +119,7 @@ function App() {
return ( return (
<div className="flex flex-col h-screen w-screen bg-bg"> <div className="flex flex-col h-screen w-screen bg-bg">
<UpdateBanner /> <UpdateBanner />
<ReadOnlyBanner />
<div className="flex flex-1 min-h-0"> <div className="flex flex-1 min-h-0">
<Sidebar /> <Sidebar />
<main className="flex-1 min-w-0 h-full overflow-hidden" style={{ zoom: `${fontSize / 14}` }}> <main className="flex-1 min-w-0 h-full overflow-hidden" style={{ zoom: `${fontSize / 14}` }}>

12
src/components/sidebar/AccountSwitcher.tsx
View File

@@ -140,21 +140,13 @@ export function AccountSwitcher() {
{/* Active account row */} {/* Active account row */}
<div className="px-3 py-2"> <div className="px-3 py-2">
{!loggedIn && (
<button
onClick={() => setShowAddLogin(true)}
className="w-full mb-1.5 px-2 py-1 text-[10px] border border-accent/40 text-accent hover:bg-accent/10 transition-colors"
>
re-login to sign
</button>
)}
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div <div
className="flex items-center gap-2 flex-1 min-w-0 cursor-pointer hover:opacity-80 transition-opacity" className="flex items-center gap-2 flex-1 min-w-0 cursor-pointer hover:opacity-80 transition-opacity"
onClick={() => openProfile(pubkey)} onClick={() => openProfile(pubkey)}
> >
<Avatar account={current} size="w-10 h-10" textSize="text-[14px]" /> <Avatar account={current} size={loggedIn ? "w-11 h-11" : "w-8 h-8"} textSize={loggedIn ? "text-[16px]" : "text-[12px]"} />
<span className={`text-[14px] font-medium truncate flex-1 ${loggedIn ? "text-text" : "text-text-muted"}`}>{displayName(current)}</span> <span className={`font-medium truncate flex-1 ${loggedIn ? "text-[15px] text-text" : "text-[12px] text-text-muted"}`}>{displayName(current)}</span>
</div> </div>
<button <button
onClick={() => setOpen((v) => !v)} onClick={() => setOpen((v) => !v)}