88 lines
3.7 KiB
TypeScript
88 lines
3.7 KiB
TypeScript
import classNames from 'classnames';
|
|
import React from 'react';
|
|
import { FormattedMessage, useIntl } from 'react-intl';
|
|
import { useDispatch } from 'react-redux';
|
|
import { Link } from 'react-router-dom';
|
|
|
|
import { logOut } from 'soapbox/actions/auth';
|
|
import { Text } from 'soapbox/components/ui';
|
|
import emojify from 'soapbox/features/emoji/emoji';
|
|
import { useSoapboxConfig, useOwnAccount, useFeatures } from 'soapbox/hooks';
|
|
import sourceCode from 'soapbox/utils/code';
|
|
|
|
interface IFooterLink {
|
|
to: string,
|
|
className?: string,
|
|
onClick?: React.EventHandler<React.MouseEvent>,
|
|
}
|
|
|
|
const FooterLink: React.FC<IFooterLink> = ({ children, className, ...rest }): JSX.Element => {
|
|
return (
|
|
<Link className={classNames('text-gray-400 hover:text-gray-500 hover:underline', className)} {...rest}>{children}</Link>
|
|
);
|
|
};
|
|
|
|
const LinkFooter: React.FC = (): JSX.Element => {
|
|
const account = useOwnAccount();
|
|
const features = useFeatures();
|
|
const soapboxConfig = useSoapboxConfig();
|
|
|
|
const intl = useIntl();
|
|
const dispatch = useDispatch();
|
|
|
|
const onClickLogOut: React.EventHandler<React.MouseEvent> = (e) => {
|
|
dispatch(logOut(intl));
|
|
e.preventDefault();
|
|
};
|
|
|
|
return (
|
|
<div className='space-y-2'>
|
|
<ul className='flex flex-wrap items-center divide-x-dot'>
|
|
{account && <>
|
|
{features.profileDirectory && (
|
|
<li><FooterLink to='/directory'><FormattedMessage id='navigation_bar.profile_directory' defaultMessage='Profile directory' /></FooterLink></li>
|
|
)}
|
|
<li><FooterLink to='/blocks'><FormattedMessage id='navigation_bar.blocks' defaultMessage='Blocks' /></FooterLink></li>
|
|
<li><FooterLink to='/mutes'><FormattedMessage id='navigation_bar.mutes' defaultMessage='Mutes' /></FooterLink></li>
|
|
{features.filters && (
|
|
<li><FooterLink to='/filters'><FormattedMessage id='navigation_bar.filters' defaultMessage='Filters' /></FooterLink></li>
|
|
)}
|
|
{features.federating && (
|
|
<li><FooterLink to='/domain_blocks'><FormattedMessage id='navigation_bar.domain_blocks' defaultMessage='Domain blocks' /></FooterLink></li>
|
|
)}
|
|
{account.locked && (
|
|
<li><FooterLink to='/follow_requests'><FormattedMessage id='navigation_bar.follow_requests' defaultMessage='Follow requests' /></FooterLink></li>
|
|
)}
|
|
{features.importAPI && (
|
|
<li><FooterLink to='/settings/import'><FormattedMessage id='navigation_bar.import_data' defaultMessage='Import data' /></FooterLink></li>
|
|
)}
|
|
{(features.federating && features.accountAliasesAPI) && (
|
|
<li><FooterLink to='/settings/aliases'><FormattedMessage id='navigation_bar.account_aliases' defaultMessage='Account aliases' /></FooterLink></li>
|
|
)}
|
|
<li><FooterLink to='/auth/sign_out' onClick={onClickLogOut}><FormattedMessage id='navigation_bar.logout' defaultMessage='Logout' /></FooterLink></li>
|
|
</>}
|
|
</ul>
|
|
|
|
<Text theme='muted' size='sm'>
|
|
{soapboxConfig.linkFooterMessage ? (
|
|
<span
|
|
className='inline-block align-middle'
|
|
dangerouslySetInnerHTML={{ __html: emojify(soapboxConfig.linkFooterMessage) }}
|
|
/>
|
|
) : (
|
|
<FormattedMessage
|
|
id='getting_started.open_source_notice'
|
|
defaultMessage='{code_name} is open source software. You can contribute or report issues at {code_link} (v{code_version}).'
|
|
values={{
|
|
code_name: sourceCode.displayName,
|
|
code_link: <a href={sourceCode.url} rel='noopener' target='_blank'>{sourceCode.repository}</a>,
|
|
code_version: sourceCode.version,
|
|
}}
|
|
/>
|
|
)}
|
|
</Text>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default LinkFooter;
|