/ src / components / FaucetButton.tsx
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  };