use-search-value.ts1.6 KBView on GitHub import { useCedarStore } from '@/modules/store';
import { useCallback } from 'react';
type SearchState = {
value: string;
highlight: string;
folder: string;
isLoading: boolean;
isAISearching: boolean;
};
/**
* Hook to get and set search state
* Returns a tuple [state, setState] similar to Jotai's useAtom API
*/
export function useSearchValue() {
const value = useCedarStore((state) => state.value);
const highlight = useCedarStore((state) => state.highlight);
const folder = useCedarStore((state) => state.folder);
const isLoading = useCedarStore((state) => state.isLoading);
const isAISearching = useCedarStore((state) => state.isAISearching);
const setSearchState = useCedarStore((state) => state.setSearchState);
const state = { value, highlight, folder, isLoading, isAISearching };
// Wrapper to support both function updater and direct object patterns
const setState = useCallback(
(update: Partial<SearchState> | ((prev: SearchState) => Partial<SearchState>)) => {
if (typeof update === 'function') {
// Get current state and call the updater function
const currentState = useCedarStore.getState();
const current = {
value: currentState.value,
highlight: currentState.highlight,
folder: currentState.folder,
isLoading: currentState.isLoading,
isAISearching: currentState.isAISearching,
};
const newState = update(current);
setSearchState(newState);
} else {
setSearchState(update);
}
},
[setSearchState],
);
return [state, setState] as const;
}