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 | 9x 9x 9x | import { styled, useAppTheme } from "@theme/v2/Provider";
import { Stack } from "@mui/material";
import { Controller } from "react-hook-form";
import { GiveInput } from "@shared/GiveInputs/GiveInput";
import GiveDatePicker from "@shared/DatePicker/GiveDatePicker";
import { ControlledDatePicker } from "@sections/PayBuilder/Forms/DateAndLocation/components/ControlledDatePicker";
interface Props {
msaPreviousTerminationProcessorName: string | null | undefined;
msaPreviousTerminationAt: number | Date | null | undefined;
msaPreviousTerminationReason: string | null | undefined;
defaultContext?: any;
data_key: any;
}
const TerminationFormOnboard = ({ methods }: Props & { methods: any }) => {
const { palette, customs } = useAppTheme();
const { control, setValue } = methods;
return (
<Stack flexDirection="column" mt="24px" gap="24px">
<Controller
name="processorName"
control={control}
render={({ field, fieldState: { error } }) => (
<Input
{...field}
label="Name of Previous Processor"
error={!!error}
helperText={error?.message}
/>
)}
/>
<ControlledDatePicker
name="terminationDate"
label="Date of Termination"
maxDate={new Date()}
placeholder="MM/DD/YYYY"
/>
<Controller
name="terminationReason"
control={control}
render={({ field, fieldState: { error } }) => (
<Input
{...field}
label="Reason for Termination"
multiline
rows={6}
error={!!error}
helperText={error?.message}
/>
)}
/>
</Stack>
);
};
export default TerminationFormOnboard;
// Styled input components
const Input = styled(GiveInput)(({ theme }) => ({
borderRadius: `${theme.customs?.radius.small}px`,
}));
const DatePicker = styled(GiveDatePicker)(({ theme }) => ({
border: `1px solid ${theme.palette.border?.secondary}`,
borderRadius: `${theme.customs?.radius.small}px`,
}));
|