feat(dashboard): add transactions and users management pages with CRUD functionality
feat(auth): implement login page and authentication middleware feat(sidebar): create sidebar component with user info and navigation links feat(api): establish API client for interacting with backend services
This commit is contained in:
48
apps/web/components/sidebar-footer.tsx
Normal file
48
apps/web/components/sidebar-footer.tsx
Normal file
@@ -0,0 +1,48 @@
|
||||
'use client'
|
||||
|
||||
import { useRouter } from 'next/navigation'
|
||||
import { ArrowRightFromSquare, PersonFill } from '@gravity-ui/icons'
|
||||
import { signOut, useSession } from '@/lib/auth-client'
|
||||
|
||||
export default function SidebarFooter() {
|
||||
const router = useRouter()
|
||||
const { data: session } = useSession()
|
||||
|
||||
const handleSignOut = async () => {
|
||||
await signOut({ fetchOptions: { credentials: 'include' } })
|
||||
router.push('/login')
|
||||
router.refresh()
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="border-t border-border p-3">
|
||||
{/* User info */}
|
||||
{session?.user && (
|
||||
<div className="mb-2 flex items-center gap-2.5 rounded-lg px-2 py-1.5">
|
||||
<div className="flex size-7 shrink-0 items-center justify-center rounded-full bg-accent-soft">
|
||||
<PersonFill className="size-3.5 text-accent" />
|
||||
</div>
|
||||
<div className="min-w-0 flex-1">
|
||||
<p className="truncate text-sm font-medium leading-tight text-foreground">
|
||||
{session.user.name || session.user.email}
|
||||
</p>
|
||||
<p className="truncate text-xs leading-tight text-muted capitalize">
|
||||
{session.user.role ?? 'user'}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<button
|
||||
type="button"
|
||||
className="flex w-full items-center gap-2.5 rounded-lg px-2 py-1.5 text-sm text-muted transition-colors hover:bg-surface-tertiary hover:text-foreground"
|
||||
onClick={handleSignOut}
|
||||
>
|
||||
<ArrowRightFromSquare className="size-4 shrink-0" />
|
||||
<span>退出登录</span>
|
||||
</button>
|
||||
|
||||
<p className="mt-2 px-2 text-[11px] text-muted/60">OCPP 1.6-J • v0.1.0</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user