Function WorkspacePage

apps/sim/app/workspace/page.tsx:15–80

()

const logger = createLogger('WorkspacePage')

export default function WorkspacePage() {
  const router = useRouter()
  const { data: session, isPending: isSessionPending } = useSession()
  const isAuthenticated = !isSessionPending && !!session?.user
  const hasRedirectedRef = useRef(false)

  const { data, isLoading: isWorkspacesLoading } = useWorkspacesWithMetadata(isAuthenticated)

  useEffect(() => {
    if (isSessionPending || hasRedirectedRef.current) return

    if (!session?.user) {
      logger.info('User not authenticated, redirecting to login')
      router.replace('/login')
      return
    }

    if (isWorkspacesLoading || !data) return

    hasRedirectedRef.current = true

    const urlParams = new URLSearchParams(window.location.search)
    const redirectWorkflowId = urlParams.get('redirect_workflow')

    const { workspaces, lastActiveWorkspaceId, creationPolicy } = data

    if (workspaces.length === 0) {
      handleNoWorkspaces(router, creationPolicy)
      return
    }

    const localRecentId = WorkspaceRecencyStorage.getMostRecent()
    const findWorkspace = (id: string | null) =>
      id ? workspaces.find((w) => w.id === id) : undefined

    const targetWorkspace =
      findWorkspace(localRecentId) ?? findWorkspace(lastActiveWorkspaceId) ?? workspaces[0]

    if (redirectWorkflowId) {
      handleWorkflowRedirect(redirectWorkflowId, targetWorkspace.id, router)
      return
    }

    logger.info(`Redirecting to workspace: ${targetWorkspace.id}`)
    router.replace(`/workspace/${targetWorkspace.id}/home`)
  }, [session, isSessionPending, isWorkspacesLoading, data, router])

  if (isSessionPending || isWorkspacesLoading) {
    return (
      <div className='flex h-screen w-full items-center justify-center'>
        <div
          className='size-[18px] animate-spin rounded-full'
          style={{
            background:
              'conic-gradient(from 0deg, hsl(var(--muted-foreground)) 0deg 120deg, transparent 120deg 180deg, hsl(var(--muted-foreground)) 180deg 300deg, transparent 300deg 360deg)',
            mask: 'radial-gradient(farthest-side, transparent calc(100% - 1.5px), black calc(100% - 1.5px))',
            WebkitMask:
              'radial-gradient(farthest-side, transparent calc(100% - 1.5px), black calc(100% - 1.5px))',