-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix: text in doc version banner (#105)
Uses `see the Current version` text over `latest version` to refer to Fluvio Stable. <img width="1512" alt="Screenshot 2024-07-18 at 7 37 00 PM" src="https://github.com/user-attachments/assets/79a7bf44-d27b-4288-88bf-a8f0d40711c7">
- Loading branch information
1 parent
ff7c7df
commit 3259959
Showing
1 changed file
with
171 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,171 @@ | ||
import React, {type ComponentType} from 'react'; | ||
import clsx from 'clsx'; | ||
import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; | ||
import Link from '@docusaurus/Link'; | ||
import Translate from '@docusaurus/Translate'; | ||
import { | ||
useActivePlugin, | ||
useDocVersionSuggestions, | ||
type GlobalVersion, | ||
} from '@docusaurus/plugin-content-docs/client'; | ||
import {ThemeClassNames} from '@docusaurus/theme-common'; | ||
import { | ||
useDocsPreferredVersion, | ||
useDocsVersion, | ||
} from '@docusaurus/theme-common/internal'; | ||
import type {Props} from '@theme/DocVersionBanner'; | ||
import type { | ||
VersionBanner, | ||
PropVersionMetadata, | ||
} from '@docusaurus/plugin-content-docs'; | ||
|
||
type BannerLabelComponentProps = { | ||
siteTitle: string; | ||
versionMetadata: PropVersionMetadata; | ||
}; | ||
|
||
function UnreleasedVersionLabel({ | ||
siteTitle, | ||
versionMetadata, | ||
}: BannerLabelComponentProps) { | ||
return ( | ||
<Translate | ||
id="theme.docs.versions.unreleasedVersionLabel" | ||
description="The label used to tell the user that he's browsing an unreleased doc version" | ||
values={{ | ||
siteTitle, | ||
versionLabel: <b>{versionMetadata.label}</b>, | ||
}}> | ||
{ | ||
'This is unreleased documentation for {siteTitle} {versionLabel} version.' | ||
} | ||
</Translate> | ||
); | ||
} | ||
|
||
function UnmaintainedVersionLabel({ | ||
siteTitle, | ||
versionMetadata, | ||
}: BannerLabelComponentProps) { | ||
return ( | ||
<Translate | ||
id="theme.docs.versions.unmaintainedVersionLabel" | ||
description="The label used to tell the user that he's browsing an unmaintained doc version" | ||
values={{ | ||
siteTitle, | ||
versionLabel: <b>{versionMetadata.label}</b>, | ||
}}> | ||
{ | ||
'This is documentation for {siteTitle} {versionLabel}, which is no longer actively maintained.' | ||
} | ||
</Translate> | ||
); | ||
} | ||
|
||
const BannerLabelComponents: { | ||
[banner in VersionBanner]: ComponentType<BannerLabelComponentProps>; | ||
} = { | ||
unreleased: UnreleasedVersionLabel, | ||
unmaintained: UnmaintainedVersionLabel, | ||
}; | ||
|
||
function BannerLabel(props: BannerLabelComponentProps) { | ||
const BannerLabelComponent = | ||
BannerLabelComponents[props.versionMetadata.banner!]; | ||
return <BannerLabelComponent {...props} />; | ||
} | ||
|
||
function LatestVersionSuggestionLabel({ | ||
versionLabel, | ||
to, | ||
onClick, | ||
}: { | ||
to: string; | ||
onClick: () => void; | ||
versionLabel: string; | ||
}) { | ||
return ( | ||
<Translate | ||
id="theme.docs.versions.latestVersionSuggestionLabel" | ||
description="The label used to tell the user to check the latest version" | ||
values={{ | ||
versionLabel, | ||
latestVersionLink: ( | ||
<b> | ||
<Link to={to} onClick={onClick}> | ||
<Translate | ||
id="theme.docs.versions.latestVersionLinkLabel" | ||
description="The label used for the latest version suggestion link label"> | ||
see the Current version | ||
</Translate> | ||
</Link> | ||
</b> | ||
), | ||
}}> | ||
{ | ||
'For up-to-date documentation, see the {latestVersionLink} ({versionLabel}).' | ||
} | ||
</Translate> | ||
); | ||
} | ||
|
||
function DocVersionBannerEnabled({ | ||
className, | ||
versionMetadata, | ||
}: Props & { | ||
versionMetadata: PropVersionMetadata; | ||
}): JSX.Element { | ||
const { | ||
siteConfig: {title: siteTitle}, | ||
} = useDocusaurusContext(); | ||
const {pluginId} = useActivePlugin({failfast: true})!; | ||
|
||
const getVersionMainDoc = (version: GlobalVersion) => | ||
version.docs.find((doc) => doc.id === version.mainDocId)!; | ||
|
||
const {savePreferredVersionName} = useDocsPreferredVersion(pluginId); | ||
|
||
const {latestDocSuggestion, latestVersionSuggestion} = | ||
useDocVersionSuggestions(pluginId); | ||
|
||
// Try to link to same doc in latest version (not always possible), falling | ||
// back to main doc of latest version | ||
const latestVersionSuggestedDoc = | ||
latestDocSuggestion ?? getVersionMainDoc(latestVersionSuggestion); | ||
|
||
return ( | ||
<div | ||
className={clsx( | ||
className, | ||
ThemeClassNames.docs.docVersionBanner, | ||
'alert alert--warning margin-bottom--md', | ||
)} | ||
role="alert"> | ||
<div> | ||
<BannerLabel siteTitle={siteTitle} versionMetadata={versionMetadata} /> | ||
</div> | ||
<div className="margin-top--md"> | ||
<LatestVersionSuggestionLabel | ||
versionLabel={latestVersionSuggestion.label} | ||
to={latestVersionSuggestedDoc.path} | ||
onClick={() => savePreferredVersionName(latestVersionSuggestion.name)} | ||
/> | ||
</div> | ||
</div> | ||
); | ||
} | ||
|
||
export default function DocVersionBanner({ | ||
className, | ||
}: Props): JSX.Element | null { | ||
const versionMetadata = useDocsVersion(); | ||
if (versionMetadata.banner) { | ||
return ( | ||
<DocVersionBannerEnabled | ||
className={className} | ||
versionMetadata={versionMetadata} | ||
/> | ||
); | ||
} | ||
return null; | ||
} |