/ src / components / AddressBlockedModal.tsx
AddressBlockedModal.tsx
 1  import { ExclamationCircleIcon, LogoutIcon } from '@heroicons/react/outline';
 2  import { Trans } from '@lingui/macro';
 3  import { Box, Button, SvgIcon, Typography } from '@mui/material';
 4  
 5  import { BasicModal } from './primitives/BasicModal';
 6  import { Link } from './primitives/Link';
 7  
 8  export interface AddressBlockedProps {
 9    address: string;
10    onDisconnectWallet: () => void;
11  }
12  
13  export const AddressBlockedModal = ({ address, onDisconnectWallet }: AddressBlockedProps) => {
14    // eslint-disable-next-line @typescript-eslint/no-empty-function, @typescript-eslint/no-unused-vars
15    const setOpen = (_value: boolean) => {}; // ignore, we want the modal to not be dismissable
16  
17    return (
18      <BasicModal open={true} withCloseButton={false} setOpen={setOpen}>
19        <Box
20          sx={{
21            display: 'flex',
22            flexDirection: 'column',
23            justifyContent: 'center',
24            alignItems: 'center',
25          }}
26        >
27          <SvgIcon sx={{ fontSize: '24px', color: 'warning.main', mb: 2 }}>
28            <ExclamationCircleIcon />
29          </SvgIcon>
30          <Typography variant="h2">
31            <Trans>Blocked Address</Trans>
32          </Typography>
33          <Typography variant="helperText" sx={{ my: 4 }}>
34            {address}
35          </Typography>
36          <Typography variant="description" sx={{ textAlign: 'center', mb: 4 }}>
37            <Trans>
38              This address is blocked on app.aave.com because it is associated with one or more
39            </Trans>{' '}
40            <Link href="https://docs.aave.com/faq/#address-screening" underline="always">
41              <Trans>blocked activities</Trans>
42            </Link>
43            {'.'}
44          </Typography>
45          <Button variant="contained" onClick={onDisconnectWallet}>
46            <SvgIcon fontSize="small" sx={{ mx: 1 }}>
47              <LogoutIcon />
48            </SvgIcon>
49            <Trans>Disconnect Wallet</Trans>
50          </Button>
51        </Box>
52      </BasicModal>
53    );
54  };