publicdata/j40-cejst-2
1
0
Fork 0
mirror of https://github.com/DOI-DO/j40-cejst-2.git synced 2025-08-21 09:31:40 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

remove dropdown from navigation menu

Browse source 
- remove dropdown from gherkin tests
- update snapshots
This commit is contained in:
Vim USDS 2022-04-05 13:17:38 -07:00
commit 531978b5d5
11 changed files with 194 additions and 850 deletions
Download patch file Download diff file Expand all files Collapse all files

200
client/src/components/J40Header/J40Header.tsx
View file

@ -6,8 +6,8 @@ import {
PrimaryNav,
Grid,
Alert,
NavDropDownButton,
Menu,
// NavDropDownButton,
// Menu,
} from '@trussworks/react-uswds';
import BetaBanner from '../BetaBanner';
import J40MainGridContainer from '../J40MainGridContainer';
@ -42,62 +42,63 @@ const J40Header = () => {
* index 0 = Data & Methodology dropdown
* index 1 = About dropdown
*/
const [isOpen, setIsOpen] = useState([false, false]);
const onToggle = (index: number): void => {
setIsOpen((prevIsOpen) => {
const newIsOpen = [false, false];
newIsOpen[index] = !prevIsOpen[index];
return newIsOpen;
});
};
// const [isOpen, setIsOpen] = useState([false, false]);
// const onToggle = (index: number): void => {
// setIsOpen((prevIsOpen) => {
// const newIsOpen = [false, false];
// newIsOpen[index] = !prevIsOpen[index];
// return newIsOpen;
// });
// };
const methPageSubNavLinks = [
<Link
to={PAGES_ENDPOINTS.METHODOLOGY}
key={'methodology'}
activeClassName="usa-current"
data-cy={'nav-link-methodology'}>
{intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
</Link>,
<Link
to={PAGES_ENDPOINTS.DOWNLOADS}
key={'downloads'}
activeClassName="usa-current"
data-cy={'nav-link-downloads'}>
{intl.formatMessage(COMMON_COPY.HEADER.DOWNLOADS)}
</Link>,
<Link
to={PAGES_ENDPOINTS.TSD}
key={'tsd'}
activeClassName="usa-current"
data-cy={'nav-link-technical-support-docs'}>
{intl.formatMessage(COMMON_COPY.HEADER.TSD)}
</Link>,
];
// Commenting out subnav links for now
// const methPageSubNavLinks = [
// <Link
// to={PAGES_ENDPOINTS.METHODOLOGY}
// key={'methodology'}
// activeClassName="usa-current"
// data-cy={'nav-link-methodology'}>
// {intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
// </Link>,
// <Link
// to={PAGES_ENDPOINTS.DOWNLOADS}
// key={'downloads'}
// activeClassName="usa-current"
// data-cy={'nav-link-downloads'}>
// {intl.formatMessage(COMMON_COPY.HEADER.DOWNLOADS)}
// </Link>,
// <Link
// to={PAGES_ENDPOINTS.TSD}
// key={'tsd'}
// activeClassName="usa-current"
// data-cy={'nav-link-technical-support-docs'}>
// {intl.formatMessage(COMMON_COPY.HEADER.TSD)}
// </Link>,
// ];
const aboutSubNavLinks = [
<Link
to={PAGES_ENDPOINTS.ABOUT}
key={'about'}
activeClassName="usa-current"
data-cy={'nav-link-about'}>
{intl.formatMessage(COMMON_COPY.HEADER.ABOUT)}
</Link>,
<Link
to={PAGES_ENDPOINTS.FAQS}
key={'faqs'}
activeClassName="usa-current"
data-cy={'nav-link-faqs'}>
{intl.formatMessage(COMMON_COPY.HEADER.FAQs)}
</Link>,
<Link
to={PAGES_ENDPOINTS.PUBLIC_ENG}
key={'publicEng'}
activeClassName="usa-current"
data-cy={'nav-link-public-engagement'}>
{intl.formatMessage(COMMON_COPY.HEADER.PUBLIC_ENG)}
</Link>,
];
// const aboutSubNavLinks = [
// <Link
// to={PAGES_ENDPOINTS.ABOUT}
// key={'about'}
// activeClassName="usa-current"
// data-cy={'nav-link-about'}>
// {intl.formatMessage(COMMON_COPY.HEADER.ABOUT)}
// </Link>,
// <Link
// to={PAGES_ENDPOINTS.FAQS}
// key={'faqs'}
// activeClassName="usa-current"
// data-cy={'nav-link-faqs'}>
// {intl.formatMessage(COMMON_COPY.HEADER.FAQs)}
// </Link>,
// <Link
// to={PAGES_ENDPOINTS.PUBLIC_ENG}
// key={'publicEng'}
// activeClassName="usa-current"
// data-cy={'nav-link-public-engagement'}>
// {intl.formatMessage(COMMON_COPY.HEADER.PUBLIC_ENG)}
// </Link>,
// ];
const navLinks = [
<Link
@ -107,42 +108,57 @@ const J40Header = () => {
data-cy={'nav-link-explore-the-tool'}>
{intl.formatMessage(COMMON_COPY.HEADER.EXPLORE)}
</Link>,
<>
<NavDropDownButton
key="methDropDown"
label={intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
menuId="methMenu"
isOpen={isOpen[0]}
onToggle={(): void => onToggle(0)}
data-cy={'nav-dropdown-methodology'}
>
</NavDropDownButton>
<Menu
id='methMenu'
type='subnav'
items={methPageSubNavLinks}
isOpen={isOpen[0]}
>
</Menu>
</>,
<>
<NavDropDownButton
key="aboutDropDown"
label={intl.formatMessage(COMMON_COPY.HEADER.ABOUT)}
menuId="aboutMenu"
isOpen={isOpen[1]}
onToggle={(): void => onToggle(1)}
data-cy={'nav-dropdown-about'}
>
</NavDropDownButton>
<Menu
id='aboutMenu'
type='subnav'
items={aboutSubNavLinks}
isOpen={isOpen[1]}
>
</Menu>
</>,
<Link
to={PAGES_ENDPOINTS.METHODOLOGY}
key={'methodology'}
activeClassName="usa-current"
data-cy={'nav-link-methodology'}>
{intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
</Link>,
<Link
to={PAGES_ENDPOINTS.ABOUT}
key={'about'}
activeClassName="usa-current"
data-cy={'nav-link-about'}>
{intl.formatMessage(COMMON_COPY.HEADER.ABOUT)}
</Link>,
// <>
// <NavDropDownButton
// key="methDropDown"
// label={intl.formatMessage(COMMON_COPY.HEADER.METHODOLOGY)}
// menuId="methMenu"
// isOpen={isOpen[0]}
// onToggle={(): void => onToggle(0)}
// data-cy={'nav-dropdown-methodology'}
// className={styles.navDropDownBtn}
// >
// </NavDropDownButton>
// <Menu
// id='methMenu'
// type='subnav'
// items={methPageSubNavLinks}
// isOpen={isOpen[0]}
// >
// </Menu>
// </>,
// <>
// <NavDropDownButton
// key="aboutDropDown"
// label={intl.formatMessage(COMMON_COPY.HEADER.ABOUT)}
// menuId="aboutMenu"
// isOpen={isOpen[1]}
// onToggle={(): void => onToggle(1)}
// data-cy={'nav-dropdown-about'}
// >
// </NavDropDownButton>
// <Menu
// id='aboutMenu'
// type='subnav'
// items={aboutSubNavLinks}
// isOpen={isOpen[1]}
// >
// </Menu>
// </>,
<Link
to={PAGES_ENDPOINTS.CONTACT}
key={'contact'}