Neurologically Paralyzing Mouseovers

    @redux-offline/redux-offline
    TypeScript icon, indicating that this package has built-in type declarations

    2.6.0 • Public • Published

    redux-offline

    npm version travis

    Persistent Redux store for Reasonaboutable™️ Offline-First applications, with first-class support for optimistic UI. Use with React, React Native, or as standalone state container for any web app.

    Redux Offline is now being maintained by a community driven team. The new versions of the library will now be available under the npm organization @redux-offline. Big thank you to @jevakallio for creating this amazing library in the first place.

    Quick start

    1. Install with npm (or Yarn)
    For React Native 0.60+
    npm install --save @redux-offline/redux-offline@native

    For React Native Expo SDK 36

    npm install --save @redux-offline/redux-offline@expo

    For React Native <= 0.59

    npm install --save @redux-offline/redux-offline
    2. Add the offline store enhancer with compose
    import { applyMiddleware, createStore, compose } from 'redux';
    import { offline } from '@redux-offline/redux-offline';
    import offlineConfig from '@redux-offline/redux-offline/lib/defaults';
    
    // ...
    
    const store = createStore(
      reducer,
      preloadedState,
      compose(
        applyMiddleware(middleware),
        offline(offlineConfig)
      )
    );
    3. Decorate actions with offline metadata
    const followUser = userId => ({
      type: 'FOLLOW_USER_REQUEST',
      payload: { userId },
      meta: {
        offline: {
          // the network action to execute:
          effect: { url: '/api/follow', method: 'POST', json: { userId } },
          // action to dispatch when effect succeeds:
          commit: { type: 'FOLLOW_USER_COMMIT', meta: { userId } },
          // action to dispatch if network action fails permanently:
          rollback: { type: 'FOLLOW_USER_ROLLBACK', meta: { userId } }
        }
      }
    });

    If the effect payload is something other than JSON you can pass the body and headers:

    const registerUser = (name, email) => ({
      type: 'REGISTER_USER',
      payload: { name, email },
      meta: {
        offline: {
          // the network action to execute:
          effect: { url: '/api/register', method: 'POST', body: `name=${name}&email=${email}`, headers: { 'content-type': 'application/x-www-form-urlencoded' } },
          // action to dispatch when effect succeeds:
          commit: { type: 'REGISTER_USER_COMMIT', meta: { name, email } },
          // action to dispatch if network action fails permanently:
          rollback: { type: 'REGISTER_USER_ROLLBACK', meta: { name, email } }
        }
      }
    });
    4. (React Native Android) Ask permission to read network status

    If writing a native app for Android, you'll need to make sure to request the permission to access network state in your AndroidManifest.xml:

      <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

    See Documentation for configuration options, the full API, and common recipes.

    Contributing

    Improvements and additions welcome. For large changes, please submit a discussion issue before jumping to coding; we'd hate you to waste the effort.

    If you are reporting a bug, please include code that reproduces the error. Here is a starting application on CodeSandbox.

    In lieu of a formal style guide, follow the included eslint rules, and use Prettier to format your code.

    Miscellanea

    Usage with Redux Persist v5

    In case you want to use a custom redux-persist version, there is an example configuration.

    Prior art

    Redux Offline is a distillation of patterns discovered while building apps using previously existing libraries:

    Without their work, Redux Offline wouldn't exist. If you like the ideas behind Redux Offline, but want to build your own stack from lower-level components, these are good places to start.

    License

    MIT

    Keywords

    none

    Install

    npm i @redux-offline/redux-offline

    DownloadsWeekly Downloads

    64,049

    Version

    2.6.0

    License

    MIT

    Unpacked Size

    121 kB

    Total Files

    75

    Last publish

    Collaborators

    • sorodrigo
    • echoes221