44 lines
1.1 KiB
TypeScript
44 lines
1.1 KiB
TypeScript
import React from "react";
|
|
import { Checkbox } from "antd";
|
|
import type { CheckboxProps } from "antd";
|
|
import { useFilterStateState } from "../../state/Filter";
|
|
|
|
const WearingStyleFilter = () => {
|
|
const { setFilter, Filter } = useFilterStateState();
|
|
const onChange =
|
|
(name: string): CheckboxProps["onChange"] =>
|
|
(e) => {
|
|
const checked = e.target.checked;
|
|
|
|
if (checked) {
|
|
setFilter([...Filter, { name, index: Filter.length }]);
|
|
} else {
|
|
const newArray = Filter?.filter((item: any) => item.name !== name);
|
|
setFilter(newArray);
|
|
}
|
|
};
|
|
|
|
const array_of_filter = [
|
|
"WearingStyle1",
|
|
"WearingStyle2",
|
|
"WearingStyle3",
|
|
"WearingStyle4",
|
|
"WearingStyle5",
|
|
];
|
|
return (
|
|
<div className="CheckboxFilter">
|
|
{array_of_filter?.map((WearingStyle) => (
|
|
<Checkbox
|
|
checked={Filter.some((item: any) => item.name === WearingStyle)}
|
|
key={WearingStyle}
|
|
onChange={onChange(WearingStyle)}
|
|
>
|
|
{WearingStyle}
|
|
</Checkbox>
|
|
))}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default WearingStyleFilter;
|