ar-design
Version:
AR Design is a (react | nextjs) ui library.
56 lines (55 loc) • 3.19 kB
JavaScript
import React, { memo } from "react";
import DatePicker from "../../../form/date-picker";
import { ARIcon } from "../../../icons";
import Grid from "../../grid-system";
import Button from "../../../form/button";
import Divider from "../../divider";
import { useTranslation } from "../../../../libs/core/application/hooks";
const { Row, Column, Box } = Grid;
function DateFilters({ states, methods, config }) {
// hooks
const { t } = useTranslation(String(config?.locale ?? "tr"));
return Object.entries(states.dateFilters.get).map(([name, range], index) => {
const isEqualsName = states.openName.get === name;
const className = [];
if (isEqualsName)
className.push("active");
return (React.createElement(React.Fragment, null,
React.createElement("li", { key: index, className: className.map((c) => c).join(" "), onClick: () => methods.open(name) },
React.createElement("div", null,
React.createElement("span", null, name),
React.createElement(ARIcon, { icon: "ChevronDown" })),
isEqualsName && (React.createElement("ul", { className: className.map((c) => c).join(" "), onClick: (event) => event.stopPropagation() },
React.createElement(Row, null,
React.createElement(Column, null,
React.createElement(DatePicker, { value: range.from?.toISOString(), onChange: (value) => {
states.dateFilters.set((prev) => ({
...prev,
[name]: {
...prev[name],
from: new Date(value),
},
}));
}, placeholder: "From" }))),
React.createElement(Row, null,
React.createElement(Column, null,
React.createElement(DatePicker, { value: range.to?.toISOString(), onChange: (value) => {
states.dateFilters.set((prev) => ({
...prev,
[name]: {
...prev[name],
to: new Date(value),
},
}));
}, placeholder: "To" }))),
React.createElement(Divider, { config: { margin: "0.5rem 0" } }),
React.createElement(Box, { direction: "flex-end" },
React.createElement(Button, { color: "red", size: "small", onClick: () => {
states.dateFilters.set((prev) => ({
...prev,
[name]: { from: null, to: null },
}));
} }, t("KanbanBoard.Search.Button.Clear.Text"))))))));
});
}
export default memo(DateFilters);