😽

【Convex】NextJs14 と Convex【#17 Convex Zustand】

2024/04/26に公開

【#17 Convex Zustand】

YouTube: https://youtu.be/2ueYUINXnx0

https://youtu.be/2ueYUINXnx0

今回はモーダルの開閉の状態を「Zustand」使って実装します。

npm i zustand
store/use-create-card-modals.ts
import { create } from "zustand";

const defaultValues = { id: "" };

interface CreateCardModalInput {
  isOpen: boolean;
  initialValues: typeof defaultValues;
  onOpen: (id: string) => void;
  onClose: () => void;
}

export const useCreateCardModal = create<CreateCardModalInput>((set) => ({
  isOpen: false,
  onOpen: (id) => set({ isOpen: true, initialValues: { id } }),
  onClose: () => set({ isOpen: false, initialValues: defaultValues }),
  initialValues: defaultValues,
}));

Discussion