add badge

apps/admin.saladeaula.digital/app/routes/_.$orgid/route.tsx

@@ -2,58 +2,58 @@ import type { Route } from './+types/route'
 
 import * as cookie from 'cookie'
 import { Outlet, type ShouldRevalidateFunctionArgs } from 'react-router'
-import { useEffect } from 'react'
+import { use, 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 { userContext } from '@repo/auth/context'
+import { request as req } from '@repo/util/request'
+import { authMiddleware } from '@repo/auth/middleware/auth'
+import { Toaster } from '@repo/ui/components/ui/sonner'
+import { ModeToggle, ThemedImage } from '@repo/ui/components/dark-mode'
+import { NavUser } from '@repo/ui/components/nav-user'
 
+import { WorkspaceProvider } from '@/components/workspace-switcher'
 import { AppSidebar } from '@/components/app-sidebar'
+import { workspaceMiddleware, workspaceContext } from '@/middleware/workspace'
 
 // import { Notification } from '@/components/notification'
 
-export const middleware: Route.MiddlewareFunction[] = [authMiddleware]
+export const middleware: Route.MiddlewareFunction[] = [
+  authMiddleware,
+  workspaceMiddleware
+]
 
 export async function loader({ params, context, request }: Route.ActionArgs) {
   const user = context.get(userContext)!
+  const { activeWorkspace, workspaces } = context.get(workspaceContext)
   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`,
+  const subscription = req({
+    url: `/orgs/${activeWorkspace.id}/subscription`,
     request,
     context
-  })
+  }).then((r) => r.json())
 
-  if (!r.ok) {
-    throw new Response(await r.text(), { status: r.status })
+  const address = req({
+    url: `/orgs/${activeWorkspace.id}/address`,
+    request,
+    context
+  }).then((r) => r.json())
+
+  return {
+    user,
+    activeWorkspace,
+    workspaces,
+    sidebar_state,
+    subscription,
+    address
   }
-
-  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({
@@ -64,7 +64,14 @@ export function shouldRevalidate({
 }
 
 export default function Route({ loaderData }: Route.ComponentProps) {
-  const { user, orgs, sidebar_state } = loaderData
+  const {
+    user,
+    activeWorkspace,
+    workspaces,
+    sidebar_state,
+    subscription: subscription_
+  } = loaderData
+  const subscription = use(subscription_)
 
   useEffect(() => {
     if (typeof window !== 'undefined' && window.rybbit) {
@@ -77,7 +84,11 @@ export default function Route({ loaderData }: Route.ComponentProps) {
   }, [])
 
   return (
-    <WorkspaceProvider workspaces={orgs as Workspace[]}>
+    <WorkspaceProvider
+      activeWorkspace={activeWorkspace}
+      workspaces={workspaces}
+      subscription={subscription}
+    >
       <SidebarProvider defaultOpen={sidebar_state === 'true'} className="flex">
         <AppSidebar />