github/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-06-09 20:55:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(docs): highlight active version in version switcher (#16790)

Browse Source 
* docs: highlight active version in version switcher

* Add comment explaining workaround
This commit is contained in:
Nicholas Flamy 2025-03-11 06:41:12 -04:00 committed by GitHub
parent 48dddb78d4
commit f0f0056fe3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 3 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
docs/src/components/version-switcher.tsx
View File

@ -4,7 +4,7 @@ import React, { useEffect, useState } from 'react';
export default function VersionSwitcher(): JSX.Element { export default function VersionSwitcher(): JSX.Element {
const [versions, setVersions] = useState([]); const [versions, setVersions] = useState([]);
const [label, setLabel] = useState('Versions'); const [activeLabel, setLabel] = useState('Versions');
const windowSize = useWindowSize(); const windowSize = useWindowSize();
@ -48,12 +48,13 @@ export default function VersionSwitcher(): JSX.Element {
versions.length > 0 && ( versions.length > 0 && (
<DropdownNavbarItem <DropdownNavbarItem
className="version-switcher-34ab39" className="version-switcher-34ab39"
label={label} label={activeLabel}
mobile={windowSize === 'mobile'} mobile={windowSize === 'mobile'}
items={versions.map(({ label, url }) => ({ items={versions.map(({ label, url }) => ({
label, label,
to: new URL(location.pathname + location.search + location.hash, url).href, to: new URL(location.pathname + location.search + location.hash, url).href,
target: '_self', target: '_self',
className: label === activeLabel ? 'dropdown__link--active menu__link--active' : '', // workaround because React Router `<NavLink>` only supports using URL path for checking if active: https://v5.reactrouter.com/web/api/NavLink/isactive-func
}))} }))}
/> />
) )