diff --git a/docusaurus.config.js b/docusaurus.config.js index e34bc5d975285..29efda6827562 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -234,8 +234,8 @@ const config = { path: 'community', routeBasePath: '/community', sidebarPath: require.resolve('./sidebarsCommunity.json'), - // Community docs are unversioned; the footer always shows their - // last-updated date (see src/theme/DocItem/Footer). + // Community docs are unversioned; the document header always shows their + // last-updated date (see src/theme/DocItem/Layout). showLastUpdateTime: true, }), ], @@ -348,7 +348,7 @@ const config = { // }, showLastUpdateAuthor: false, // Date comes from the injected `last_update` front matter - // (markdown.parseFrontMatter). The DocItem footer limits + // (markdown.parseFrontMatter). The DocItem layout limits // which versions actually display it (Dev + latest stable). showLastUpdateTime: true, remarkPlugins: [markdownBoldPlugin, require('remark-math')], diff --git a/src/theme/DocItem/Footer/index.tsx b/src/theme/DocItem/Footer/index.tsx index 07328305c81d1..3c5fe0a48d169 100644 --- a/src/theme/DocItem/Footer/index.tsx +++ b/src/theme/DocItem/Footer/index.tsx @@ -1,28 +1,17 @@ import React from 'react'; import clsx from 'clsx'; import {ThemeClassNames} from '@docusaurus/theme-common'; -import {useDoc, useDocsVersion} from '@docusaurus/plugin-content-docs/client'; +import {useDoc} from '@docusaurus/plugin-content-docs/client'; import TagsListInline from '@theme/TagsListInline'; import EditMetaRow from '@theme/EditMetaRow'; export default function DocItemFooter(): JSX.Element | null { const {metadata} = useDoc(); - const {editUrl, lastUpdatedAt, lastUpdatedBy, tags} = metadata; - const {pluginId, version, isLast} = useDocsVersion(); - - // Only surface "last updated" on the Dev and latest-stable (4.x) docs, plus - // the community docs. Older versions (2.1, 3.x) would show stale dates, so we - // hide the row there — the timestamp data exists for them, we just don't show - // it. Kept in sync with which plugins enable showLastUpdateTime in the config. - const showLastUpdate = - pluginId === 'community' || - (pluginId === 'default' && (version === 'current' || isLast)); - const shownLastUpdatedAt = showLastUpdate ? lastUpdatedAt : undefined; - const shownLastUpdatedBy = showLastUpdate ? lastUpdatedBy : undefined; + const {editUrl, tags} = metadata; const canDisplayTagsRow = tags.length > 0; - const canDisplayEditMetaRow = !!(editUrl || shownLastUpdatedAt || shownLastUpdatedBy); + const canDisplayEditMetaRow = !!editUrl; const canDisplayFooter = canDisplayTagsRow || canDisplayEditMetaRow; @@ -51,8 +40,6 @@ export default function DocItemFooter(): JSX.Element | null { ThemeClassNames.docs.docFooterEditMetaRow, )} editUrl={editUrl} - lastUpdatedAt={shownLastUpdatedAt} - lastUpdatedBy={shownLastUpdatedBy} /> )} diff --git a/src/theme/DocItem/Layout/index.tsx b/src/theme/DocItem/Layout/index.tsx index 3a5d033c10db6..cd39966fb95be 100644 --- a/src/theme/DocItem/Layout/index.tsx +++ b/src/theme/DocItem/Layout/index.tsx @@ -1,7 +1,7 @@ import React, { useState, useEffect } from 'react'; import clsx from 'clsx'; import { useWindowSize } from '@docusaurus/theme-common'; -import { useDoc } from '@docusaurus/plugin-content-docs/client'; +import { useDoc, useDocsVersion } from '@docusaurus/plugin-content-docs/client'; import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; import DocItemPaginator from '@theme/DocItem/Paginator'; import Link from '@docusaurus/Link'; @@ -14,6 +14,7 @@ import DocItemTOCDesktop from '@theme/DocItem/TOC/Desktop'; import DocItemContent from '@theme/DocItem/Content'; import DocBreadcrumbs from '@theme/DocBreadcrumbs'; import ContentVisibility from '@theme/ContentVisibility'; +import LastUpdated from '@theme/LastUpdated'; import type { Props } from '@theme/DocItem/Layout'; import { DocsEdit } from '../../../components/Icons/docs-edit'; import MobileSidebarDrawer from './MobileSidebarDrawer'; @@ -51,12 +52,21 @@ function useDocTOC() { export default function DocItemLayout({ children }: Props): JSX.Element { const docTOC = useDocTOC(); const { metadata } = useDoc(); + const { pluginId, version, isLast } = useDocsVersion(); const { i18n: { currentLocale }, } = useDocusaurusContext(); const [isNew, setIsNew] = useState(true); const isZH = currentLocale === 'zh-CN'; + // Older versioned docs keep their timestamp metadata for indexing, but only + // Dev, the latest stable version, and community docs display it. + const showLastUpdate = + pluginId === 'community' || + (pluginId === 'default' && (version === 'current' || isLast)); + const canDisplayLastUpdate = + showLastUpdate && (metadata.lastUpdatedAt || metadata.lastUpdatedBy); + useEffect(() => { if (typeof window !== 'undefined') { setIsNew(location.pathname.includes('what-is-new')); @@ -75,6 +85,14 @@ export default function DocItemLayout({ children }: Props): JSX.Element { {/* */} {docTOC.mobile} + {canDisplayLastUpdate && ( +
+ +
+ )} {children} diff --git a/src/theme/DocItem/Layout/styles.module.css b/src/theme/DocItem/Layout/styles.module.css index a31feeaf8ef32..e4b1d8fe26772 100644 --- a/src/theme/DocItem/Layout/styles.module.css +++ b/src/theme/DocItem/Layout/styles.module.css @@ -3,6 +3,12 @@ margin-top: 0; } +.lastUpdated { + margin-bottom: 1rem; + font-size: smaller; + font-style: italic; +} + @media (min-width: 997px) { .docItemCol { max-width: 75% !important;