react-native-redux-storage-module
TypeScript icon, indicating that this package has built-in type declarations

1.0.3 • Public • Published

react-native-redux-storage-module

Build redux storage module with Redux, react-redux, redux-persist, redux-sage, redux-persist-transform-compress, redux-logger and using typescript

Installation

Using npm

npm install react-native-redux-storage-module

Using yarn

yarn add react-native-redux-storage-module
  • Installation on iOS/Android is completely handled with auto-linking.

Usage

  • Normal usage
import * as React from 'react';
import {
  rootStoreManager,
  registerStore,
} from 'react-native-redux-storage-module';
import { Provider } from 'react-redux';
import { PersistGate } from 'redux-persist/integration/react';
// ...
class App extends React.Component {
    constructor(props: any) {
        super(props);
        registerStore({
            whiteList: [],
            reducer: { },
            sagas: [],
            blackList: [],
        });
    }

    render(): React.ReactNode {
        return (
            <Provider store={rootStoreManager.getStore()!}>
                <PersistGate
                    loading={<></>}
                    persistor={rootStoreManager.getPersistStore!}
                >
                {/* Children component */}
                </PersistGate>
            </Provider>
        );
    }
}

export default App;
  • Using with decorators
import * as React from 'react';
import {
  rootStoreManager,
  registerStore,
} from 'react-native-redux-storage-module';
import { Provider } from 'react-redux';
import { PersistGate } from 'redux-persist/integration/react';
// ...
@registerStore({
  whiteList: [],
  reducer: { },
  sagas: [],
  blackList: [],
})
class App extends React.Component {
  render(): React.ReactNode {
    return (
      <Provider store={rootStoreManager.getStore()!}>
        <PersistGate
          loading={<></>}
          persistor={rootStoreManager.getPersistStore!}
        >
            {/* Children component */}
        </PersistGate>
      </Provider>
    );
  }
}

export default App;
  • Advance using
import * as React from 'react';
import {
  rootStoreManager,
  registerStore,
} from 'react-native-redux-storage-module';
import { Provider } from 'react-redux';
import { PersistGate } from 'redux-persist/integration/react';
// ...

// define class decorator for the initialize app root
function startApplication(_fn?: Function) {
  console.log(
    '------------------------------- Start initialize app root ----------------------------'
  );
  registerStore({
    whiteList: [],
    reducer: { },
    sagas: [],
    blackList: [],
  });
  console.log(
    '------------------------------- End initialize app root ----------------------------'
  );
}

@startApplication
class App extends React.Component {
  render(): React.ReactNode {
    return (
      <Provider store={rootStoreManager.getStore()!}>
        <PersistGate
          loading={<></>}
          persistor={rootStoreManager.getPersistStore!}
        >
            {/* Children component */}
        </PersistGate>
      </Provider>
    );
  }
}

export default App;

Example with Todo list

Example within this repo can be found in the TodoList README

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

React native redux storage module library is licensed under The MIT License.


Made by margosh.le

Package Sidebar

Install

npm i react-native-redux-storage-module

Weekly Downloads

0

Version

1.0.3

License

MIT

Unpacked Size

156 kB

Total Files

155

Last publish

Collaborators

  • margohsle