46 lines
1.3 KiB
TypeScript
46 lines
1.3 KiB
TypeScript
import type { Route } from './+types'
|
|
|
|
import { Link, Outlet } from 'react-router'
|
|
|
|
import logo from '@/components/logo.svg'
|
|
import { NavUser } from '@/components/nav-user'
|
|
import { userContext } from '@/context'
|
|
import { authMiddleware } from '@/middleware/auth'
|
|
|
|
export const middleware: Route.MiddlewareFunction[] = [authMiddleware]
|
|
|
|
export async function loader({ context }: Route.ActionArgs) {
|
|
const user = context.get(userContext)
|
|
return Response.json({ user })
|
|
}
|
|
|
|
export default function Component({ loaderData }: Route.ComponentProps) {
|
|
const { user } = loaderData
|
|
|
|
return (
|
|
<div className="relative flex flex-col flex-1 min-w-0">
|
|
<header
|
|
className="bg-background/15 backdrop-blur-sm
|
|
px-4 py-2 lg:py-4 sticky top-0 z-5"
|
|
>
|
|
<div className="container mx-auto flex items-center">
|
|
<Link to="/" className="flex items-start gap-1">
|
|
<img src={logo} className="h-6 lg:h-8" />
|
|
<span className="text-muted-foreground text-xs">Estúdio</span>
|
|
</Link>
|
|
|
|
<div className="ml-auto">
|
|
<NavUser user={user} />
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<main className="p-4">
|
|
<div className="container mx-auto">
|
|
<Outlet />
|
|
</div>
|
|
</main>
|
|
</div>
|
|
)
|
|
}
|