Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 | 902x 902x 902x 769x 549x 549x 549x 548x 548x 545x 549x 902x 12x 12x 12x 12x 902x 3x 3x 902x | import { useState, useMemo } from "react";
type SortOrder = "asc" | "desc";
export function useSortable<T>(
data: T[],
defaultKey: keyof T,
defaultOrder: SortOrder = "desc",
onSortChange?: (key: keyof T, order: SortOrder) => void,
) {
const [sortKey, setSortKey] = useState<keyof T>(defaultKey);
const [sortOrder, setSortOrder] = useState<SortOrder>(defaultOrder);
const sorted = useMemo(() => {
return [...data].sort((a, b) => {
const aVal = a[sortKey];
const bVal = b[sortKey];
if (aVal == null && bVal == null) return 0;
Iif (aVal == null) return 1;
if (bVal == null) return -1;
const cmp = aVal < bVal ? -1 : aVal > bVal ? 1 : 0;
return sortOrder === "asc" ? cmp : -cmp;
});
}, [data, sortKey, sortOrder]);
const toggleSort = (key: keyof T) => {
const order: SortOrder =
key === sortKey && sortOrder === "desc" ? "asc" : "desc";
setSortKey(key);
setSortOrder(order);
onSortChange?.(key, order);
};
const setSort = (key: keyof T, order: SortOrder) => {
setSortKey(key);
setSortOrder(order);
};
return { sorted, sortKey, sortOrder, toggleSort, setSort };
}
|