react-native-bulletproof-redux-provider

    1.0.3 • Public • Published

    React Native Bulletproof Redux Provider

    Encrypted Redux Provider wrapper for React Native based on AsyncStorage, react-native-keychain and react-native-securerandom.

    Under the hood, it uses redux-persist and redux-persist-transform-encrypt for persistence and encryption.

    Why ?

    By default, the local storage mechanism in React Native (AsyncStorage) is unencrypted. So we're adding a wrapper around it to make it more bulletproof.

    A random key is generated at runtime using react-native-securerandom on the user's device and permanently stored using the react-native-keychain module. That key is used to encrypt our Redux store, so nobody from outside can read that data.

    For a more extensive explanation on how this works, check out the blog post I wrote about this approach.

    Installation

    $ yarn add react-native-bulletproof-redux-provider
    $ yarn add @react-native-async-storage/async-storage react-native-keychain react-native-securerandom
    
    OR
    
    $ npm install react-native-bulletproof-redux-provider
    $ npm install @react-native-async-storage/async-storage react-native-keychain react-native-securerandom
    
    $ cd ios && pod install

    Usage

    import Provider from 'react-native-bulletproof-redux-provider';

    Now simply pass in your initialState and rootReducer:

    <Provider
      initialState={...}
      rootReducer={...}>
        // your app
    </Provider>
    

    After wrapping your app inside of Provider you can use the usual React bindings to access the store from your components.

    Props

    Property Description Default value
    rootReducer Redux reducer used in the store configuration none
    initialState Initial Redux reducer state none
    getEncryptionKey (optional) Custom encryption key method, check types/getEncryptionKeyType for interface getEncryptionKeyDefault
    configureStore (optional) Custom configureStore method, check types/configureStore for interface configureStoreDefault
    encryptionErrorCb (optional) Gets called when encryption fails, can be used to show an error message to the user none

    Todos

    • [ ] Unit and component tests
    • [ ] Allow passing in additional middleware array to configureStore function
    • [ ] Allow passing in additional transforms array to createPersistenceConfig function
    • [ ] Allow passing in key to createPersistenceConfig function (defaults to root)
    • [ ] Allow defining encryptionKey (username) to getEncryptionKey function (defaults to ENCRYPTED_REDUX)
    • [x] Optional callback function when encryption error occurs in StoreGate
    • [ ] Make compatible with redux-toolkit

    License

    MIT

    Install

    npm i react-native-bulletproof-redux-provider

    DownloadsWeekly Downloads

    8

    Version

    1.0.3

    License

    MIT

    Unpacked Size

    27 kB

    Total Files

    23

    Last publish

    Collaborators

    • marcelkalveram