export function useSearch(searchFields, searchApiFunction) { let searchQuery = $state(initializeSearchQuery(searchFields)); let isLoading = $state(false); let searchData = $state([]); let selectOptions = $state({}); let loadingOptions = $state({}); function initializeSearchQuery(fields) { const query = {}; for (const field of fields) { if (field.type === "select") { query[field.key] = field.default ?? ""; } else { query[field.key] = ""; } } return query; } async function handleSearch(onDone) { isLoading = true; try { searchData = await searchApiFunction(searchQuery); } catch (error) { console.error('Search failed:', error); } finally { isLoading = false; onDone?.(); } } function handleReset() { searchQuery = initializeSearchQuery(searchFields); } async function fetchOptions(field) { if (!field.optionsEndpoint) return; if (selectOptions[field.key]?.length) return; loadingOptions[field.key] = true; try { const response = await fetch(field.optionsEndpoint); const json = await response.json(); selectOptions[field.key] = json.data.map(item => ({ value: item[field.valueKey ?? 'value'], label: item[field.labelKey ?? 'label'], })); } catch (err) { console.error("Failed fetching options:", err); selectOptions[field.key] = []; } finally { loadingOptions[field.key] = false; } } return { get searchQuery() { return searchQuery; }, set searchQuery(value) { searchQuery = value; }, get searchData() { return searchData; }, get isLoading() { return isLoading; }, get loadingOptions() { return loadingOptions; }, get selectOptions() { return selectOptions; }, handleSearch, handleReset, fetchOptions, }; }