Providers overview

Every provider and state container in ApiTables

Providers and state are the most confusing part for new frontend developers. This page clarifies what is Redux, what is local React state, and what is a hook.

ApiTables uses three coordination mechanisms:

  1. ApiTablesProvider — React Redux Provider with a dedicated table store
  2. Redux slicestableCore, tableColumns, bulkActions, rowActions
  3. useUtilsProvider — Hook (not a React Provider) that centralizes POST handlers and cross-store side effects

There is no React Context beyond Redux. Feature code should use hooks inside the ApiTablesProvider subtree.

Junior rule

Your feature page uses useTableStructure (local state). Everything inside ReactApiTable uses the table Redux store.

Quick reference

NameTypePurpose
ApiTablesProviderReact componentMount per-table Redux; remount on global refresh
createTableStore()FunctionNew store instance per table
getExternalState()FunctionSnapshot of global @/store/store
useUtilsProvider()HookRow/bulk POST, reload, downloads, global loader

What is not a provider

ItemNote
useTableStructureLocal useState on the feature page — structure lives outside table Redux
useTableFetcherHook used only inside controller
useSelector(state => state.app)Used in ApiTablesProvider for remount key only

On this page