69 lines
2.2 KiB
TypeScript
69 lines
2.2 KiB
TypeScript
import type { FC } from 'react';
|
|
|
|
import { FormattedMessage } from 'react-intl';
|
|
|
|
import { DisplayName } from '@/mastodon/components/display_name';
|
|
import { IconLogo } from '@/mastodon/components/logo';
|
|
import { useAppSelector } from '@/mastodon/store';
|
|
|
|
import { AnnualReport, accountSelector } from './index';
|
|
import classes from './shared_page.module.scss';
|
|
|
|
export const WrapstodonSharedPage: FC = () => {
|
|
const account = useAppSelector(accountSelector);
|
|
const domain = useAppSelector((state) => state.meta.get('domain') as string);
|
|
return (
|
|
<main className={classes.wrapper}>
|
|
<AnnualReport />
|
|
<footer className={classes.footer}>
|
|
<div className={classes.footerSection}>
|
|
<IconLogo className={classes.logo} />
|
|
<FormattedMessage
|
|
id='annual_report.shared_page.footer'
|
|
defaultMessage='Generated with {heart} by the Mastodon team'
|
|
values={{ heart: '🐘' }}
|
|
tagName='p'
|
|
/>
|
|
<ul className={classes.linkList}>
|
|
<li>
|
|
<a href='https://joinmastodon.org'>
|
|
<FormattedMessage
|
|
id='footer.about_mastodon'
|
|
defaultMessage='About Mastodon'
|
|
/>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href='https://joinmastodon.org/sponsors'>
|
|
<FormattedMessage
|
|
id='annual_report.shared_page.donate'
|
|
defaultMessage='Donate'
|
|
/>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div className={classes.footerSection}>
|
|
<FormattedMessage
|
|
id='annual_report.shared_page.footer_server_info'
|
|
defaultMessage='{username} uses {domain}, one of many communities powered by Mastodon.'
|
|
values={{
|
|
username: <DisplayName variant='simple' account={account} />,
|
|
domain: <strong>{domain}</strong>,
|
|
}}
|
|
tagName='p'
|
|
/>
|
|
<a href='/about'>
|
|
<FormattedMessage
|
|
id='footer.about_server'
|
|
defaultMessage='About {domain}'
|
|
values={{ domain }}
|
|
/>
|
|
</a>
|
|
</div>
|
|
</footer>
|
|
</main>
|
|
);
|
|
};
|