1import {Box, Button, Typography} from '@mui/material';
 2import {useTranslation} from 'next-i18next';
 3import OpenInNewIcon from '@mui/icons-material/OpenInNew';
 4import useSettings from '../../hooks/useSettings';
 5import Link from 'next/link';
 6
 7type Props = {};
 8
 9const StripeDashboardLink = (props: Props) => {
10  const {t} = useTranslation();
11  const {stripe_dashboard_link} = useSettings();
12
13  if (!stripe_dashboard_link) return null;
14
15  return (
16    <Box px={2}>
17      <Box display="flex" alignItems="center" justifyContent="space-between">
18        <Typography variant="h6">{t`profile.stripe_link.title`}</Typography>
19        <Link href={stripe_dashboard_link} target="_blank">
20          <Button
21            endIcon={<OpenInNewIcon />}
22          >{t`profile.stripe_link.button`}</Button>
23        </Link>
24      </Box>
25    </Box>
26  );
27};
28export default StripeDashboardLink;