diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js index 7b7f726458a..13812cf86f9 100644 --- a/docs/docusaurus.config.js +++ b/docs/docusaurus.config.js @@ -193,6 +193,16 @@ const config = { label: "API Reference", position: "left", }, + { + type: 'custom-localDocsVersionDropdown', + position: "right", + docsPluginId: "specification", + }, + { + type: 'custom-localDocsVersionDropdown', + position: "right", + docsPluginId: "benchmarks", + }, { href: "https://github.com/input-output-hk/hydra", label: "GitHub", diff --git a/docs/src/components/NavbarItems/LocalDocsVersionDropdown.tsx b/docs/src/components/NavbarItems/LocalDocsVersionDropdown.tsx new file mode 100644 index 00000000000..0efae3d225a --- /dev/null +++ b/docs/src/components/NavbarItems/LocalDocsVersionDropdown.tsx @@ -0,0 +1,104 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ + +import React from 'react'; +import { + useVersions, + useActiveDocContext, +} from '@docusaurus/plugin-content-docs/client'; +import { useDocsPreferredVersion } from '@docusaurus/theme-common'; +import { useDocsVersionCandidates } from '@docusaurus/theme-common/internal'; +import { translate } from '@docusaurus/Translate'; +import { useLocation } from '@docusaurus/router'; +import DefaultNavbarItem from '@theme/NavbarItem/DefaultNavbarItem'; +import DropdownNavbarItem from '@theme/NavbarItem/DropdownNavbarItem'; +import type { Props } from '@theme/NavbarItem/DocsVersionDropdownNavbarItem'; +import type { GlobalVersion } from '@docusaurus/plugin-content-docs/client'; + + +const getVersionMainDoc = (version: GlobalVersion) => + version.docs.find((doc) => doc.id === version.mainDocId)!; + +export default function localDocsVersionDropdown({ + mobile, + docsPluginId, + dropdownActiveClassDisabled, + ...props +}: Props): JSX.Element | null { + + const { search, hash, pathname } = useLocation(); + const activeDocContext = useActiveDocContext(docsPluginId); + const versions = useVersions(docsPluginId); + const { savePreferredVersionName } = useDocsPreferredVersion(docsPluginId); + + if (!pathname.includes(`/${docsPluginId}`)) { + // We only render the version if the path matches the docsPluginId + // Yes, this is a very dirty hack :( + return null; + } + + const versionLinks = versions.map((version) => { + // We try to link to the same doc, in another version + // When not possible, fallback to the "main doc" of the version + const versionDoc = + activeDocContext.alternateDocVersions[version.name] ?? + getVersionMainDoc(version); + return { + label: version.label, + // preserve ?search#hash suffix on version switches + to: `${versionDoc.path}${search}${hash}`, + isActive: () => version === activeDocContext.activeVersion, + onClick: () => savePreferredVersionName(version.name), + }; + }); + const items = [ + ...versionLinks, + ]; + + const dropdownVersion = useDocsVersionCandidates(docsPluginId)[0]; + + // Mobile dropdown is handled a bit differently + const dropdownLabel = + mobile && items.length > 1 + ? translate({ + id: 'theme.navbar.mobileVersionsDropdown.label', + message: 'Versions', + description: + 'The label for the navbar versions dropdown on mobile view', + }) + : dropdownVersion.label; + const dropdownTo = + mobile && items.length > 1 + ? undefined + : getVersionMainDoc(dropdownVersion).path; + + // We don't want to render a version dropdown with 0 or 1 item. If we build + // the site with a single docs version (onlyIncludeVersions: ['1.0.0']), + // We'd rather render a button instead of a dropdown + if (items.length <= 1) { + return ( + false : undefined} + /> + ); + } + + return ( + false : undefined} + /> + ); +} \ No newline at end of file diff --git a/docs/src/theme/NavbarItem/ComponentTypes.js b/docs/src/theme/NavbarItem/ComponentTypes.js new file mode 100644 index 00000000000..9f872609109 --- /dev/null +++ b/docs/src/theme/NavbarItem/ComponentTypes.js @@ -0,0 +1,7 @@ +import ComponentTypes from '@theme-original/NavbarItem/ComponentTypes'; +import LocalDocsVersionDropdown from '@site/src/components/NavbarItems/LocalDocsVersionDropdown'; + +export default { + ...ComponentTypes, + 'custom-localDocsVersionDropdown': LocalDocsVersionDropdown, +};