Zustand with typescript

I honestly do not know what is wrong in here.

11 Replies

barry•2y ago

import create, { StateCreator } from "zustand";
import { persist, PersistOptions } from "zustand/middleware";

interface User {
  name: string;
}

export interface UserStore {
  user: User;
  setUser: (user: User) => void;
  getUser: () => User;
}

type MyPersist = (
  config: StateCreator<UserStore>,
  options: PersistOptions<UserStore>
) => StateCreator<UserStore>;

export const useUserStore = create<UserStore>(
  (persist as unknown as MyPersist)(
    (set, get) => ({
      user: {
        name: "",
      },
      setUser: (user: User) => set({ user }),
      getUser: () => get().user,
    }),
    {
      name: "user.store.main",
      getStorage: () => localStorage,
    }
  )
);

import create, { StateCreator } from "zustand";
import { persist, PersistOptions } from "zustand/middleware";

interface User {
  name: string;
}

export interface UserStore {
  user: User;
  setUser: (user: User) => void;
  getUser: () => User;
}

type MyPersist = (
  config: StateCreator<UserStore>,
  options: PersistOptions<UserStore>
) => StateCreator<UserStore>;

export const useUserStore = create<UserStore>(
  (persist as unknown as MyPersist)(
    (set, get) => ({
      user: {
        name: "",
      },
      setUser: (user: User) => set({ user }),
      getUser: () => get().user,
    }),
    {
      name: "user.store.main",
      getStorage: () => localStorage,
    }
  )
);

the types were weird but fixed it like this for me

jhohannes•2y ago

lemme try it okay.. @barry it worked but another error came up React is telling me now that setTime is not a function

barry•2y ago

did you do the types for it right userConfigTime.actions.setTime should work btw im not mad or something concerning your dm but generally dont dm people without asking first

jhohannes•2y ago

using it in another file?

jhohannes•2y ago

barry•2y ago

its actions.setTime? you dont need to set some actions object its not like redux

jhohannes•2y ago

sure okay so assuming I don't use the actions: {} thing.. setTime(threshold) would still be right? I exported the actions..so I get them directly see!! I exported it down here

barry•2y ago

ah yh then that should work

jhohannes•2y ago

buttt.. this is what I see

barry•2y ago

idk lol

Gaming

Programming

Zustand with typescript