76 lines
2.6 KiB
JavaScript
76 lines
2.6 KiB
JavaScript
import PropTypes from 'prop-types';
|
|
import React from 'react';
|
|
import { useIntl } from 'react-intl';
|
|
import { useDispatch, useSelector } from 'react-redux';
|
|
import { Link } from 'react-router-dom';
|
|
|
|
import { getSoapboxConfig } from 'soapbox/actions/soapbox';
|
|
import LandingGradient from 'soapbox/components/landing-gradient';
|
|
import BundleContainer from 'soapbox/features/ui/containers/bundle_container';
|
|
import { NotificationsContainer } from 'soapbox/features/ui/util/async-components';
|
|
|
|
import { logOut } from '../../actions/auth';
|
|
import { Button, Stack, Text } from '../../components/ui';
|
|
|
|
const WaitlistPage = ({ account }) => {
|
|
const dispatch = useDispatch();
|
|
const intl = useIntl();
|
|
|
|
const logo = useSelector((state) => getSoapboxConfig(state).get('logo'));
|
|
|
|
const onClickLogOut = (event) => {
|
|
event.preventDefault();
|
|
dispatch(logOut(intl));
|
|
};
|
|
|
|
return (
|
|
<div>
|
|
<LandingGradient />
|
|
|
|
<main className='relative flex flex-col h-screen max-w-7xl mx-auto px-2 sm:px-6 lg:px-8'>
|
|
<header className='relative flex justify-between h-16'>
|
|
<div className='flex-1 flex items-stretch justify-center relative'>
|
|
<Link to='/' className='cursor-pointer flex-shrink-0 flex items-center'>
|
|
<img alt='Logo' src={logo} className='h-7' />
|
|
</Link>
|
|
|
|
<div className='absolute inset-y-0 right-0 flex items-center pr-2 space-x-3'>
|
|
<Button onClick={onClickLogOut} theme='primary' to='/logout'>
|
|
Sign out
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<div className='-mt-16 flex flex-col justify-center items-center h-full'>
|
|
<div className='max-w-2xl'>
|
|
<Stack space={4}>
|
|
<img src='/instance/images/waitlist.png' className='mx-auto w-32 h-32' alt='Waitlisted' />
|
|
|
|
<Stack space={2}>
|
|
<Text size='2xl' align='center' weight='bold'>
|
|
@{account.acct} has been created successfully!
|
|
</Text>
|
|
<Text size='lg' theme='muted' align='center' weight='medium'>
|
|
Due to massive demand, we have placed you on our waitlist.
|
|
We love you, and you're not just another number to us.
|
|
We are working to get you on our platform. Stay tuned!
|
|
</Text>
|
|
</Stack>
|
|
</Stack>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<BundleContainer fetchComponent={NotificationsContainer}>
|
|
{(Component) => <Component />}
|
|
</BundleContainer>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
WaitlistPage.propTypes = {
|
|
account: PropTypes.object,
|
|
};
|
|
|
|
export default WaitlistPage;
|