Conversation
There was a problem hiding this comment.
Pull request overview
Fixes mobile/tablet header “About” submenu behavior by treating PDF entries as external links and making “About INS” a normal navigable item.
Changes:
- Introduces a
NavItemtype and applies stronger typing to navigation config structures - Reclassifies “About INS” from subtitle styling to a standard sub-item link
- Routes PDF links through
<a>(target="_blank") instead of SPA routing to avoid hash-route issues
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 4 comments.
| File | Description |
|---|---|
| src/config/globalHeaderData.tsx | Adds NavItem typing and marks PDF nav items as externalLink |
| src/components/Header/HeaderTablet.tsx | Renders externalLink subitems using <a> instead of router <Link> |
| src/components/Header/HeaderMobile.tsx | Same as tablet: uses <a> for externalLink subitems |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 4 out of 4 changed files in this pull request and generated 4 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| @@ -0,0 +1,38 @@ | |||
| import React from 'react'; | |||
| import { Link } from 'react-router-dom'; | |||
| import { NavItem } from '../../../config/globalHeaderData.tsx'; | |||
There was a problem hiding this comment.
The '.tsx' extension in the import statement is unnecessary. TypeScript and modern bundlers resolve imports without explicit extensions. Remove '.tsx' from the import path.
| import { NavItem } from '../../../config/globalHeaderData.tsx'; | |
| import { NavItem } from '../../../config/globalHeaderData'; |
| href={item.link} | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| onClick={onClose} |
There was a problem hiding this comment.
Links opening in new tabs with target='_blank' should inform users about this behavior. Consider adding an aria-label or visible indicator (like an icon) to indicate that the link opens in a new window.
| onClick={onClose} | |
| onClick={onClose} | |
| aria-label={`${item.name} (opens in a new tab)`} |
| import Logo from "./components/LogoTablet.tsx"; | ||
| import SearchBar from "./components/SearchBarTablet.tsx"; | ||
| import NavMobileSubItem from "./components/NavMobileSubItem.tsx"; |
There was a problem hiding this comment.
The '.tsx' extensions in import statements are unnecessary. Remove them for consistency with standard TypeScript/React practices.
2 participants
Overview
Fixed Mobile Header About Page links
Change Details (Specifics)
Related Ticket(s)
INS-1528