{"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/6dee26c6efc2856793e12b148a59742964f5d783/crates/bindings-typescript/src/react/useTable.ts#L63-L99","documentation":"useTable calls useSpacetimeDB inside a try/catch; when no provider is mounted the context hook throws, and useTable re-throws this 'Could not find SpacetimeDB client' message. The root cause is exactly the missing-provider case: no SpacetimeDBProvider in the component tree above the hook call.","triggerScenarios":"Using useTable(query, callbacks) in a component rendered outside <SpacetimeDBProvider connectionBuilder={...}>.","commonSituations":"Same as other missing-provider cases: unwrapped test renders, a new page or modal outside the provider subtree, provider skipped during the first render pass.","solutions":["Mount SpacetimeDBProvider above every component that uses useTable","Use a shared test wrapper component that includes the provider","Verify the provider is not conditionally skipped on the render that first runs the hook"],"exampleFix":"// before\nexport function Players() {\n  const [rows] = useTable(playersQuery); // throws: no provider above\n  ...\n}\n\n// after\nroot.render(\n  <SpacetimeDBProvider connectionBuilder={builder}>\n    <Players />\n  </SpacetimeDBProvider>\n);","handlingStrategy":"try-catch","validationCode":null,"typeGuard":null,"tryCatchPattern":"// Error boundary (same shape as for useSpacetimeDB) around components using useTable\nclass TableErrorBoundary extends React.Component<\n  { children: React.ReactNode },\n  { error?: Error }\n> {\n  state = { error: undefined as Error | undefined };\n  static getDerivedStateFromError(error: Error) { return { error }; }\n  render() {\n    if (this.state.error?.message.includes('SpacetimeDBProvider')) {\n      return <p>Connect this view to SpacetimeDB first.</p>;\n    }\n    return this.props.children;\n  }\n}","preventionTips":["Ensure SpacetimeDBProvider wraps every component calling useTable","Share one provider-wrapped wrapper across tests","Do not mount the provider conditionally after data loads; hooks run on first render"],"tags":["react","context","hooks","typescript"],"backgroundTag":"missing-context-provider","analyzedSha":"6dee26c6efc2856793e12b148a59742964f5d783","analyzedAt":"2026-08-20T06:08:37.179Z","contentChangedAt":"2026-08-20T06:08:37.179Z","schemaVersion":2},"datasetVersion":"2026-09-23T08:17:48.524Z"}