refactor(prefetch): give the workspace-file seed its own module and tests

Author: waleedlatif1

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

@@ -15,14 +15,10 @@ import {
  * the Owner column — under the same query keys their client hooks (`useWorkspaceFileFolders`) use
  * (scope `active`), so the browser paints populated on first render.
  *
- * The FILE LIST itself is deliberately not here: the sidebar reads it on every workspace route, so
- * it is seeded by `prefetchWorkspaceSidebar` in the layout — the only boundary that renders
- * before the sidebar registers the query. Prefetching it again here would re-read it per request
- * and still not reach the server render (`HydrationBoundary` defers an already-seen query to an
- * effect, which SSR never runs). See the note on that entry. The layout declines to seed a
- * workspace whose file list exceeds its payload budget; recovering those here would mean
- * mirroring that budget check inversely, since an unconditional prefetch would re-read and
- * duplicate the entry for every workspace under the budget.
+ * The FILE LIST itself is not here: the workspace layout seeds it, because only the first boundary
+ * to touch a key can reach the server render — `HydrationBoundary` defers an already-registered
+ * query to a `useEffect` SSR never runs, and the sidebar registers this key on every route even
+ * with its own fetch disabled.
  *
  * Folders and the chrome reads all go through the data layer, shaped to their route contracts so a
  * hydrated entry matches a client fetch.

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

@@ -97,10 +97,7 @@ vi.mock('@sim/emcn', () => ({
 
 import { prefetchFilesBrowser } from '@/app/workspace/[workspaceId]/files/prefetch'
 import { prefetchKnowledgeBases } from '@/app/workspace/[workspaceId]/knowledge/prefetch'
-import {
-  prefetchWorkspaceSidebar,
-  WORKSPACE_FILE_SEED_MAX,
-} from '@/app/workspace/[workspaceId]/prefetch'
+import { prefetchWorkspaceSidebar } from '@/app/workspace/[workspaceId]/prefetch'
 import { prefetchTables } from '@/app/workspace/[workspaceId]/tables/prefetch'
 import { folderKeys } from '@/hooks/queries/utils/folder-keys'
 import { knowledgeKeys } from '@/hooks/queries/utils/knowledge-keys'
@@ -357,11 +354,10 @@ describe('workspace list prefetches', () => {
     })
 
     /**
-     * The FILE LIST is deliberately not primed here — `prefetchWorkspaceSidebar` owns it, because the
-     * sidebar reads that query on every workspace route and therefore registers it before any page
-     * renders. `HydrationBoundary` hands an already-seen query to a `useEffect`, which SSR never runs,
-     * so a page-level prefetch of this key costs a request per render and still cannot reach the server
-     * render. Restoring it here would reintroduce exactly that.
+     * The FILE LIST is deliberately not primed here — `prefetchWorkspaceSidebar` owns it. The
+     * sidebar registers that query on every workspace route (a disabled query still registers), and
+     * `HydrationBoundary` hands an already-registered query to a `useEffect` SSR never runs, so a
+     * page-level seed costs a read per render and still cannot reach the server render.
      */
     it('leaves the file list to the layout rather than re-reading it per page', async () => {
       const client = makeClient()
@@ -514,40 +510,19 @@ describe('workspace list prefetches', () => {
     })
 
     /**
-     * The file list is seeded on every workspace route, so it is the one entry whose size
-     * scales with a workspace's content on routes that never read it. The budget is passed
-     * down rather than applied here, so the read can stop before the share join.
+     * The layout is the only boundary that can reach the server render for this key, so it is the
+     * one that seeds it — see the note on the entry itself.
      */
-    it('seeds the file list, bounded by the document payload budget', async () => {
+    it('seeds the workspace file list', async () => {
       const files = [{ id: 'file-1', name: 'a.txt' }]
       mockListWorkspaceFilesWithShares.mockResolvedValue(files)
       const client = makeClient()
 
       await prefetchWorkspaceSidebar(client, WORKSPACE_ID, USER_ID, HOST_CONTEXT, null)
 
-      expect(mockListWorkspaceFilesWithShares).toHaveBeenCalledWith(WORKSPACE_ID, 'active', {
-        maxRows: WORKSPACE_FILE_SEED_MAX,
-        /** A failed read must reach the catch, not degrade to a cached empty list. */
-        throwOnError: true,
-      })
       expect(client.getQueryData(workspaceFilesKeys.list(WORKSPACE_ID, 'active'))).toEqual(files)
     })
 
-    /**
-     * The load-bearing half of the budget: a workspace over it seeds NOTHING rather than the
-     * prefix that was read. The sidebar search filters this list client-side and the Files
-     * browser renders it as the workspace's files, so a truncated seed would silently hide
-     * files — the client fetch must reach the route for the complete list instead.
-     */
-    it('seeds nothing when the workspace exceeds the budget', async () => {
-      mockListWorkspaceFilesWithShares.mockResolvedValue(null)
-      const client = makeClient()
-
-      await prefetchWorkspaceSidebar(client, WORKSPACE_ID, USER_ID, HOST_CONTEXT, null)
-
-      expect(client.getQueryData(workspaceFilesKeys.list(WORKSPACE_ID, 'active'))).toBeUndefined()
-    })
-
     /** A failed file read is an optimization loss, not a render failure. */
     it('does not throw when the file read rejects, and seeds no files', async () => {
       mockListWorkspaceFilesWithShares.mockRejectedValue(new Error('500'))

apps/sim/app/workspace/[workspaceId]/lib/seed-workspace-files.test.ts

@@ -0,0 +1,80 @@
+/**
+ * @vitest-environment node
+ */
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+const { mockListWorkspaceFilesWithShares } = vi.hoisted(() => ({
+  mockListWorkspaceFilesWithShares: vi.fn(),
+}))
+
+vi.mock('@/lib/workspace-files/queries', () => ({
+  listWorkspaceFilesWithShares: mockListWorkspaceFilesWithShares,
+}))
+
+/** The key factory lives in a `'use client'` module that pulls emcn's CSS at import. */
+vi.mock('@sim/emcn', () => ({
+  toast: { success: vi.fn(), error: vi.fn() },
+}))
+
+import {
+  seedWorkspaceFiles,
+  WORKSPACE_FILE_SEED_MAX,
+} from '@/app/workspace/[workspaceId]/lib/seed-workspace-files'
+import { workspaceFilesKeys } from '@/hooks/queries/workspace-files'
+
+const WORKSPACE_ID = 'ws-123'
+
+function makeClient() {
+  const store = new Map<string, unknown>()
+  return {
+    setQueryData: (key: readonly unknown[], value: unknown) =>
+      store.set(JSON.stringify(key), value),
+    getQueryData: (key: readonly unknown[]) => store.get(JSON.stringify(key)),
+  } as never as import('@tanstack/react-query').QueryClient & {
+    getQueryData: (key: readonly unknown[]) => unknown
+  }
+}
+
+describe('seedWorkspaceFiles', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+  })
+
+  it('seeds the file list, bounded by the document payload budget', async () => {
+    const files = [{ id: 'file-1', name: 'a.txt' }]
+    mockListWorkspaceFilesWithShares.mockResolvedValue(files)
+    const client = makeClient()
+
+    await seedWorkspaceFiles(client, WORKSPACE_ID)
+
+    expect(mockListWorkspaceFilesWithShares).toHaveBeenCalledWith(WORKSPACE_ID, 'active', {
+      maxRows: WORKSPACE_FILE_SEED_MAX,
+      /** A failed read must reach the catch, not degrade to a cached empty list. */
+      throwOnError: true,
+    })
+    expect(client.getQueryData(workspaceFilesKeys.list(WORKSPACE_ID, 'active'))).toEqual(files)
+  })
+
+  /**
+   * A workspace over the budget seeds NOTHING rather than the prefix that was read: the
+   * Files browser renders this list as the workspace's files, so a truncated seed would
+   * silently hide some. The client fetch reaches the route for the complete list instead.
+   */
+  it('seeds nothing when the workspace exceeds the budget', async () => {
+    mockListWorkspaceFilesWithShares.mockResolvedValue(null)
+    const client = makeClient()
+
+    await seedWorkspaceFiles(client, WORKSPACE_ID)
+
+    expect(client.getQueryData(workspaceFilesKeys.list(WORKSPACE_ID, 'active'))).toBeUndefined()
+  })
+
+  /** A failed read is an optimization loss, not a render failure. */
+  it('does not throw when the read rejects, and seeds nothing', async () => {
+    mockListWorkspaceFilesWithShares.mockRejectedValue(new Error('500'))
+    const client = makeClient()
+
+    await expect(seedWorkspaceFiles(client, WORKSPACE_ID)).resolves.toBeUndefined()
+    expect(client.getQueryData(workspaceFilesKeys.list(WORKSPACE_ID, 'active'))).toBeUndefined()
+  })
+})

apps/sim/app/workspace/[workspaceId]/lib/seed-workspace-files.ts

@@ -0,0 +1,48 @@
+import { createLogger } from '@sim/logger'
+import { getErrorMessage } from '@sim/utils/errors'
+import type { QueryClient } from '@tanstack/react-query'
+import { listWorkspaceFilesWithShares } from '@/lib/workspace-files/queries'
+import { workspaceFilesKeys } from '@/hooks/queries/workspace-files'
+
+const logger = createLogger('SeedWorkspaceFiles')
+
+/**
+ * How many files a page is willing to inline into its document. At ~500 bytes of JSON per
+ * file this budgets the entry at ~150 KB.
+ *
+ * A workspace above the budget seeds NOTHING rather than a prefix: the Files browser
+ * renders this list as the workspace's files, so a truncated seed would silently hide some.
+ */
+export const WORKSPACE_FILE_SEED_MAX = 300
+
+/**
+ * Seeds the workspace's file list for the pages that render it.
+ *
+ * Seeded rather than prefetched so it can decline to create an entry at all above
+ * {@link WORKSPACE_FILE_SEED_MAX} — `prefetchQuery` always creates one, and a partial
+ * entry would be read as the whole list. Parsed through the route's response contract, so
+ * a seeded entry matches what a client fetch caches.
+ */
+export async function seedWorkspaceFiles(
+  queryClient: QueryClient,
+  workspaceId: string
+): Promise<void> {
+  try {
+    const files = await listWorkspaceFilesWithShares(workspaceId, 'active', {
+      maxRows: WORKSPACE_FILE_SEED_MAX,
+      /**
+       * A failed read must reach the catch below, not degrade to an empty list: seeding
+       * `[]` would cache "this workspace has no files" as authoritative for the entry's
+       * lifetime, which is worse than seeding nothing and letting the client fetch.
+       */
+      throwOnError: true,
+    })
+    if (!files) return
+    queryClient.setQueryData(workspaceFilesKeys.list(workspaceId, 'active'), files)
+  } catch (error) {
+    /** Optimization only: the client fetch reaches the route instead. */
+    logger.warn('Workspace file list seed failed; client will fetch', {
+      error: getErrorMessage(error),
+    })
+  }
+}

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

@@ -6,11 +6,11 @@ import { listMothershipChats } from '@/lib/copilot/chat/list-mothership-chats'
 import { isChatEnabled } from '@/lib/core/config/env-flags'
 import { getUserProfile } from '@/lib/users/queries'
 import { listWorkflowsForUser } from '@/lib/workflows/queries'
-import { listWorkspaceFilesWithShares } from '@/lib/workspace-files/queries'
 import { getWorkspaceHostContextForViewer } from '@/lib/workspaces/host-context'
 import { listWorkspacesForViewer } from '@/lib/workspaces/list'
 import { getWorkspacePermissionsForAuthorizedViewer } from '@/lib/workspaces/permissions/utils'
 import { prefetchResourceFolders } from '@/app/workspace/[workspaceId]/lib/prefetch-resource-folders'
+import { seedWorkspaceFiles } from '@/app/workspace/[workspaceId]/lib/seed-workspace-files'
 import {
   MOTHERSHIP_CHAT_LIST_STALE_TIME,
   mapChat,
@@ -25,7 +25,6 @@ import { workflowKeys } from '@/hooks/queries/utils/workflow-keys'
 import { mapWorkflow, WORKFLOW_LIST_STALE_TIME } from '@/hooks/queries/utils/workflow-list-query'
 import { normalizeWorkspacesResponse } from '@/hooks/queries/utils/workspace-list-query'
 import { WORKSPACE_PERMISSIONS_STALE_TIME, workspaceKeys } from '@/hooks/queries/workspace'
-import { workspaceFilesKeys } from '@/hooks/queries/workspace-files'
 import {
   WORKSPACE_HOST_CONTEXT_STALE_TIME,
   workspaceHostKeys,
@@ -92,46 +91,6 @@ async function seedWorkspaceList(
   }
 }
 
-/**
- * How many files the layout is willing to inline into the document. Seeded on EVERY
- * workspace route, so at ~500 bytes of JSON per file this budgets the entry at ~150 KB.
- *
- * A workspace above the budget seeds NOTHING rather than a prefix: the sidebar filters
- * this list client-side, so a truncated seed would silently hide files.
- */
-export const WORKSPACE_FILE_SEED_MAX = 300
-
-/**
- * Seeds the workspace's file list, which sidebar chrome registers on EVERY workspace
- * route. It must be seeded HERE, not by the Files pages: `HydrationBoundary` defers a
- * query the cache has already seen to a `useEffect`, which SSR never runs.
- *
- * Seeded rather than prefetched so it can decline to create an entry at all above
- * {@link WORKSPACE_FILE_SEED_MAX} — `prefetchQuery` always creates one, and a partial
- * entry would be read as the whole list. Parsed through the route's response contract.
- */
-async function seedWorkspaceFiles(queryClient: QueryClient, workspaceId: string): Promise<void> {
-  try {
-    const files = await listWorkspaceFilesWithShares(workspaceId, 'active', {
-      maxRows: WORKSPACE_FILE_SEED_MAX,
-      /**
-       * A failed read must reach the catch below, not degrade to an empty list: seeding
-       * `[]` would cache "this workspace has no files" as authoritative for the entry's
-       * lifetime, which is worse than seeding nothing and letting the client fetch.
-       */
-      throwOnError: true,
-    })
-    if (!files) return
-    queryClient.setQueryData(workspaceFilesKeys.list(workspaceId, 'active'), files)
-  } catch (error) {
-    /** Optimization only: the client fetch reaches the route instead. Logged so drift between
-     * this read and the contract's response schema doesn't degrade silently into a waterfall. */
-    logger.warn('Workspace file list seed failed; client will fetch', {
-      error: getErrorMessage(error),
-    })
-  }
-}
-
 /**
  * Prefetches the sidebar's workflow, chat, folder, workspace-permissions,
  * workspace, and viewer-profile reads for a workspace and stores them under the
@@ -190,6 +149,14 @@ export async function prefetchWorkspaceSidebar(
         ]
       : []),
     prefetchResourceFolders(queryClient, workspaceId, 'workflow', userId),
+    /**
+     * Seeded from the layout, not from the pages that render the list. `enabled: false` stops the
+     * sidebar's query from FETCHING but not from registering: `useQuery` builds its observer
+     * unconditionally, and the observer's constructor calls `queryCache.build()`, which adds the
+     * key. `HydrationBoundary` then defers an already-registered query to a `useEffect` SSR never
+     * runs — so only the first boundary to touch the key can reach the server render, and that is
+     * this one.
+     */
     seedWorkspaceFiles(queryClient, workspaceId),
     queryClient.prefetchQuery({
       queryKey: workspaceKeys.permissions(workspaceId),