Files
bigcapital/src/containers/Setup/SetupLeftSection.js
2021-09-21 17:13:53 +02:00

98 lines
2.1 KiB
JavaScript

import React from 'react';
import { Icon, For } from 'components';
import { FormattedMessage as T } from 'components';
import { getFooterLinks } from 'config/footerLinks';
import { useAuthActions } from 'hooks/state';
/**
* Footer item link.
*/
function FooterLinkItem({ title, link }) {
return (
<div class="content__links-item">
<a href={link} target="_blank">
{title}
</a>
</div>
);
}
/**
* Setup left section footer.
*/
function SetupLeftSectionFooter() {
// Retrieve the footer links.
const footerLinks = getFooterLinks();
return (
<div className={'content__footer'}>
<div className={'content__contact-info'}>
<p>
<T id={'setup.left_side.footer_help'} />{' '}
<span>{'+21892-738-1987'}</span>
</p>
</div>
<div className={'content__links'}>
<For render={FooterLinkItem} of={footerLinks} />
</div>
</div>
);
}
/**
* Setup left section header.
*/
function SetupLeftSectionHeader() {
const { setLogout } = useAuthActions();
// Handle logout link click.
const onClickLogout = () => {
setLogout();
};
return (
<div className={'content__header'}>
<h1 className={'content__title'}>
<T id={'setup.left_side.title'} />
</h1>
<p className={'content__text'}>
<T id={'setup.left_side.description'} />
</p>
<div class="content__divider"></div>
<div className={'content__organization'}>
<span class="signout">
<a onClick={onClickLogout} href="#">
<T id={'sign_out'} />
</a>
</span>
</div>
</div>
);
}
/**
* Wizard setup left section.
*/
export default function SetupLeftSection() {
return (
<section className={'setup-page__left-section'}>
<div className={'content'}>
<div className={'content__logo'}>
<Icon
icon="bigcapital"
className={'bigcapital--alt'}
height={37}
width={190}
/>
</div>
<SetupLeftSectionHeader />
<SetupLeftSectionFooter />
</div>
</section>
);
}