status-im/MyCrypto
2
0
Fork 0
mirror of https://github.com/status-im/MyCrypto.git synced 2025-02-02 06:16:06 +00:00
Code Issues Projects Releases Wiki Activity

Fix Help Nav isActive Condition (#694)

Browse Source 
* Update tab isActive Condition

Add condition to fix help tab appearing as active at `localhost:3000/`

* Shorten long variables

* Type nav tab links, clarify conditions.
This commit is contained in:
James Prado 2018-01-01 15:43:27 -05:00 committed by Daniel Ternyak
parent 371e6e327c
commit 8452e231d8
2 changed files with 21 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
common/components/Header/components/Navigation.tsx
View File

@ -1,10 +1,15 @@
import React, { Component } from 'react';
import NavigationLink from './NavigationLink';
import { knowledgeBaseURL } from 'config/data';
import './Navigation.scss';
const tabs = [
export interface TabLink {
name: string;
to: string;
external?: boolean;
}
const tabs: TabLink[] = [
{
name: 'NAV_GenerateWallet',
to: '/generate'

27
common/components/Header/components/NavigationLink.tsx
View File

@ -2,28 +2,29 @@ import classnames from 'classnames';
import React from 'react';
import { Link, withRouter, RouteComponentProps } from 'react-router-dom';
import translate, { translateRaw } from 'translations';
import { TabLink } from './Navigation';
import './NavigationLink.scss';
interface Props extends RouteComponentProps<{}> {
link: {
name: string;
to?: string;
external?: boolean;
};
link: TabLink;
isHomepage: boolean;
}
class NavigationLink extends React.Component<Props, {}> {
public render() {
const { link, location, isHomepage } = this.props;
// isActive if
// 1) Current path is the same as link
// 2) the first path is the same for both links (/account and /account/send)
// 3) we're at the root path and this is the "homepage" nav item
const isActive =
location.pathname === link.to ||
(link.to && location.pathname.split('/')[1] === link.to.split('/')[1]) ||
(isHomepage && location.pathname === '/');
const isExternalLink = link.to.includes('http');
let isActive = false;
if (!isExternalLink) {
// isActive if
// 1) Current path is the same as link
// 2) the first path is the same for both links (/account and /account/send)
// 3) we're at the root path and this is the "homepage" nav item
const isSubRoute = location.pathname.split('/')[1] === link.to.split('/')[1];
isActive =
location.pathname === link.to || isSubRoute || (isHomepage && location.pathname === '/');
}
const linkClasses = classnames({
'NavigationLink-link': true,