여러 개 CheckBox 관리

 const handleCheck = (e: React.ChangeEvent<HTMLInputElement>) => {
    if (e.target.checked === true) {
      setIsChecked([...isChecked, e.target.value]);
      handleFilter();
    } else {
      setIsChecked(isChecked.filter((it) => it !== e.target.value));
    }
  };


// 체크 박스 
<Checkbox
  value="체크박스value"
  onChange={handleCheck}
  checked={isChecked.includes("체크박스value") ? true : false}
/>

... <CheckBox ... />

interface OptionDataType {
  [value: string]: { checked: boolean };
}

export const optionDateFor = (data: string[]) => {
  const result: OptionDataType = {};

  data.forEach((item) => {
    result[item] = { checked: false };
  });

  return result;
};

  const CheckList = ["ch1", "ch2", "ch3"];
  
  const [checkList, setCheckList] = useState(optionDateFor(CheckList));
  
   const filtering = useMemo(() => {
    return {
      problem: Object.keys(checkList).filter(
        (value) => checkList[value].checked
      ),
    };
  }, [checkList]);
  
   const filterCategoryData = () => {
    const filterdata = data?.filter((chapter) => {
      for (let i = 0; i < filtering.problem.length; i++) {
        const element = filtering.problem[i];