import React, { PureComponent } from 'react' import PropTypes from 'prop-types' import { Switch, Route, matchPath } from 'react-router-dom' import classnames from 'classnames' import TabBar from '../../components/app/tab-bar' import { ALERTS_ROUTE, ADVANCED_ROUTE, SECURITY_ROUTE, GENERAL_ROUTE, ABOUT_US_ROUTE, SETTINGS_ROUTE, NETWORKS_ROUTE, NETWORKS_FORM_ROUTE, CONTACT_LIST_ROUTE, CONTACT_ADD_ROUTE, CONTACT_EDIT_ROUTE, CONTACT_VIEW_ROUTE, CONTACT_MY_ACCOUNTS_ROUTE, CONTACT_MY_ACCOUNTS_VIEW_ROUTE, CONTACT_MY_ACCOUNTS_EDIT_ROUTE, } from '../../helpers/constants/routes' import SettingsTab from './settings-tab' import AlertsTab from './alerts-tab' import NetworksTab from './networks-tab' import AdvancedTab from './advanced-tab' import InfoTab from './info-tab' import SecurityTab from './security-tab' import ContactListTab from './contact-list-tab' class SettingsPage extends PureComponent { static propTypes = { addressName: PropTypes.string, backRoute: PropTypes.string, currentPath: PropTypes.string, history: PropTypes.object, isAddressEntryPage: PropTypes.bool, isPopupView: PropTypes.bool, pathnameI18nKey: PropTypes.string, initialBreadCrumbRoute: PropTypes.string, breadCrumbTextKey: PropTypes.string, initialBreadCrumbKey: PropTypes.string, mostRecentOverviewPage: PropTypes.string.isRequired, } static contextTypes = { t: PropTypes.func, } render () { const { history, backRoute, currentPath, mostRecentOverviewPage } = this.props return (
{ currentPath !== SETTINGS_ROUTE && (
history.push(backRoute)} /> ) } { this.renderTitle() }
history.push(mostRecentOverviewPage)} />
{ this.renderTabs() }
{ this.renderSubHeader() } { this.renderContent() }
) } renderTitle () { const { t } = this.context const { isPopupView, pathnameI18nKey, addressName } = this.props let titleText if (isPopupView && addressName) { titleText = addressName } else if (pathnameI18nKey && isPopupView) { titleText = t(pathnameI18nKey) } else { titleText = t('settings') } return (
{titleText}
) } renderSubHeader () { const { t } = this.context const { currentPath, isPopupView, isAddressEntryPage, pathnameI18nKey, addressName, initialBreadCrumbRoute, breadCrumbTextKey, history, initialBreadCrumbKey, } = this.props let subheaderText if (isPopupView && isAddressEntryPage) { subheaderText = t('settings') } else if (initialBreadCrumbKey) { subheaderText = t(initialBreadCrumbKey) } else { subheaderText = t(pathnameI18nKey || 'general') } return currentPath !== NETWORKS_ROUTE && (
initialBreadCrumbRoute && history.push(initialBreadCrumbRoute)} > {subheaderText}
{breadCrumbTextKey && (
{' > '}{t(breadCrumbTextKey)}
)} {isAddressEntryPage && (
{' > '}{addressName}
)}
) } renderTabs () { const { history, currentPath } = this.props const { t } = this.context return ( { if (key === GENERAL_ROUTE && currentPath === SETTINGS_ROUTE) { return true } return matchPath(currentPath, { path: key, exact: true }) }} onSelect={(key) => history.push(key)} /> ) } renderContent () { return ( ) } } export default SettingsPage