Mo Elzubeir
81 lines
2.2 KiB
JavaScript
81 lines
2.2 KiB
JavaScript
import React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { translate } from 'react-i18next';
|
|
import { Link, withRouter } from 'react-router-dom';
|
|
import { Nav, NavItem } from 'reactstrap';
|
|
import cl from 'classnames';
|
|
|
|
export class MainTabsLinks extends React.Component {
|
|
static propTypes = {
|
|
tabs: PropTypes.object.isRequired,
|
|
restrictions: PropTypes.object.isRequired,
|
|
t: PropTypes.func.isRequired,
|
|
actions: PropTypes.object.isRequired,
|
|
location: PropTypes.object
|
|
};
|
|
|
|
validateTab = (tab) => {
|
|
if (tab === 'analyze') {
|
|
if (!this.props.restrictions) {
|
|
// to prevent: permissions of `undefined`
|
|
return false;
|
|
}
|
|
const permissions = this.props.restrictions.permissions;
|
|
return permissions.analytics;
|
|
}
|
|
return true;
|
|
};
|
|
|
|
showUpgradeModal = (e) => {
|
|
e.preventDefault();
|
|
this.props.actions.toggleUpgradeModal();
|
|
};
|
|
|
|
render() {
|
|
const { t, tabs, location } = this.props;
|
|
|
|
return (
|
|
<Nav className="header-megamenu">
|
|
{Object.keys(tabs).map((tab, i) => {
|
|
const firstSubTab =
|
|
tabs[tab].items && tabs[tab].items[0] ? tabs[tab].items[0].url : '';
|
|
|
|
if (!this.validateTab(tab)) {
|
|
return (
|
|
<NavItem key={tab}>
|
|
<a
|
|
href="#"
|
|
onClick={this.showUpgradeModal}
|
|
className={cl('nav-link', {
|
|
active: location.pathname.startsWith(`/app/${tab}`)
|
|
})}
|
|
>
|
|
<i className={`nav-link-icon ${tabs[tab].icon}`}> </i>
|
|
<p>{t('tabs.' + tab)}</p>
|
|
</a>
|
|
</NavItem>
|
|
);
|
|
}
|
|
return (
|
|
<NavItem key={tab}>
|
|
<Link
|
|
to={`/app/${tab}/${firstSubTab}`}
|
|
className={cl('nav-link', {
|
|
active: location.pathname.startsWith(`/app/${tab}`)
|
|
})}
|
|
>
|
|
<i className={`nav-link-icon ${tabs[tab].icon}`}> </i>
|
|
<p>{t('tabs.' + tab)}</p>
|
|
</Link>
|
|
</NavItem>
|
|
);
|
|
})}
|
|
</Nav>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default translate(['common'], { wait: true })(
|
|
withRouter(React.memo(MainTabsLinks))
|
|
);
|