React Zustand Tutorial - 8. setState, getState and separate actions from the store

[@OpenCoreX]

Wow. This video is a Gem. Subscribed to your channel for more such amazing videos. Thanks. I am the 1000th subscriber :)

[@PhilipIsaacs]

These videos are great. I think your a very good teacher

[@connygu]

code for this video: github.com/niftybytes4u/react_zustand_tutorial/tree/dc49cd9ef0315133d0393357c40c8b2610e8ba30

[@meka4996]

Very nice! Thanks!

[@FaramarzF.R]

You're Great 🎉.

[@josht2602]

Hi, Conny, how can we add the action names to the actions? can we directly mutate the state in the separated actions like in the self-contained immer middleware does ?

[@connygu]

Hi @josht, sorry, late for the answer, 1) I don't think, we can add the aciton name. But maybe we can ask the author Daishi to add this funciton. 2) I think, yes. Just try it.

[@bugraotken]

Hi. If you ask generally, yes you can add names to the actions. Here is my own code below. { type: "addMessage", message, }, this type will be shown at devtools as name of the action and if you pass the second key (message here) you also get the payload at the devtools. Cheers! export const messageSlice: StateCreator< MessageSlice, [["zustand/devtools", never]], [], MessageSlice > = (set) => ({ messages: [], addMessage: (message: Message) => set( (state) => { return { messages: [...state.messages, message] }; }, false, { type: "addMessage", message, }, ), });

[@venicebeachsurfer]

Where is the devtools? I don't see it in the code, but I see it in the console?

[@MatthewLeathes]

Check out video 5 in this playlist, hopefully that should show you how to set up devtools

[@StephenRayner]

🎉

[@connygu]

😄