118 lines
3.4 KiB
TypeScript
118 lines
3.4 KiB
TypeScript
import type { Route } from './+types/route'
|
|
|
|
import * as cookie from 'cookie'
|
|
import { Outlet, type ShouldRevalidateFunctionArgs } from 'react-router'
|
|
import { useEffect } from 'react'
|
|
|
|
import { request as req } from '@repo/util/request'
|
|
import {
|
|
WorkspaceProvider,
|
|
type Workspace
|
|
} from '@/components/workspace-switcher'
|
|
import { userContext } from '@repo/auth/context'
|
|
import { Toaster } from '@repo/ui/components/ui/sonner'
|
|
import { authMiddleware } from '@repo/auth/middleware/auth'
|
|
import { ModeToggle, ThemedImage } from '@repo/ui/components/dark-mode'
|
|
import { NavUser } from '@repo/ui/components/nav-user'
|
|
import {
|
|
SidebarInset,
|
|
SidebarProvider,
|
|
SidebarTrigger
|
|
} from '@repo/ui/components/ui/sidebar'
|
|
|
|
import { AppSidebar } from '@/components/app-sidebar'
|
|
|
|
// import { Notification } from '@/components/notification'
|
|
|
|
export const middleware: Route.MiddlewareFunction[] = [authMiddleware]
|
|
|
|
export async function loader({ params, context, request }: Route.ActionArgs) {
|
|
const user = context.get(userContext)!
|
|
const rawCookie = request.headers.get('cookie') || ''
|
|
const parsedCookies = cookie.parse(rawCookie)
|
|
const { sidebar_state = 'true' } = parsedCookies
|
|
|
|
const r = await req({
|
|
url: `/users/${user.sub}/orgs?limit=25`,
|
|
request,
|
|
context
|
|
})
|
|
|
|
if (!r.ok) {
|
|
throw new Response(await r.text(), { status: r.status })
|
|
}
|
|
|
|
const { items = [] } = (await r.json()) as { items: { sk: string }[] }
|
|
const orgs = items.map(({ sk, ...props }) => {
|
|
const [, id] = sk?.split('#')
|
|
return { ...props, id }
|
|
})
|
|
const exists = orgs.some(({ id }) => id === params.orgid)
|
|
|
|
if (exists) {
|
|
return { user, orgs, sidebar_state }
|
|
}
|
|
|
|
throw new Response(null, { status: 401 })
|
|
}
|
|
|
|
export function shouldRevalidate({
|
|
currentParams,
|
|
nextParams
|
|
}: ShouldRevalidateFunctionArgs) {
|
|
return currentParams.orgid !== nextParams.orgid
|
|
}
|
|
|
|
export default function Route({ loaderData }: Route.ComponentProps) {
|
|
const { user, orgs, sidebar_state } = loaderData
|
|
|
|
useEffect(() => {
|
|
if (typeof window !== 'undefined' && window.rybbit) {
|
|
window.rybbit.identify(user.sub, {
|
|
username: user.email,
|
|
name: user.name,
|
|
email: user.email
|
|
})
|
|
}
|
|
}, [])
|
|
|
|
return (
|
|
<WorkspaceProvider workspaces={orgs as Workspace[]}>
|
|
<SidebarProvider defaultOpen={sidebar_state === 'true'} className="flex">
|
|
<AppSidebar />
|
|
|
|
<SidebarInset 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-10"
|
|
>
|
|
<div className="container mx-auto flex items-center max-w-7xl">
|
|
<SidebarTrigger className="md:hidden" />
|
|
<ThemedImage className="max-md:hidden" />
|
|
|
|
<div className="ml-auto flex gap-2.5 items-center">
|
|
{/*<Notification />*/}
|
|
<ModeToggle />
|
|
<NavUser user={user} excludeApps={['admin']} />
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<div className="p-4">
|
|
<div className="container mx-auto relative max-w-7xl">
|
|
<Outlet />
|
|
|
|
<Toaster
|
|
position="top-center"
|
|
richColors={true}
|
|
duration={Infinity}
|
|
closeButton={true}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</SidebarInset>
|
|
</SidebarProvider>
|
|
</WorkspaceProvider>
|
|
)
|
|
}
|