Nautilus/ledgerdock
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update header styles

Browse Source
This commit is contained in:
Beda Schmid
2026-03-01 17:55:51 -03:00
parent 1c57084ebf
commit 74d91eb4b1
2 changed files with 137 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
frontend/src/App.tsx
View File

@@ -3,6 +3,7 @@
*/
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import type { JSX } from 'react';
import { LogOut, User } from 'lucide-react';
import ActionModal from './components/ActionModal';
import DocumentGrid from './components/DocumentGrid';
@@ -739,68 +740,75 @@ export default function App(): JSX.Element {
return (
<main className="app-shell">
<header className="topbar">
<div>
<h1>LedgerDock</h1>
<p>Document command deck for OCR, routing intelligence, and controlled metadata ops.</p>
</div>
<div className="topbar-controls">
<div className="topbar-nav-group">
<button
type="button"
className={screen === 'documents' && documentView === 'active' ? 'active-view-button' : 'secondary-action'}
onClick={() => {
setScreen('documents');
setDocumentView('active');
}}
>
Documents
</button>
<button
type="button"
className={screen === 'documents' && documentView === 'trash' ? 'active-view-button' : 'secondary-action'}
onClick={() => {
setScreen('documents');
setDocumentView('trash');
}}
>
Trash
</button>
{isAdmin && (
<div className="topbar-inner">
<div className="topbar-brand">
<h1>LedgerDock</h1>
<p>Document command deck for OCR, routing intelligence, and controlled metadata ops.</p>
<p className="topbar-auth-status">
<User className="topbar-user-icon" aria-hidden="true" />
You are currently signed in as <span className="topbar-current-username">{authUser?.username}</span>
</p>
</div>
<div className="topbar-controls">
<div className="topbar-primary-row">
<div className="topbar-nav-group">
<button
type="button"
className={screen === 'documents' && documentView === 'active' ? 'active-view-button' : 'secondary-action'}
onClick={() => {
setScreen('documents');
setDocumentView('active');
}}
>
Documents
</button>
<button
type="button"
className={screen === 'documents' && documentView === 'trash' ? 'active-view-button' : 'secondary-action'}
onClick={() => {
setScreen('documents');
setDocumentView('trash');
}}
>
Trash
</button>
{isAdmin && (
<button
type="button"
className={screen === 'settings' ? 'active-view-button' : 'secondary-action'}
onClick={() => setScreen('settings')}
>
Settings
</button>
)}
</div>
<button
type="button"
className={screen === 'settings' ? 'active-view-button' : 'secondary-action'}
onClick={() => setScreen('settings')}
className="secondary-action topbar-icon-action"
onClick={() => void handleLogout()}
aria-label="Sign out"
>
Settings
<LogOut className="topbar-signout-icon" aria-hidden="true" />
</button>
</div>
{screen === 'documents' && (
<div className="topbar-document-group">
<UploadSurface onUploadRequested={handleUpload} isUploading={isUploading} variant="inline" />
</div>
)}
{screen === 'settings' && isAdmin && (
<div className="topbar-settings-group">
<button type="button" className="secondary-action" onClick={() => void handleResetSettings()} disabled={isSavingSettings}>
Reset To Defaults
</button>
<button type="button" onClick={() => void handleSaveSettingsFromHeader()} disabled={isSavingSettings || !settingsSaveAction}>
{isSavingSettings ? 'Saving Settings...' : 'Save Settings'}
</button>
</div>
)}
</div>
<div className="topbar-auth-group">
<span className="auth-user-badge">
{authUser?.username} ({authUser?.role})
</span>
<button type="button" className="secondary-action" onClick={() => void handleLogout()}>
Sign Out
</button>
</div>
{screen === 'documents' && (
<div className="topbar-document-group">
<UploadSurface onUploadRequested={handleUpload} isUploading={isUploading} variant="inline" />
</div>
)}
{screen === 'settings' && isAdmin && (
<div className="topbar-settings-group">
<button type="button" className="secondary-action" onClick={() => void handleResetSettings()} disabled={isSavingSettings}>
Reset To Defaults
</button>
<button type="button" onClick={() => void handleSaveSettingsFromHeader()} disabled={isSavingSettings || !settingsSaveAction}>
{isSavingSettings ? 'Saving Settings...' : 'Save Settings'}
</button>
</div>
)}
</div>
</header>