accounts-frontend/packages/app/components/footerMenu/FooterMenu.tsx

61 lines
2.1 KiB
TypeScript
Raw Normal View History

import React, { ComponentType, MouseEventHandler, useCallback } from 'react';
import { Link } from 'react-router-dom';
2016-05-22 22:55:38 +05:30
import { FormattedMessage as Message } from 'react-intl';
import { useReduxDispatch } from 'app/functions';
import LanguageSwitcher from 'app/components/languageSwitcher';
2020-07-10 00:29:54 +05:30
import SourceCode from 'app/components/sourceCode';
import { create as createPopup } from 'app/components/ui/popup/actions';
import { ContactLink } from 'app/components/contact';
2016-05-22 22:55:38 +05:30
import styles from './footerMenu.scss';
const FooterMenu: ComponentType = () => {
const dispatch = useReduxDispatch();
2020-07-10 00:29:54 +05:30
const createPopupHandler = useCallback(
(popup: ComponentType): MouseEventHandler<HTMLAnchorElement> => (event) => {
2020-05-24 04:38:24 +05:30
event.preventDefault();
2020-07-10 00:29:54 +05:30
dispatch(createPopup({ Popup: popup }));
2020-05-24 04:38:24 +05:30
},
[dispatch],
);
2020-05-24 04:38:24 +05:30
return (
<div className={styles.footerMenu} data-testid="footer">
2020-07-09 05:20:40 +05:30
<div className={styles.row}>
<Link to="/rules" className={styles.footerItem}>
<Message key="rules" defaultMessage="Rules" />
</Link>
{'ꞏ'}
<ContactLink className={styles.footerItem}>
<Message key="contactUs" defaultMessage="Contact Us" />
</ContactLink>
</div>
<div className={styles.row}>
<Link to="/dev" className={styles.footerItem}>
<Message key="forDevelopers" defaultMessage="For developers" />
</Link>
{'ꞏ'}
2020-07-10 00:29:54 +05:30
<a href="#" className={styles.footerItem} onClick={createPopupHandler(SourceCode)}>
2020-07-09 05:20:40 +05:30
<Message key="sourceCode" defaultMessage="Source code" />
</a>
</div>
<div className={styles.row}>
2020-07-10 00:29:54 +05:30
<a href="#" className={styles.footerItem} onClick={createPopupHandler(LanguageSwitcher)}>
2020-05-24 04:38:24 +05:30
<span className={styles.langTriggerIcon} />
<Message key="siteLanguage" defaultMessage="Site language" />
2020-05-24 04:38:24 +05:30
</a>
</div>
</div>
);
};
2016-05-22 22:55:38 +05:30
export default FooterMenu;