I am using Zustand and have a generic modal store. I will create a store for each store. And the thing is that not all modals have props
so I’d like the open function can be called without arguments like reviewModalStore.getState().open()
(no args needed).
With the current code, the open
function still needs undefined
to work (see the last 2 lines).
<code>import { create } from "zustand"
export type ModalStoreState<T> = {
isOpen: boolean
props: T | undefined
open: (props: T) => void
close: () => void
}
export const createModalStore = <T>() =>
create<ModalStoreState<T>>()((set) => ({
isOpen: false,
props: undefined,
open(props) {
set((state) => ({
...state,
props,
isOpen: true,
}))
},
close() {
set((state) => ({
...state,
isOpen: false,
props: undefined,
}))
},
}))
const reviewModalStore = createModalStore()
const openReviewModalStore = reviewModalStore.getState().open(undefined)
</code>
<code>import { create } from "zustand"
export type ModalStoreState<T> = {
isOpen: boolean
props: T | undefined
open: (props: T) => void
close: () => void
}
export const createModalStore = <T>() =>
create<ModalStoreState<T>>()((set) => ({
isOpen: false,
props: undefined,
open(props) {
set((state) => ({
...state,
props,
isOpen: true,
}))
},
close() {
set((state) => ({
...state,
isOpen: false,
props: undefined,
}))
},
}))
const reviewModalStore = createModalStore()
const openReviewModalStore = reviewModalStore.getState().open(undefined)
</code>
import { create } from "zustand"
export type ModalStoreState<T> = {
isOpen: boolean
props: T | undefined
open: (props: T) => void
close: () => void
}
export const createModalStore = <T>() =>
create<ModalStoreState<T>>()((set) => ({
isOpen: false,
props: undefined,
open(props) {
set((state) => ({
...state,
props,
isOpen: true,
}))
},
close() {
set((state) => ({
...state,
isOpen: false,
props: undefined,
}))
},
}))
const reviewModalStore = createModalStore()
const openReviewModalStore = reviewModalStore.getState().open(undefined)
Thank you in advance!