Skip to main content

getDefaultManagers()

getDefaultManagers returns an Array of Managers to be sent to <DataProvider />.

This makes it simple to configure and add custom Managers, while remaining robust against any potential changes to the default managers.

Currently returns [DevToolsManager*, NetworkManager, SubscriptionManager].

*(DevToolsManager is excluded in production builds.)

Usage​

import { DataProvider, getDefaultManagers } from '@data-client/react';
import { createRoot } from 'react-dom/client';

const managers = getDefaultManagers({
  // set fallback expiry time to an hour
  networkManager: { dataExpiryLength: 1000 * 60 * 60 },
});

createRoot(document.body).render(
  <DataProvider managers={managers}>
    <App />
  </DataProvider>,
);

See DataProvider for details on usage in different environments.

Arguments​

Each argument represents a configuration of the manager. It can be of three possible types:

  • Any plain object is used as options to be sent to the manager's constructor.
  • An instance of the manager to be used directly.
  • null. When sent will exclude the manager.
getDefaultManagers({
  devToolsManager: { trace: true },
  networkManager: new NetworkManager({ errorExpiryLength: 1 }),
  subscriptionManager: null,
});

networkManager​

note

null is not allowed here since NetworkManager is required

dataExpiryLength is used as a fallback when an Endpoint does not have dataExpiryLength defined.

errorExpiryLength is used as a fallback when an Endpoint does not have errorExpiryLength defined.

devToolsManager​

Arguments to send to redux devtools.

subscriptionManager​

A class that implements SubscriptionConstructable like PollingSubscription

Examples​

Tracing actions​

For example, we can enable the trace option to help track down where actions are dispatched from. This has a large performance impact, so it is normally disabled.

const managers = getDefaultManagers({
  devToolsManager: { trace: true },
});

Manager inheritance​

Sending manager instances allows us to customize managers using inheritance.

import { IdlingNetworkManager } from '@data-client/react';

const managers = getDefaultManagers({
  networkManager: new IdlingNetworkManager(),
});

IdlingNetworkManager can prevent stuttering by delaying sideEffect-free (read-only/GET) fetches until animations are complete. This works in both web and React Native using requestIdleCallback.

Disabling​

Using null will remove managers completely. NetworkManager cannot be removed this way.

const managers = getDefaultManagers({
  devToolsManager: null,
  subscriptionManager: null,
});

Here we disable every manager except NetworkManager.

Coin App​

New prices are streamed in many times a second; to reduce devtool spam, we set it to ignore SET actions for Ticker.

Explore the coin-app example

Open in StackBlitzView source

More Demos