Add name, email and sign out button to sidebar footer
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
85c7aea799
commit
2454886e2d
1 changed files with 18 additions and 2 deletions
|
|
@ -1,5 +1,5 @@
|
||||||
import { NavLink } from 'react-router-dom'
|
import { NavLink } from 'react-router-dom'
|
||||||
import { TrendingUp, Calendar, Globe, BarChart2, Settings, Building2 } from 'lucide-react'
|
import { TrendingUp, Calendar, Globe, BarChart2, Settings, Building2, LogOut } from 'lucide-react'
|
||||||
import { useQuery } from '@tanstack/react-query'
|
import { useQuery } from '@tanstack/react-query'
|
||||||
import { useAuth } from './AuthGate'
|
import { useAuth } from './AuthGate'
|
||||||
import { can } from '../types'
|
import { can } from '../types'
|
||||||
|
|
@ -20,6 +20,11 @@ export default function Layout({ children }: { children: ReactNode }) {
|
||||||
const { user } = useAuth()
|
const { user } = useAuth()
|
||||||
const items = NAV.filter(n => can(user, n.cap))
|
const items = NAV.filter(n => can(user, n.cap))
|
||||||
|
|
||||||
|
async function logout() {
|
||||||
|
await fetch('/rates/api/auth/logout', { method: 'POST', credentials: 'include' })
|
||||||
|
window.location.reload()
|
||||||
|
}
|
||||||
|
|
||||||
const { data: alertCount } = useQuery<number>({
|
const { data: alertCount } = useQuery<number>({
|
||||||
queryKey: ['parity-alert-count'],
|
queryKey: ['parity-alert-count'],
|
||||||
queryFn: () => api.get('/competitors/parity/alerts?status=active').then(r => r.data.length),
|
queryFn: () => api.get('/competitors/parity/alerts?status=active').then(r => r.data.length),
|
||||||
|
|
@ -49,7 +54,18 @@ export default function Layout({ children }: { children: ReactNode }) {
|
||||||
</NavLink>
|
</NavLink>
|
||||||
))}
|
))}
|
||||||
</nav>
|
</nav>
|
||||||
<div className="sidebar-user">{user.name ?? user.email}</div>
|
<div className="sidebar-user" style={{ whiteSpace: 'normal' }}>
|
||||||
|
<div style={{ fontWeight: 600, color: 'var(--text)', fontSize: '12px', marginBottom: '2px' }}>{user.name}</div>
|
||||||
|
<div style={{ fontSize: '11px', marginBottom: '8px' }}>{user.email}</div>
|
||||||
|
<button onClick={logout} style={{
|
||||||
|
display: 'flex', alignItems: 'center', gap: '6px',
|
||||||
|
background: 'none', border: 'none', color: 'inherit',
|
||||||
|
fontSize: '12px', padding: 0, cursor: 'pointer',
|
||||||
|
}}>
|
||||||
|
<LogOut size={13} strokeWidth={1.75} />
|
||||||
|
Sign out
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
</aside>
|
</aside>
|
||||||
|
|
||||||
<header className="top-bar">
|
<header className="top-bar">
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue