FaucetButton.tsx
1 import { ExternalLinkIcon } from '@heroicons/react/outline'; 2 import { Trans } from '@lingui/macro'; 3 import { Button, SvgIcon, Typography } from '@mui/material'; 4 import { useRootStore } from 'src/store/root'; 5 6 import { DarkTooltip } from './infoTooltips/DarkTooltip'; 7 import { Link, ROUTES } from './primitives/Link'; 8 9 export const FaucetButton = () => { 10 const currentNetworkConfig = useRootStore((store) => store.currentNetworkConfig); 11 12 return ( 13 <DarkTooltip title="Get free assets to test the Aave Protocol"> 14 <Button 15 startIcon={ 16 <img 17 src={currentNetworkConfig.networkLogoPath} 18 alt={currentNetworkConfig.name} 19 style={{ width: 14, height: 14 }} 20 /> 21 } 22 endIcon={ 23 <SvgIcon sx={{ width: 14, height: 14 }}> 24 <ExternalLinkIcon /> 25 </SvgIcon> 26 } 27 component={Link} 28 href={ROUTES.faucet} 29 variant="outlined" 30 size="small" 31 > 32 <Typography variant="buttonS"> 33 <Trans>{currentNetworkConfig.name} Faucet</Trans> 34 </Typography> 35 </Button> 36 </DarkTooltip> 37 ); 38 };