{"record":{"id":"03841878d0e42763","repo":"clockworklabs/SpacetimeDB","slug":"could-not-find-spacetimedb-client-did-you-forget","errorCode":null,"errorMessage":"Could not find SpacetimeDB client! Did you forget to add a `SpacetimeDBProvider`? `useTable` must be used in the React component tree under a `SpacetimeDBProvider` component.","messagePattern":"Could not find SpacetimeDB client! Did you forget to add a `SpacetimeDBProvider`\\? `useTable` must be used in the React component tree under a `SpacetimeDBProvider` component\\.","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"crates/bindings-typescript/src/react/useTable.ts","lineNumber":81,"sourceCode":" *   { onInsert: (row) => console.log('New user:', row) }\n * );\n * ```\n */\nexport function useTable<TableDef extends UntypedTableDef>(\n  query: Query<TableDef>,\n  callbacks?: UseTableCallbacks<Prettify<RowType<TableDef>>>\n): [readonly Prettify<RowType<TableDef>>[], boolean] {\n  type UseTableRowType = RowType<TableDef>;\n  const enabled = callbacks?.enabled ?? true;\n  const accessorName = getQueryAccessorName(query);\n  const whereExpr = getQueryWhereClause(query);\n\n  const [subscribeApplied, setSubscribeApplied] = useState(false);\n  let connectionState: ConnectionState | undefined;\n  try {\n    connectionState = useSpacetimeDB();\n  } catch {\n    throw new Error(\n      'Could not find SpacetimeDB client! Did you forget to add a ' +\n        '`SpacetimeDBProvider`? `useTable` must be used in the React component tree ' +\n        'under a `SpacetimeDBProvider` component.'\n    );\n  }\n\n  const querySql = toSql(query);\n\n  const latestTransactionEventId = useRef<string | null>(null);\n  const lastSnapshotRef = useRef<\n    [readonly Prettify<UseTableRowType>[], boolean] | null\n  >(null);\n\n  const computeSnapshot = useCallback((): [\n    readonly Prettify<UseTableRowType>[],\n    boolean,\n  ] => {\n    if (!enabled) {","sourceCodeStart":63,"sourceCodeEnd":99,"githubUrl":"https://github.com/clockworklabs/SpacetimeDB/blob/524b4487d949b61a07d4f39c862d1290259dfd20/crates/bindings-typescript/src/react/useTable.ts#L63-L99","documentation":"useTable calls useSpacetimeDB() inside a try/catch; if the React context is missing (no SpacetimeDBProvider above the component) it swallows the original error and rethrows this useTable-specific message. Root cause is identical to the useSpacetimeDB provider error - the client context is undefined.","triggerScenarios":"Calling useTable(table, query, callbacks) in a component that is rendered outside the <SpacetimeDBProvider> subtree.","commonSituations":"Adding useTable to a new screen while the provider only covers part of the tree; the provider mounted below (not above) the component; storybook/unit-test renders without the provider.","solutions":["Move <SpacetimeDBProvider> up so it is an ancestor of every component using useTable","Verify the provider is not conditionally rendered or keyed away on the failing route","In tests/stories, wrap with <SpacetimeDBProvider> or mock the SpacetimeDBContext module"],"exampleFix":"// before\nexport const App = () => (\n  <>\n    <SpacetimeDBProvider>{/* ... */}</SpacetimeDBProvider>\n    <UserList /> {/* uses useTable, outside provider -> throws */}\n  </>\n);\n\n// after\nexport const App = () => (\n  <SpacetimeDBProvider>\n    <UserList />\n  </SpacetimeDBProvider>\n);","handlingStrategy":"validation","validationCode":"// Before adding useTable to a component, confirm the provider covers it:\n<App>\n  <SpacetimeDBProvider>\n    <Routes /> {/* every useTable consumer lives here */}\n  </SpacetimeDBProvider>\n</App>","typeGuard":null,"tryCatchPattern":"// Error boundary fallback for pages that may render outside the provider:\nif (missingProvider) return <div>Connecting to SpacetimeDB...</div>;","preventionTips":["Keep the provider above the router so new routes inherit it automatically","In unit tests, wrap with SpacetimeDBProvider or vi.mock the SpacetimeDBContext module","Treat this error as a tree-structure bug, not a runtime condition - fix the tree, do not catch it"],"tags":["react","hooks","context","table","typescript"],"backgroundTag":"react-context-provider-missing","analyzedSha":"524b4487d949b61a07d4f39c862d1290259dfd20","analyzedAt":"2026-08-16T23:58:54.611Z","schemaVersion":2},"datasetVersion":"2026-08-17T04:17:16.089Z"}