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, 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, isPopup: 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 { isPopup, pathnameI18nKey, addressName } = this.props let titleText if (isPopup && addressName) { titleText = addressName } else if (pathnameI18nKey && isPopup) { titleText = t(pathnameI18nKey) } else { titleText = t('settings') } return
{titleText}
} renderSubHeader() { const { t } = this.context const { currentPath, isPopup, isAddressEntryPage, pathnameI18nKey, addressName, initialBreadCrumbRoute, breadCrumbTextKey, history, initialBreadCrumbKey, } = this.props let subheaderText if (isPopup && isAddressEntryPage) { subheaderText = t('settings') } else if (initialBreadCrumbKey) { subheaderText = t(initialBreadCrumbKey) } else { subheaderText = t(pathnameI18nKey || 'general') } return ( !currentPath.startsWith(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