/ src / components / infoTooltips / DebtCeilingMaxedTooltip.tsx
DebtCeilingMaxedTooltip.tsx
 1  import { ExclamationIcon } from '@heroicons/react/outline';
 2  import { Trans } from '@lingui/macro';
 3  import { Box } from '@mui/material';
 4  import { AssetCapData } from 'src/hooks/useAssetCaps';
 5  
 6  import { Link } from '../primitives/Link';
 7  import { TextWithTooltip, TextWithTooltipProps } from '../TextWithTooltip';
 8  
 9  type DebtCeilingMaxedTooltipProps = TextWithTooltipProps & {
10    debtCeiling: AssetCapData;
11  };
12  
13  export const DebtCeilingMaxedTooltip = ({ debtCeiling, ...rest }: DebtCeilingMaxedTooltipProps) => {
14    if (!debtCeiling || !debtCeiling.isMaxed) return null;
15  
16    return (
17      <Box sx={{ ml: 2 }}>
18        <TextWithTooltip {...rest} icon={<ExclamationIcon />} iconColor="error.main" iconSize={18}>
19          <>
20            <Trans>
21              Protocol debt ceiling is at 100% for this asset. Futher borrowing against this asset is
22              unavailable.
23            </Trans>{' '}
24            <Link
25              href="https://docs.aave.com/faq/aave-v3-features#how-does-isolation-mode-affect-my-borrowing-power"
26              underline="always"
27            >
28              <Trans>Learn more</Trans>
29            </Link>
30          </>
31        </TextWithTooltip>
32      </Box>
33    );
34  };