eeff292
import { useT } from '@app/i18n'
import { IconLoader2 as Loader2 } from '@tabler/icons-react'
import { lazy, type ReactNode, Suspense } from 'react'
const WorkspaceRouteContent = lazy(() =>
import('./workspace-route').then((route) => ({ default: route.WorkspaceRouteContent })),
)
const NotFoundPage = lazy(() => import('@app/pages/not-found').then((page) => ({ default: page.NotFoundPage })))
const SpaceInvitePage = lazy(() => import('@app/pages/invite').then((page) => ({ default: page.SpaceInvitePage })))
function RoutePending() {
const { t } = useT()
return (
<main className="grid min-h-dvh place-items-center bg-background text-foreground" role="status">
<Loader2 size={22} className="animate-spin text-primary" aria-hidden />
<span className="sr-only">{t('common.action.loading')}</span>
</main>
)
}
function DeferredRoute({ children }: { children: ReactNode }) {
return <Suspense fallback={<RoutePending />}>{children}</Suspense>
}
export function WorkspaceRoute() {
return (
<DeferredRoute>
<WorkspaceRouteContent />
</DeferredRoute>
)
}
export function SpaceInviteRoute() {
return (
<DeferredRoute>
<SpaceInvitePage />
</DeferredRoute>
)
}
export function NotFoundRoute() {
return (
<DeferredRoute>
<NotFoundPage />
</DeferredRoute>
)
}