Middleware és devtools

import { create } from "zustand"
import { devtools } from "zustand/middleware"

export const useCounterStore = create<CounterState>()(
  devtools(
    (set) => ({
      count: 0,
      increment: () =>
        set((state) => ({ count: state.count + 1 }), false, "increment"),
    }),
    { name: "CounterStore" }
  )
)

import { create } from "zustand"
import { persist } from "zustand/middleware"

interface ThemeState {
  theme: "light" | "dark"
  toggleTheme: () => void
}

export const useThemeStore = create<ThemeState>()(
  persist(
    (set) => ({
      theme: "light",
      toggleTheme: () =>
        set((state) => ({ theme: state.theme === "light" ? "dark" : "light" })),
    }),
    { name: "theme-storage" }
  )
)

import { devtools, persist } from "zustand/middleware"

const useStore = create<State>()(
  devtools(persist((set) => ({}), { name: "my-storage" }), { name: "MyStore" })
)

import { immer } from "zustand/middleware/immer"

const useStore = create<State>()(
  immer((set) => ({
    todos: [],
    addTodo: (text: string) =>
      set((state) => {
        state.todos.push({ id: Date.now(), text, done: false })
      }),
  }))
)