59 lines
1.9 KiB
TypeScript
59 lines
1.9 KiB
TypeScript
import React, { useMemo, useState } from 'react';
|
|
import { AuthenticationCard } from '../AuthenticationCard';
|
|
import { Box, CardHeader, Divider, Stack, Typography } from '@mui/material';
|
|
import AccountCreatedIcon from '@/assets/account-created.svg';
|
|
import { useTranslation } from 'react-i18next';
|
|
import { Link as RouterLink, useSearchParams } from 'react-router-dom';
|
|
import Link from '@mui/material/Link';
|
|
import { AccountCreatedClubBanner } from './AccountCreatedClubBanner';
|
|
|
|
type RequestedApplication = 'default' | 'unknown' | 'club';
|
|
|
|
export const AccountCreated = () => {
|
|
const { t } = useTranslation('authentication');
|
|
const [params] = useSearchParams();
|
|
|
|
// Checking if there is a requested application and if its club or any other url
|
|
const requestedApplication = useMemo<RequestedApplication>(() => {
|
|
const returnUrl = params.get('returnUrl');
|
|
|
|
if (!returnUrl) return 'default';
|
|
|
|
if (returnUrl.includes('https://club.business-harmony.com/')) {
|
|
return 'club';
|
|
}
|
|
|
|
return 'unknown';
|
|
}, [params]);
|
|
|
|
return (
|
|
<AuthenticationCard maxWidth="636px">
|
|
<Stack sx={{ alignItems: 'center' }}>
|
|
<img src={AccountCreatedIcon} />
|
|
|
|
<Typography variant="h5" sx={{ mt: 2 }}>
|
|
{t('accountCreated.yourHarmonyAccountHasBeenSuccessfullyCreated')}
|
|
</Typography>
|
|
|
|
<Typography variant="body2" sx={{ mt: 1, mb: 2 }}>
|
|
{t('accountCreated.yourAccountInformationCanBeChangedThrough')}
|
|
|
|
<Link component={RouterLink} to="/setting/profile" underline="always">
|
|
{t('accountCreated.accountSettings')}
|
|
</Link>
|
|
|
|
{t('accountCreated.yourAccountInformationCanBeChangedThroughEnd')}
|
|
</Typography>
|
|
</Stack>
|
|
|
|
{requestedApplication !== 'default' && (
|
|
<Box sx={{ mx: 7 }}>
|
|
<Divider sx={{ my: 2 }} />
|
|
|
|
{requestedApplication === 'club' && <AccountCreatedClubBanner />}
|
|
</Box>
|
|
)}
|
|
</AuthenticationCard>
|
|
);
|
|
};
|