Out-of-scope table refresher

Remount the entire table when changes happen outside ApiTables

When a form or modal outside the table mutates data the table displays, incrementing tableRefresher may not be enough — structure or provider state may be stale. ApiTables supports a full provider remount via the global app slice.

Global action

File: @/store/slices/appSlice.ts

_triggerOutscopeTableRefresher()

Increments state.app.outScopeTableRefresher.

Effect in ApiTables

File: ./ApiTables/ApiTablesProvider.tsx

<div key={outScopeTableRefresher}>
  <Provider store={tableStore}>{children}</Provider>
</div>

React destroys and recreates the subtree → new createTableStore() → controller re-runs structure hydration and fetch.

When to use

ScenarioUse
Save in page-level modal (add category, edit product)_triggerOutscopeTableRefresher
Row action with onSuccess: reloadtriggerTableReload() inside table
Bulk export finishedtriggerTableReload or response handler
User navigates awayUnmount handles cleanup

Dispatch from feature code

import { useDispatch } from 'react-redux';
import { _triggerOutscopeTableRefresher } from '@/store/slices/appSlice';

const dispatch = useDispatch();

// After successful AddCategory form
dispatch(_triggerOutscopeTableRefresher());

Many bolesa-app-ui pages dispatch this after CRUD modals on the same screen as ReactApiTable.

vs in-table reload

Reload is lighter and keeps selection-related slice setup unless fetch clears it.

Out-of-scope is heavier but guarantees a clean slate — useful when structure or peripheral state must reset.

Custom controls

Some custom-controls/* components dispatch _triggerOutscopeTableRefresher after save instead of only triggerTableReload(). Match existing patterns on the same feature page.

On this page