improvement(sidebar): prefetch workspace list server-side so the switcher never flashes loading

apps/sim/app/_shell/providers/session-provider.tsx

@@ -8,6 +8,7 @@ import { client } from '@/lib/auth/auth-client'
 import {
  type AppSession,
  extractSessionDataFromAuthClientResult,
+ getActiveOrganizationId,
 } from '@/lib/auth/session-response'
 import { sessionKeys, useSessionQuery } from '@/hooks/queries/session'
 
@@ -71,7 +72,7 @@ export function SessionProvider({ children }: { children: React.ReactNode }) {
  queryClient.invalidateQueries({ queryKey: ['organizations'] })
  queryClient.invalidateQueries({ queryKey: ['subscription'] })
 
- const activeOrganizationId = session?.session?.activeOrganizationId ?? null
+ const activeOrganizationId = getActiveOrganizationId(session)
  if (!session || activeOrganizationId) {
  return
  }

apps/sim/app/api/workspaces/route.ts

@@ -1,6 +1,6 @@
 import { AuditAction, AuditResourceType, recordAudit } from '@sim/audit'
 import { db } from '@sim/db'
-import { permissions, settings, type WorkspaceMode, workflow, workspace } from '@sim/db/schema'
+import { permissions, type WorkspaceMode, workflow, workspace } from '@sim/db/schema'
 import { createLogger } from '@sim/logger'
 import { generateId } from '@sim/utils/id'
 import { and, eq, isNull } from 'drizzle-orm'
@@ -9,24 +9,20 @@ import { listWorkspacesQuerySchema } from '@/lib/api/contracts'
 import { createWorkspaceContract } from '@/lib/api/contracts/workspaces'
 import { parseRequest } from '@/lib/api/server'
 import { getSession } from '@/lib/auth'
-import type { PlanCategory } from '@/lib/billing/plan-helpers'
+import { getActiveOrganizationId } from '@/lib/auth/session-response'
 import { PlatformEvents } from '@/lib/core/telemetry'
 import { withRouteHandler } from '@/lib/core/utils/with-route-handler'
 import { captureServerEvent } from '@/lib/posthog/server'
 import { buildDefaultWorkflowArtifacts } from '@/lib/workflows/defaults'
 import { saveWorkflowToNormalizedTables } from '@/lib/workflows/persistence/utils'
 import { getRandomWorkspaceColor } from '@/lib/workspaces/colors'
+import { listWorkspacesForViewer } from '@/lib/workspaces/list'
 import {
- CONTACT_OWNER_TO_UPGRADE_REASON,
- evaluateWorkspaceInvitePolicy,
- getInvitePlanCategoryForOrganization,
- getInvitePlanCategoryForUser,
  getWorkspaceCreationPolicy,
  getWorkspaceInvitePolicy,
-UPGRADE_TO_INVITE_REASON,
+resolveInviteFlags,
  WORKSPACE_MODE,
 } from '@/lib/workspaces/policy'
-import { listAccessibleWorkspaceRowsForUser } from '@/lib/workspaces/utils'
 
 const logger = createLogger('Workspaces')
 
@@ -38,13 +34,6 @@ export const GET = withRouteHandler(async (request: Request) => {
  return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
  }
 
- const activeOrganizationId =
- (session.session as { activeOrganizationId?: string } | null)?.activeOrganizationId ?? null
- const creationPolicy = await getWorkspaceCreationPolicy({
- userId: session.user.id,
- activeOrganizationId,
- })
-
  const scopeResult = listWorkspacesQuerySchema.safeParse(
  Object.fromEntries(new URL(request.url).searchParams.entries())
  )
@@ -56,20 +45,15 @@ export const GET = withRouteHandler(async (request: Request) => {
  }
  const { scope } = scopeResult.data
 
- const settingsQuery = db
- .select({ lastActiveWorkspaceId: settings.lastActiveWorkspaceId })
- .from(settings)
- .where(eq(settings.userId, session.user.id))
- .limit(1)
-
- const [userWorkspaces, userSettings] = await Promise.all([
- listAccessibleWorkspaceRowsForUser(session.user.id, scope),
- settingsQuery,
- ])
-
- const lastActiveWorkspaceId = userSettings[0]?.lastActiveWorkspaceId ?? null
+ const activeOrganizationId = getActiveOrganizationId(session)
+ const payload = await listWorkspacesForViewer({
+ userId: session.user.id,
+ activeOrganizationId,
+ scope,
+ })
+ const { lastActiveWorkspaceId, creationPolicy } = payload
 
- if (scope === 'active' && userWorkspaces.length === 0) {
+ if (scope === 'active' && payload.workspaces.length === 0) {
  if (!creationPolicy.canCreate) {
  return NextResponse.json({ workspaces: [], lastActiveWorkspaceId, creationPolicy })
  }
@@ -95,76 +79,10 @@ export const GET = withRouteHandler(async (request: Request) => {
  }
 
  if (scope === 'active') {
- await ensureWorkflowsHaveWorkspace(session.user.id, userWorkspaces[0].workspace.id)
+ await ensureWorkflowsHaveWorkspace(session.user.id, payload.workspaces[0].id)
  }
 
- const nonOrgBilledUserIds = [
- ...new Set(
- userWorkspaces
- .filter(({ workspace: ws }) => ws.workspaceMode !== WORKSPACE_MODE.ORGANIZATION)
- .map(({ workspace: ws }) => ws.billedAccountUserId)
- ),
- ]
- const orgIds = [
- ...new Set(
- userWorkspaces
- .filter(
- ({ workspace: ws }) =>
- ws.workspaceMode === WORKSPACE_MODE.ORGANIZATION && ws.organizationId
- )
- .map(({ workspace: ws }) => ws.organizationId as string)
- ),
- ]
- const planCategoryByBilledUser = new Map<string, PlanCategory>()
- const planCategoryByOrg = new Map<string, PlanCategory>()
- await Promise.all([
- ...nonOrgBilledUserIds.map(async (userId) => {
- planCategoryByBilledUser.set(userId, await getInvitePlanCategoryForUser(userId))
- }),
- ...orgIds.map(async (orgId) => {
- planCategoryByOrg.set(orgId, await getInvitePlanCategoryForOrganization(orgId))
- }),
- ])
-
- const workspacesWithPermissions = userWorkspaces.map(
- ({ workspace: workspaceDetails, permissionType }) => {
- const billedPlanCategory: PlanCategory =
- workspaceDetails.workspaceMode === WORKSPACE_MODE.ORGANIZATION
- ? workspaceDetails.organizationId
- ? (planCategoryByOrg.get(workspaceDetails.organizationId) ?? 'free')
- : 'free'
- : (planCategoryByBilledUser.get(workspaceDetails.billedAccountUserId) ?? 'free')
- const invitePolicy = evaluateWorkspaceInvitePolicy(workspaceDetails, { billedPlanCategory })
- const callerIsBilledUser = workspaceDetails.billedAccountUserId === session.user.id
-
- const canActOnUpgrade = invitePolicy.upgradeRequired && callerIsBilledUser
- const inviteDisabledReason = invitePolicy.allowed
- ? null
- : callerIsBilledUser
- ? (invitePolicy.reason ?? UPGRADE_TO_INVITE_REASON)
- : CONTACT_OWNER_TO_UPGRADE_REASON
-
- return {
- ...workspaceDetails,
- role:
- workspaceDetails.ownerId === session.user.id
- ? 'owner'
- : permissionType === 'admin'
- ? 'admin'
- : 'member',
- permissions: permissionType,
- inviteMembersEnabled: invitePolicy.allowed,
- inviteDisabledReason,
- inviteUpgradeRequired: canActOnUpgrade,
- }
- }
- )
-
- return NextResponse.json({
- workspaces: workspacesWithPermissions,
- lastActiveWorkspaceId,
- creationPolicy,
- })
+ return NextResponse.json(payload)
 })
 
 // POST /api/workspaces - Create a new workspace
@@ -179,8 +97,7 @@ export const POST = withRouteHandler(async (req: NextRequest) => {
  const parsed = await parseRequest(createWorkspaceContract, req, {})
  if (!parsed.success) return parsed.response
  const { name, color, skipDefaultWorkflow } = parsed.data.body
- const activeOrganizationId =
- (session.session as { activeOrganizationId?: string } | null)?.activeOrganizationId ?? null
+ const activeOrganizationId = getActiveOrganizationId(session)
  const creationPolicy = await getWorkspaceCreationPolicy({
  userId: session.user.id,
  activeOrganizationId,
@@ -380,13 +297,6 @@ async function createWorkspace({
  billedAccountUserId,
  ownerId: userId,
  })
- const callerIsBilledUser = billedAccountUserId === userId
- const canActOnUpgrade = invitePolicy.upgradeRequired && callerIsBilledUser
- const inviteDisabledReason = invitePolicy.allowed
- ? null
- : callerIsBilledUser
- ? (invitePolicy.reason ?? UPGRADE_TO_INVITE_REASON)
- : CONTACT_OWNER_TO_UPGRADE_REASON
 
  return {
  id: workspaceId,
@@ -401,9 +311,7 @@ async function createWorkspace({
  updatedAt: now,
  role: 'owner',
  permissions: 'admin',
- inviteMembersEnabled: invitePolicy.allowed,
- inviteDisabledReason,
- inviteUpgradeRequired: canActOnUpgrade,
+ ...resolveInviteFlags(invitePolicy, billedAccountUserId === userId),
  }
 }
 

apps/sim/app/workspace/[workspaceId]/layout.test.tsx

@@ -157,7 +157,8 @@ describe('WorkspaceLayout host context', () => {
  expect.anything(),
  'workspace-b',
  'viewer-1',
- HOST_CONTEXT
+ HOST_CONTEXT,
+ 'org-a'
  )
  expect(mockBrandingProvider).toHaveBeenCalledWith(
  expect.objectContaining({

apps/sim/app/workspace/[workspaceId]/layout.tsx

@@ -3,6 +3,7 @@ import { dehydrate, HydrationBoundary } from '@tanstack/react-query'
 import { cookies } from 'next/headers'
 import { redirect } from 'next/navigation'
 import { getSession } from '@/lib/auth'
+import { getActiveOrganizationId } from '@/lib/auth/session-response'
 import { getQueryClient } from '@/app/_shell/providers/get-query-client'
 import {
  ImpersonationBanner,
@@ -44,12 +45,19 @@ export default async function WorkspaceLayout({
  return <WorkspaceAccessDenied />
  }
 
+ const activeOrganizationId = getActiveOrganizationId(session)
  const [cookieStore, initialOrgSettings] = await Promise.all([
  cookies(),
  hostContext.hostOrganizationId
  ? getOrgWhitelabelSettings(hostContext.hostOrganizationId)
  : Promise.resolve(null),
- prefetchWorkspaceSidebar(queryClient, workspaceId, session.user.id, hostContext),
+ prefetchWorkspaceSidebar(
+ queryClient,
+ workspaceId,
+ session.user.id,
+ hostContext,
+ activeOrganizationId
+ ),
  ])
  const initialSidebarCollapsed = cookieStore.get('sidebar_collapsed')?.value === '1'
 

apps/sim/app/workspace/[workspaceId]/prefetch.ts

@@ -1,9 +1,10 @@
 import type { QueryClient } from '@tanstack/react-query'
-import type { WorkspaceHostContext } from '@/lib/api/contracts/workspaces'
+import { listWorkspacesContract, type WorkspaceHostContext } from '@/lib/api/contracts/workspaces'
 import { listMothershipChats } from '@/lib/copilot/chat/list-mothership-chats'
 import { listFoldersForWorkspace } from '@/lib/folders/queries'
 import { listWorkflowsForUser } from '@/lib/workflows/queries'
 import { getWorkspaceHostContextForViewer } from '@/lib/workspaces/host-context'
+import { listWorkspacesForViewer } from '@/lib/workspaces/list'
 import { getWorkspacePermissionsForAuthorizedViewer } from '@/lib/workspaces/permissions/utils'
 import { FOLDER_LIST_STALE_TIME, mapFolder } from '@/hooks/queries/folders'
 import {
@@ -14,6 +15,10 @@ import {
 import { folderKeys } from '@/hooks/queries/utils/folder-keys'
 import { workflowKeys } from '@/hooks/queries/utils/workflow-keys'
 import { mapWorkflow, WORKFLOW_LIST_STALE_TIME } from '@/hooks/queries/utils/workflow-list-query'
+import {
+ normalizeWorkspacesResponse,
+ WORKSPACE_LIST_STALE_TIME,
+} from '@/hooks/queries/utils/workspace-list-query'
 import { WORKSPACE_PERMISSIONS_STALE_TIME, workspaceKeys } from '@/hooks/queries/workspace'
 import {
  WORKSPACE_HOST_CONTEXT_STALE_TIME,
@@ -37,22 +42,27 @@ export function prefetchWorkspaceHostContext(
 }
 
 /**
- * Prefetches the sidebar's workflow, chat, folder, and workspace-permissions lists for
- * a workspace and stores them under the same query keys + mappers the client hooks use,
- * so the persistent sidebar paints populated on the first server render instead of
- * flashing skeletons on a cold load (e.g. after the browser discards an idle tab). Calls
- * the data layer directly — the same functions the API routes use — with no internal
- * HTTP hop.
+ * Prefetches the sidebar's workflow, chat, folder, workspace-permissions, and
+ * workspace lists for a workspace and stores them under the same query keys +
+ * mappers the client hooks use, so the persistent sidebar (including the
+ * workspace switcher header) paints populated on the first server render
+ * instead of flashing skeletons on a cold load (e.g. after the browser
+ * discards an idle tab). Calls the data layer directly — the same functions
+ * the API routes use — with no internal HTTP hop.
  *
  * The host context is the authorization proof for this server-render pass, so
  * permission prefetch can reuse its effective permission without repeating
- * workspace and membership reads.
+ * workspace and membership reads. It also proves the viewer has at least one
+ * accessible workspace, which is why the workspace-list prefetch can safely
+ * skip the route's empty-list default-workspace creation path — and the
+ * route's orphaned-workflow repair, which still runs on client refetches.
  */
 export async function prefetchWorkspaceSidebar(
  queryClient: QueryClient,
  workspaceId: string,
  userId: string,
- hostContext: WorkspaceHostContext
+ hostContext: WorkspaceHostContext,
+ activeOrganizationId: string | null
 ): Promise<void> {
  if (hostContext.workspace.id !== workspaceId) return
  await Promise.all([
@@ -80,6 +90,27 @@ export async function prefetchWorkspaceSidebar(
  },
  staleTime: FOLDER_LIST_STALE_TIME,
  }),
+ queryClient.prefetchQuery({
+ queryKey: workspaceKeys.list('active'),
+ queryFn: async () => {
+ const payload = await listWorkspacesForViewer({
+ userId,
+ activeOrganizationId,
+ scope: 'active',
+ })
+ // An empty list means GET /api/workspaces' default-workspace creation
+ // path must run — throw so prefetchQuery caches nothing and the client
+ // fetch reaches the route.
+ if (payload.workspaces.length === 0) {
+ throw new Error('Empty workspace list requires the route creation path')
+ }
+ // Parsing through the route contract's response schema strips the same
+ // server-only fields `requestJson` strips on the client, guaranteeing the
+ // cached shape is identical to a client fetch.
+ return normalizeWorkspacesResponse(listWorkspacesContract.response.schema.parse(payload))
+ },
+ staleTime: WORKSPACE_LIST_STALE_TIME,
+ }),
  queryClient.prefetchQuery({
  queryKey: workspaceKeys.permissions(workspaceId),
  queryFn: () =>

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workspace-header/workspace-header.tsx

@@ -34,6 +34,15 @@ import { useSettingsNavigation } from '@/hooks/use-settings-navigation'
 
 const logger = createLogger('WorkspaceHeader')
 
+/**
+ * Derives the single-letter avatar initial for a workspace, ignoring the word
+ * "workspace" in the name (e.g. "Acme Workspace" → "A").
+ */
+function getWorkspaceInitial(name: string | undefined): string {
+ const stripped = (name ?? '').replace(/workspace/gi, '').trim()
+ return (stripped[0] || name?.[0] || 'W').toUpperCase()
+}
+
 interface DisabledReasonTooltipProps {
  reason: string | null
  children: ReactElement
@@ -182,11 +191,7 @@ function WorkspaceHeaderImpl({
  }
  }, [isWorkspaceMenuOpen, editingWorkspaceId, editingName, workspaces, onRenameWorkspace])
 
- const workspaceInitial = (() => {
- const name = activeWorkspace?.name || ''
- const stripped = name.replace(/workspace/gi, '').trim()
- return (stripped[0] || name[0] || 'W').toUpperCase()
- })()
+ const workspaceInitial = getWorkspaceInitial(activeWorkspace?.name)
 
  /**
  * Opens the context menu for a workspace at the specified position
@@ -418,8 +423,7 @@ function WorkspaceHeaderImpl({
  <>
  <div className='-mx-1.5 flex max-h-[94px] flex-col gap-0.5 overflow-y-auto px-1.5'>
  {workspaces.map((workspace) => {
- const stripped = workspace.name.replace(/workspace/gi, '').trim()
- const initial = (stripped[0] || workspace.name[0] || 'W').toUpperCase()
+ const initial = getWorkspaceInitial(workspace.name)
  const isActive = workspace.id === workspaceId
  const isMenuOpen = menuOpenWorkspaceId === workspace.id