Using custom storage engine on React Native

[ghost]

For some reason I cannot seem to be able to make my custom storage engine working on RN. What works in a clean CRA web project doesn't in a clean CRNA project.

I have created a new project by running expo init and choosing the Bare workflow with minimal settings. I've installed the easy-peasy package (4.0.1) and modified the App.js as such:

import React from "react";
import { Button, StyleSheet, View } from "react-native";
import {
  action,
  createStore,
  persist,
  StoreProvider,
  useStoreActions
} from "easy-peasy";

const store = createStore(
  persist(
    {
      count: 1,
      add: action(state => {
        state.count += 1;
        console.log("STATE CHANGE", state.count);
      })
    },
    {
      storage: {
        getItem: key => {
          console.log("GET_ITEM", key);
        },
        setItem: (key, value) => {
          console.log("SET_ITEM", key, value);
        },
        removeItem: key => {
          console.log("REMOVE_ITEM", key);
        }
      },
      allow: ["count"]
    }
  )
);

const MyButton = () => {
  const add = useStoreActions(actions => actions.add);
  return <Button title="Press" onPress={() => add()} />;
};

export default function App() {
  return (
    <StoreProvider store={store}>
      <View style={styles.container}>
        <MyButton title="Press" />
      </View>
    </StoreProvider>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: "center",
    justifyContent: "center"
  }
});

As I launch the project in my iOS simulator, GET_ITEM [EasyPeasyStore][0] is logged. As I press the button, STATE CHANGE 2 is logged. However, SET_ITEM never gets logged.

As mentioned, the same code on a web project works fine and SET_ITEM... is logged.

Any ideas?

[yixuan98]

Same issue after upgrading to v4.0.1, setItem() of custom storage isn't called when changing persisted state on RN 0.63.3.

[luziczek]

I can confirm the same and also AsyncStorage doesn't seem to work. On v4.1.0-beta.4 also not working with RN 0.63.3.

[Thram]

Same here with Easy Peasy 4.0.1

[GollyJer]

Same. Just tried to switch over to easy-peasy's persist. It seems so much easier but kept running into issues before finding this thread. Should have searched first!

[GollyJer]

Does anyone know why setItem isn't being called? I'm trying to create a local patch but looking at the code I don't quite understand what's causing it to not be called.

[ctrlplusb]

Hey all;

Apologies for the lack of response on this. I've had to take some personal time.

I would appreciate it if someone could share a basic repo that I could use to test this. I have an upcoming version that I feel may address this issue.

💜

[GollyJer]

removed useless post

[GollyJer]

Hi @ctrlplusb I had to switch back to redux-persist for now.

This is an iOS issue. Here is a Snack reproduction. easy-peasy-persist-bug

Run it with the Android emulator and SET_ITEM is logged. Run it with the iOS emulator and SET_ITEM is never logged.

[ctrlplusb]

Thanks for posting @GollyJer 🙏

[duygiangdg]

This is caused by an issue of RN 0.62.2, so requestIdleCallback is never called on iOS.

Before it is fixed, you can add this line before your createStore(), so easy-peasy will use requestAnimationFrame instead of requestIdleCallback

window.requestIdleCallback = null;

[GollyJer]

Thanks for the info @duygiangdg!

You can see your workaround in affect by running the iOS simulator here. easy-peasy-persist-bug-workaround

👍

[luziczek]

It solved the issue for me! Thanks :)

[6thpath]

any update on this issue ?

[jmyrland]

Hi @ctrlplusb I had to switch back to redux-persist for now.

This is an iOS issue. Here is a Snack reproduction. easy-peasy-persist-bug

Run it with the Android emulator and SET_ITEM is logged. Run it with the iOS emulator and SET_ITEM is never logged.

Thanks for the reproduction Snack, @GollyJer! As I don't have a mac to test on, this really helped troubleshooting the issue. This should now be fixed in 6.0.1. Sorry it's taken a while!

[GollyJer]

I mean, what's 2 years amongst friends. 😛 Thanks!!