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 42 43 44 45 46 | 2x | import Stack from "@mui/material/Stack";
import HFGiveIntegerInput from "@shared/HFInputs/HFGiveInput/HFGiveIntegerInput";
import HFGiveSelect from "@shared/HFInputs/HFGiveSelect/HFGiveSelect";
import { ControlledDatePicker } from "@sections/PayBuilder/Forms/DateAndLocation/components/ControlledDatePicker";
import { useFormContext } from "react-hook-form";
type Props = {
value: string;
};
const FilterDateRenderer = ({ value }: Props) => {
const { watch } = useFormContext();
const values = watch();
const minEndDate = new Date(values?.startDate);
if (value === "is between") {
return (
<Stack mt={1} alignItems="center" spacing={1.5}>
<ControlledDatePicker name="startDate" disableFuture />
<ControlledDatePicker
name="endDate"
disableFuture
minDate={minEndDate}
/>
</Stack>
);
} else {
return (
<Stack mt={1} gap={1.5} direction="row" alignItems="stretch">
<HFGiveIntegerInput name="count" placeholder="" width="100%" />
<HFGiveSelect
fullWidth
name="dayMonthYear"
options={[
{ value: "days", label: "Days" },
{ value: "months", label: "Months" },
]}
/>
</Stack>
);
}
};
export default FilterDateRenderer;
|