fast-react-context
fast-react-context copied to clipboard
can't retrieve setter from useStore without retrieving state
The below code expects a selector... if no selector is used, an error is thrown.
const state = useSyncExternalStore(store.subscribe, () => selector(store.get()));
This can be fixed be just returning setting the getter to store.get when no selector is passed. Some like below.
const getter = selector ? () => selector(store.get()) : store.get;
const state = useSyncExternalStore(store.subscribe, getter);
I prefer to keep the get and set methods separate, something like this :
function useStore() {
const store = useContext(StoreContext);
if (!store) {
throw new Error('Store not found');
}
function query<SelectorOutput>(selector: (store: Store) => SelectorOutput) {
return useSyncExternalStore(
store.subscribe,
() => selector(store.get()),
() => selector(initialState)
);
}
const dispatch = store.set;
return { query, dispatch };
}
So in my other components i can just use get or set
const { query, dispatch } = useStore();
const fieldValue = query((store) => store['value']); // retrieve value
dispatch({ value : 'Jon'}); // set value
@mazengh maybe it can help you: const useStoreSetter = () => useStore(() => null).at(1);