- "frontend/src/components/SortDropdown.tsx" - "frontend/src/hooks/useSortPreference.ts" - "frontend/src/pages/SearchResults.tsx" - "frontend/src/pages/SubTopicPage.tsx" - "frontend/src/pages/CreatorDetail.tsx" - "frontend/src/api/public-client.ts" - "frontend/src/App.css" GSD-Task: S02/T02
30 lines
746 B
TypeScript
30 lines
746 B
TypeScript
import { useCallback, useState } from "react";
|
|
|
|
const STORAGE_KEY = "chrysopedia_sort_pref";
|
|
|
|
/**
|
|
* Reads/writes a sort preference to sessionStorage.
|
|
* Falls back to `defaultSort` if no stored value exists.
|
|
*/
|
|
export function useSortPreference(
|
|
defaultSort: string,
|
|
): [string, (next: string) => void] {
|
|
const [sort, setSortState] = useState<string>(() => {
|
|
try {
|
|
return sessionStorage.getItem(STORAGE_KEY) ?? defaultSort;
|
|
} catch {
|
|
return defaultSort;
|
|
}
|
|
});
|
|
|
|
const setSort = useCallback((next: string) => {
|
|
setSortState(next);
|
|
try {
|
|
sessionStorage.setItem(STORAGE_KEY, next);
|
|
} catch {
|
|
// sessionStorage unavailable (private browsing, etc.)
|
|
}
|
|
}, []);
|
|
|
|
return [sort, setSort];
|
|
}
|