File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import {useMemo, useState} from "react";
type CheckedListId = string | number;
export const useCheckedList = <T extends CheckedListId>(ids: T[]) => {
const [checkedIds, setCheckedIds] = useState<T[]>([]);
const currentCheckedIds = useMemo(
() => checkedIds.filter((checkedId) => ids.includes(checkedId)),
[checkedIds, ids]
);
const isAllChecked = ids.length > 0 && ids.every((id) => checkedIds.includes(id));
const isPartiallyChecked = currentCheckedIds.length > 0 && !isAllChecked;
const isChecked = (id: T) => checkedIds.includes(id);
const handleCheck = (id: T, checked: boolean) => {
setCheckedIds((prev) => {
if (checked) {
return prev.includes(id) ? prev : [...prev, id];
}
return prev.filter((checkedId) => checkedId !== id);
});
};
const handleCheckAll = (checked: boolean) => {
setCheckedIds(checked ? ids : []);
};
const resetChecked = () => {
setCheckedIds([]);
};
return {
checkedIds: currentCheckedIds,
isAllChecked,
isPartiallyChecked,
isChecked,
handleCheck,
handleCheckAll,
resetChecked,
};
};