"No store actions" approach doesn't work with redux devtool?

[kelvin-du]

Hi, I tried to use "no actions store" approach to implement my app logic. Everything worked correctly, but it didn't work with redux-devtool. The actions in devtool showed "anonymous" instead of the actual action name . Then I tried to put the actions back in the store state, it worked again.

Here is the simplified version:

type User {
  id: string;
  name: string;
}

type AuthStoreState = {
  user: User;
};

const initialState = {
  user: {
    id: "",
    name: "",
  }
}

const useAuthStore = create<AuthStore>()(
  devtools(
    persist(
      () => initialState,
      {
        name: 'test-store',
        storage: createJSONStorage(() => localStorage),
      },
    ),
    {
      name: "test-app",
      store: "test-store",
    },
  ),
);

export const updateUser = (user) => useAuthStore.setState({ user }, undefined, "updateUser");

Then updateUser was called in a component.

Also, can I put false into the second param of the set and setState instead of undefined (I don't want to override the default merging behavior, just don't like undefined)?

[dai-shi]

Hm, it sounds like a bug. Would anyone like to look into it?

(Yeah, replace=false should work.)

[kelvin-du]

Hi, is there anyone that is working on this? Just want to add more details: it only happens if we nest devtools(persist(...)). If we use them like persist(devtools(...)), the action name and payload will be correct in redux devtool

[dai-shi]

Nice catch. Then, the issue is probably in persist.
I don't think anyone is working on it as of now. Would you like to give it a try? It might be tricky though.

[kelvin-du]

I would like to. It's been a bit busy with the main job. I will find some time to give it a try. Any suggestions on where/how to start?

[dai-shi]

Great. Check CONTRIBUTING.md if you haven't.

Feel free to ask questions here, or you can join my Discord server if you prefer chat style communication.