Use location hook in routed tabs

Fix a unit test that is failing due to history.location
not updating as expected when a routed tab is selected.
This commit is contained in:
Jake McDermott
2020-12-18 09:36:25 -05:00
parent f09120a973
commit fa1ef87f20

View File

@@ -1,19 +1,20 @@
import React from 'react'; import React from 'react';
import { shape, string, number, arrayOf, node, oneOfType } from 'prop-types'; import { shape, string, number, arrayOf, node, oneOfType } from 'prop-types';
import { Tab, Tabs, TabTitleText } from '@patternfly/react-core'; import { Tab, Tabs, TabTitleText } from '@patternfly/react-core';
import { useHistory } from 'react-router-dom'; import { useHistory, useLocation } from 'react-router-dom';
function RoutedTabs(props) { function RoutedTabs(props) {
const { tabsArray } = props; const { tabsArray } = props;
const history = useHistory(); const history = useHistory();
const location = useLocation();
const getActiveTabId = () => { const getActiveTabId = () => {
const match = tabsArray.find(tab => tab.link === history.location.pathname); const match = tabsArray.find(tab => tab.link === location.pathname);
if (match) { if (match) {
return match.id; return match.id;
} }
const subpathMatch = tabsArray.find(tab => const subpathMatch = tabsArray.find(tab =>
history.location.pathname.startsWith(tab.link) location.pathname.startsWith(tab.link)
); );
if (subpathMatch) { if (subpathMatch) {
return subpathMatch.id; return subpathMatch.id;