DebtCeilingWarning.tsx
1 import { Trans } from '@lingui/macro'; 2 import { AlertProps } from '@mui/material'; 3 import { AssetCapData } from 'src/hooks/useAssetCaps'; 4 5 import { Link } from '../../primitives/Link'; 6 import { Warning } from '../../primitives/Warning'; 7 8 type DebtCeilingWarningProps = AlertProps & { 9 debtCeiling: AssetCapData; 10 icon?: boolean; 11 }; 12 13 export const DebtCeilingWarning = ({ 14 debtCeiling, 15 icon = true, 16 ...rest 17 }: DebtCeilingWarningProps) => { 18 // Don't show a warning when less than 98% utilized 19 if (!debtCeiling.percentUsed || debtCeiling.percentUsed < 98) return null; 20 21 const severity = debtCeiling.isMaxed ? 'error' : 'warning'; 22 23 const renderText = () => { 24 return debtCeiling.isMaxed ? ( 25 <Trans> 26 Protocol debt ceiling is at 100% for this asset. Further borrowing against this asset is 27 unavailable. 28 </Trans> 29 ) : ( 30 <Trans> 31 Maximum amount available to borrow against this asset is limited because debt ceiling is at{' '} 32 {debtCeiling.percentUsed.toFixed(2)}%. 33 </Trans> 34 ); 35 }; 36 37 return ( 38 <Warning severity={severity} icon={icon} {...rest}> 39 {renderText()}{' '} 40 <Link 41 href="https://docs.aave.com/faq/aave-v3-features#how-does-isolation-mode-affect-my-borrowing-power" 42 underline="always" 43 > 44 <Trans>Learn more</Trans> 45 </Link> 46 </Warning> 47 ); 48 };