Best Practice Pattern for using Zustand & Immer (Flux or other)

[BassWow]

Hi guys,

I was hoping someone could point me in the right direction?

First of all hands down the best state management library I have come across! Initially I was considering Redux-Toolkit as I have been using React Context since It was introduced.

I wanted to get peoples thoughts on a good starting point? I am not necessarily tied to the Flux pattern so open to suggestions on how we would use Zustand to accomplish the basics such as the example I have made in the in sandbox.

I just need direction in terms of API async calls and what is the best way to approach this using Zustand? Traditionally I have called API's via useEffect from components but now with the easy Zustand API it's quite simple to run state management for your application.

Here is my sample codesandbox:
https://codesandbox.io/s/zustand-immer-test-01cy6

[dai-shi]

Well, it looks good to me. I mean, it looks like what many people would be doing.
From the maintainer point of view, I can warn something that doesn't work as expected, but the library is unopinionated about how people would use it. So, I hope someone else can give some feedback.

My personal preference lately is exploring usage with non-middleware immer (= produce in set) which is easier in terms of typing in TypeScript, or even without immer (a wiki page about it).