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 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 | 36x 36x 16x 16x 16x 20x 36x | import React from "react";
import { CustomFilterType, CustomTypesFilterModal } from "../types";
import GiveDateRangePicker from "@shared/DateRangePicker/GiveDateRangePicker";
import GiveRangeInputs from "@shared/GiveInputs/GiveRangeInputs";
import GiveText from "@shared/Text/GiveText";
import { isEmpty } from "lodash";
import moment from "moment";
import { PLATFORM_TIMEZONE } from "@utils/timezones";
type Props = {
customType: CustomTypesFilterModal;
selectedValue?: string | number | string[];
onChange: (val: string) => void;
errorText?: string;
};
function CustomSwitcher({
customType,
selectedValue,
onChange,
errorText,
}: Props) {
const isError = !!errorText;
switch (customType) {
case CustomFilterType.dateRange:
case CustomFilterType.dateRangeInTimezone: {
const useTimezone = customType === CustomFilterType.dateRangeInTimezone;
const maxDate = useTimezone
? new Date(moment().tz(PLATFORM_TIMEZONE).format("MM/DD/YYYY"))
: new Date();
return (
<CustomSwitcherWrapper errorText={errorText} label="Custom Date">
<GiveDateRangePicker
onChange={(V) => {
if (typeof V === "string") onChange(V);
}}
value={selectedValue as string}
validateDate={false}
maxDate={maxDate}
inputProps={{ error: isError }}
useUTCMoment
/>
</CustomSwitcherWrapper>
);
}
case CustomFilterType.amountRange:
case CustomFilterType.numberRange:
return (
<CustomSwitcherWrapper errorText={errorText} label="Custom">
<GiveRangeInputs
maxDigitsPerSide={14}
onChange={onChange}
validate={false}
isError={isError}
value={selectedValue as string}
{...(customType === CustomFilterType.numberRange && {
currency: "",
})}
/>
</CustomSwitcherWrapper>
);
default:
return <>Custom</>;
}
}
export default CustomSwitcher;
function CustomSwitcherWrapper({
children,
label,
errorText,
}: {
children: React.ReactNode;
label?: string;
errorText?: string;
}) {
return (
<>
{label && (
<GiveText
color={!isEmpty(errorText) ? "error" : "primary"}
fontSize="14px"
mb="8px"
>
{label}
</GiveText>
)}
{children}
{!isEmpty(errorText) && (
<GiveText mt="8px" fontSize="12px" color="error">
{errorText}
</GiveText>
)}
</>
);
}
|