Questions tagged [zustand]

For questions regarding Zustand, a hook-based state management system for React.

A small, fast and scalable bearbones state-management solution using simplified flux principles. Has a comfy API based on hooks, isn't boilerplatey or opinionated.

231 questions
2
votes
1 answer

How to use encrypt-storage with zustand in react?

I'm using zustand with persist plugin to store the state of my application. I want to use localstorage but the cache has to be encrypted. For encryption, I'm using encrypt-storage. For encryption keys, I want to make an API call to the backend and…
Voneone
  • 21
  • 4
2
votes
0 answers

How best to update client (local) state as a side-effect of an Apollo cache update

I'm interested in opinions on how to manage global client state (Zustand) invalidation as a result of a socket update which modifies the network state cache (Apollo). Let's say we have the following state: Apollo cache (requested from server): {…
Daniel Power
  • 43
  • 1
  • 4
2
votes
2 answers

How can I call a function and return a React Component at the same time?

I have this React Component for Privates routes. I want to check if user is logged in, so I check if jwt is in local storage and if token is not expired. If this doesn't happen I want to log user out, since token is expired. I have a react warning…
2
votes
0 answers

Zustand causing rerenders every time a state change in the store

i have been using zustand to avoid component re renders, so i just figured out that when i create the component in the same file, everything is fine , but when you just create a component in a seperate file and import it, it re renders every time a…
Aliiii
  • 31
  • 2
2
votes
1 answer

How can I address Zustand persist in my Jest tests?

I'm currently creating a react native app using Zustand for my state management. Zustand has the ability to persist the state into storage, in my case the async storage of react native. It works fine, however when running tests the persist wrapper…
Yukko
  • 23
  • 5
2
votes
3 answers

Zustand get state from another Zustand store

*I have created 2 Zustand stores in react application, one is called UserStore, and the other is called SettingsStore, how can I get the state from UserStore to SettingsStore? * import create from 'zustand'; const UserStore = (set, get) =>…
2
votes
0 answers

How would I create a Zustand store selector hook wrapper in Typescript

I am trying to use Zustand as a replacement for React Context to provide a shared state amongst a subset of components, and one of the patterns I find myself using a lot is the shallow, multi-property selector, like so: // store.ts interface State…
J. Sheets
  • 237
  • 2
  • 9
2
votes
0 answers

Zustand with Slices and Zundo

TL;DR does anybody have an example of using Zustand with Zundo with slices? I started implementing Zustand undo using Zundo and then realized that I have multiple stores. So I decided to refactor to use slices and a single store. So far I have zundo…
ohthepain
  • 2,004
  • 3
  • 19
  • 30
2
votes
0 answers

Mocked zustand module with jest.mock gives typeError _zustand.default is not a function

My mock. jest.mock("zustand", async () => { const originalModule = await jest.requireActual("zustand"); const create = (createState) => { const store = originalModule((set) => { const state = createState(set); return { …
Ivan Uno
  • 31
  • 3
2
votes
0 answers

React-flow: Pass data only when connected

I'm a total React-flow noob and this question might be silly, but I can't quite seem to grasp the concepts I need to utilize. I'm trying to make an app where the user can add custom color nodes and then also add text nodes which, when connected show…
jansmolders86
  • 5,449
  • 8
  • 37
  • 51
2
votes
1 answer

Infinite re-render using Zustand

I'm coming from redux + redux-saga and class component, everything went well when using componentDidMount in class component. Dispatching action to fetch api works well without duplicate request. I've been learning functional component for a while,…
M Ansyori
  • 429
  • 6
  • 21
2
votes
0 answers

useEffect and state management library

I have this problem that I am trying to understand and solve. I want to fetch data in the main component and allow editing of this data. The problem is that the first time the data is properly loaded into the state but if I go back to the previous…
canon
  • 21
  • 1
  • 2
2
votes
1 answer

Next.js Zustand dynamic key addition to a state not working

I have been trying to add a key to a state dynamically in zustand. I have tried multiple ways like 1. const store = (set, get) => ({ keyAttrib: {key1: "value1", key2: 2}, update: (key, value) => { let newState = { ...get().keyAttrib, [key]:…
2
votes
0 answers

React - why changing state works faster in incognito mode?

I am using Zustand for state management (without any persistence options). I have a pretty simple store: export const useStore = create()( devtools((set) => ({ map: null, setMap: (map: Map) => set(() => ({ map })), layer:…
ablaszkiewicz1
  • 855
  • 1
  • 10
  • 26
2
votes
1 answer

How to return errors from Zustand Store

I'm using Zustand for a React Native project, and I'm not used to this setup. I have a store with some variables and functions, and I can't get Zustand to return error values for form entries. Here is my store: import create from 'zustand'; import…
Joel Hager
  • 2,990
  • 3
  • 15
  • 44
1 2
3
15 16