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 | 2x | import * as React from "react";
// @mui
import Box from "@mui/material/Box";
import Stack from "@mui/material/Stack";
// import { useTheme } from "@mui/material/styles";
// components
import { Text } from "@common/Text";
import { RHFInput } from "@common/Input";
import { Padding } from "@common/Padding";
export const ConditionallyRenderAmountForm: React.FC<{
value: string;
money?: boolean;
}> = ({ value, money }) => {
// const theme = useTheme();
if (value?.includes("greater than") || value?.includes("less than")) {
return (
<Padding top="8px" right="8px">
<RHFInput
name="amount"
placeholder="0.00"
fullWidth
endIcon={money && <Text color={`#C1C1C1`}>USD</Text>}
/>
</Padding>
);
} else {
return (
<Stack mt={1} alignItems="center">
<RHFInput
fullWidth
name="amountOne"
placeholder="0.00"
startIcon={<Text color={`#C1C1C1`}>Max</Text>}
endIcon={money && <Text color={`#C1C1C1`}>USD</Text>}
/>
<Box
height={2}
width={130}
border="none"
component="hr"
bgcolor={`#E1E1DE`}
/>
<RHFInput
fullWidth
name="amountTwo"
placeholder="0.00"
startIcon={<Text color={`#C1C1C1`}>Min</Text>}
endIcon={money && <Text color={`#C1C1C1`}>USD</Text>}
/>
</Stack>
);
}
};
|