From 86bb828e178eef56c0d1f63f212739bad320c323 Mon Sep 17 00:00:00 2001 From: Qi Zhang Date: Wed, 25 Sep 2024 20:43:32 +0800 Subject: [PATCH 1/3] feat: upgrade to 2.4.3 Signed-off-by: Qi Zhang --- package.json | 10 +- src/components/Helm/Ack.js | 2 +- src/components/Helm/Cce.js | 2 +- src/components/Helm/Helm.js | 2 +- src/components/Helm/Tke.js | 2 +- src/components/NavBar/index.js | 2 +- src/pages/ack/index.js | 2 +- src/pages/cce/index.js | 2 +- src/pages/enterprise_server/index.js | 2 +- src/pages/helm/index.js | 2 +- src/pages/index.tsx | 2 +- src/pages/tke/index.js | 2 +- src/theme/BlogArchivePage/index.tsx | 92 - src/theme/BlogLayout/index.tsx | 50 - src/theme/BlogLayout/styles.module.css | 10 - src/theme/BlogListPage/index.tsx | 91 - src/theme/BlogListPaginator/index.tsx | 52 - src/theme/BlogPostAuthor/index.tsx | 50 - src/theme/BlogPostAuthors/index.tsx | 49 - src/theme/BlogPostAuthors/styles.module.css | 21 - src/theme/BlogPostItem/index.tsx | 205 - src/theme/BlogPostItem/styles.module.css | 46 - src/theme/BlogPostPage/index.tsx | 104 - src/theme/BlogPostPaginator/index.tsx | 51 - src/theme/BlogSidebar/index.tsx | 49 - src/theme/BlogSidebar/styles.module.css | 46 - src/theme/BlogTagsListPage/index.tsx | 38 - src/theme/BlogTagsPostsPage/index.tsx | 94 - src/theme/Footer/LinkItem/index.tsx | 2 +- src/theme/Footer/Links/MultiColumn/index.tsx | 4 +- src/theme/Footer/Links/Simple/index.tsx | 2 +- src/theme/Footer/Links/index.tsx | 2 +- src/theme/Footer/Logo/index.tsx | 13 +- src/theme/Layout/Provider/index.tsx | 31 + src/theme/Layout/index.tsx | 40 +- .../Layout/{styles.css => styles.module.css} | 17 +- src/theme/Navbar/ColorModeToggle/index.tsx | 7 +- .../ColorModeToggle}/styles.module.css | 5 +- src/theme/Navbar/Content/index.tsx | 32 +- src/theme/Navbar/Layout/index.tsx | 14 +- .../Navbar/MobileSidebar/Header/index.tsx | 10 +- .../Navbar/MobileSidebar/Layout/index.tsx | 2 +- .../MobileSidebar/PrimaryMenu/index.tsx | 6 +- .../MobileSidebar/SecondaryMenu/index.tsx | 3 +- .../Navbar/MobileSidebar/Toggle/index.tsx | 21 +- src/theme/Navbar/MobileSidebar/index.tsx | 6 +- src/theme/Navbar/Search/index.tsx | 8 +- src/theme/NavbarItem/ComponentTypes.tsx | 32 - src/theme/NavbarItem/DefaultNavbarItem.tsx | 68 - src/theme/NavbarItem/DocNavbarItem.tsx | 48 - src/theme/NavbarItem/DocSidebarNavbarItem.tsx | 44 - .../DocsVersionDropdownNavbarItem.tsx | 99 - .../NavbarItem/DocsVersionNavbarItem.tsx | 27 - src/theme/NavbarItem/DropdownNavbarItem.tsx | 193 - src/theme/NavbarItem/HtmlNavbarItem.tsx | 32 - .../LocaleDropdownNavbarItem/index.tsx | 69 - src/theme/NavbarItem/NavbarNavLink.tsx | 80 - src/theme/NavbarItem/SearchNavbarItem.tsx | 23 - src/theme/NavbarItem/index.tsx | 38 - src/theme/NavbarItem/utils.ts | 13 - src/theme/SearchMetadata/index.tsx | 43 - yarn.lock | 3904 ++++++++++------- 62 files changed, 2461 insertions(+), 3557 deletions(-) delete mode 100644 src/theme/BlogArchivePage/index.tsx delete mode 100644 src/theme/BlogLayout/index.tsx delete mode 100644 src/theme/BlogLayout/styles.module.css delete mode 100644 src/theme/BlogListPage/index.tsx delete mode 100644 src/theme/BlogListPaginator/index.tsx delete mode 100644 src/theme/BlogPostAuthor/index.tsx delete mode 100644 src/theme/BlogPostAuthors/index.tsx delete mode 100644 src/theme/BlogPostAuthors/styles.module.css delete mode 100644 src/theme/BlogPostItem/index.tsx delete mode 100644 src/theme/BlogPostItem/styles.module.css delete mode 100644 src/theme/BlogPostPage/index.tsx delete mode 100644 src/theme/BlogPostPaginator/index.tsx delete mode 100644 src/theme/BlogSidebar/index.tsx delete mode 100644 src/theme/BlogSidebar/styles.module.css delete mode 100644 src/theme/BlogTagsListPage/index.tsx delete mode 100644 src/theme/BlogTagsPostsPage/index.tsx create mode 100644 src/theme/Layout/Provider/index.tsx rename src/theme/Layout/{styles.css => styles.module.css} (68%) rename src/theme/{NavbarItem/LocaleDropdownNavbarItem => Navbar/ColorModeToggle}/styles.module.css (71%) delete mode 100644 src/theme/NavbarItem/ComponentTypes.tsx delete mode 100644 src/theme/NavbarItem/DefaultNavbarItem.tsx delete mode 100644 src/theme/NavbarItem/DocNavbarItem.tsx delete mode 100644 src/theme/NavbarItem/DocSidebarNavbarItem.tsx delete mode 100644 src/theme/NavbarItem/DocsVersionDropdownNavbarItem.tsx delete mode 100644 src/theme/NavbarItem/DocsVersionNavbarItem.tsx delete mode 100644 src/theme/NavbarItem/DropdownNavbarItem.tsx delete mode 100644 src/theme/NavbarItem/HtmlNavbarItem.tsx delete mode 100644 src/theme/NavbarItem/LocaleDropdownNavbarItem/index.tsx delete mode 100644 src/theme/NavbarItem/NavbarNavLink.tsx delete mode 100644 src/theme/NavbarItem/SearchNavbarItem.tsx delete mode 100644 src/theme/NavbarItem/index.tsx delete mode 100644 src/theme/NavbarItem/utils.ts delete mode 100644 src/theme/SearchMetadata/index.tsx diff --git a/package.json b/package.json index 89e708d7b6..e860b7a0f8 100644 --- a/package.json +++ b/package.json @@ -16,10 +16,10 @@ }, "dependencies": { "@crowdin/cli": "3", - "@docusaurus/core": "^2.0.0-beta.20", - "@docusaurus/plugin-client-redirects": "^2.0.0-beta.20", - "@docusaurus/plugin-ideal-image": "2.0.0-beta.20", - "@docusaurus/preset-classic": "^2.0.0-beta.20", + "@docusaurus/core": "^2.4.3", + "@docusaurus/plugin-client-redirects": "^2.4.3", + "@docusaurus/plugin-ideal-image": "2.4.3", + "@docusaurus/preset-classic": "^2.4.3", "@douyinfe/semi-ui": "^2.15.0", "@mdx-js/react": "^1.6.21", "animate.css": "^4.1.1", @@ -64,7 +64,7 @@ ] }, "devDependencies": { - "@docusaurus/module-type-aliases": "^2.0.0-beta.20", + "@docusaurus/module-type-aliases": "^2.4.3", "@tsconfig/docusaurus": "^1.0.5", "typescript": "^4.6.3" } diff --git a/src/components/Helm/Ack.js b/src/components/Helm/Ack.js index 4dee2ede44..c277589c31 100644 --- a/src/components/Helm/Ack.js +++ b/src/components/Helm/Ack.js @@ -1,6 +1,6 @@ import { Button, Form, Input, Radio, Space, Icon, Alert, Tag } from 'antd' import { PlusCircleOutlined, CopyOutlined, QuestionCircleOutlined } from '@ant-design/icons' -import LayoutProviders from '@theme/LayoutProviders'; +import LayoutProviders from '@theme/Layout/Provider'; import React, { Component } from 'react'; import Swal from 'sweetalert2' import axios from 'axios' diff --git a/src/components/Helm/Cce.js b/src/components/Helm/Cce.js index a0607d251b..b046611f2a 100644 --- a/src/components/Helm/Cce.js +++ b/src/components/Helm/Cce.js @@ -1,6 +1,6 @@ import { Button, Form, Input, Radio, Space, Icon, Alert, Tag } from 'antd' import { PlusCircleOutlined, CopyOutlined, QuestionCircleOutlined } from '@ant-design/icons' -import LayoutProviders from '@theme/LayoutProviders'; +import LayoutProviders from '@theme/Layout/Provider'; import React, { Component } from 'react'; import Swal from 'sweetalert2' import axios from 'axios' diff --git a/src/components/Helm/Helm.js b/src/components/Helm/Helm.js index 31be71fc3e..d5e49111db 100644 --- a/src/components/Helm/Helm.js +++ b/src/components/Helm/Helm.js @@ -1,6 +1,6 @@ import { Button, Form, Input, Radio, Space, Icon, Alert, Tag } from 'antd' import { PlusCircleOutlined, CopyOutlined, QuestionCircleOutlined } from '@ant-design/icons' -import LayoutProviders from '@theme/LayoutProviders'; +import LayoutProviders from '@theme/Layout/Provider'; import React, { Component } from 'react'; import Swal from 'sweetalert2' import axios from 'axios' diff --git a/src/components/Helm/Tke.js b/src/components/Helm/Tke.js index 31c8e8eedb..2a4a95bbc1 100644 --- a/src/components/Helm/Tke.js +++ b/src/components/Helm/Tke.js @@ -1,6 +1,6 @@ import { Button, Form, Input, Radio, Space, Icon, Alert, Tag } from 'antd' import { PlusCircleOutlined, CopyOutlined, QuestionCircleOutlined } from '@ant-design/icons' -import LayoutProviders from '@theme/LayoutProviders'; +import LayoutProviders from '@theme/Layout/Provider'; import React, { Component } from 'react'; import Swal from 'sweetalert2' import axios from 'axios' diff --git a/src/components/NavBar/index.js b/src/components/NavBar/index.js index efb2104300..aa38c68d3a 100644 --- a/src/components/NavBar/index.js +++ b/src/components/NavBar/index.js @@ -2,7 +2,7 @@ import Translate from '@docusaurus/Translate'; import React, { useEffect, useState } from 'react'; import styles from './index.module.scss'; import NavbarColorModeToggle from '@theme/Navbar/ColorModeToggle'; -import LocaleDropdownNavbarItem from '@site/src/theme/NavbarItem/LocaleDropdownNavbarItem'; +import LocaleDropdownNavbarItem from '@theme/NavbarItem/LocaleDropdownNavbarItem'; import Link from '@docusaurus/Link'; import clsx from 'clsx'; import AnnouncementBar from '@theme/AnnouncementBar'; diff --git a/src/pages/ack/index.js b/src/pages/ack/index.js index 6ac26f7b4e..d56e6abb5d 100644 --- a/src/pages/ack/index.js +++ b/src/pages/ack/index.js @@ -1,5 +1,5 @@ import React, { Component } from 'react' -import LayoutProviders from '@theme/LayoutProviders'; +import LayoutProviders from '@theme/Layout/Provider'; import NavBar from '@theme/Navbar'; import Acks from '../../components/Helm/Ack'; import styles from '../index.module.scss'; diff --git a/src/pages/cce/index.js b/src/pages/cce/index.js index fd19bd00e6..2f41f6866f 100644 --- a/src/pages/cce/index.js +++ b/src/pages/cce/index.js @@ -1,5 +1,5 @@ import React, { Component } from 'react' -import LayoutProviders from '@theme/LayoutProviders'; +import LayoutProviders from '@theme/Layout/Provider'; import NavBar from '@theme/Navbar'; import Cces from '../../components/Helm/Cce'; import styles from '../index.module.scss'; diff --git a/src/pages/enterprise_server/index.js b/src/pages/enterprise_server/index.js index 2e76b030cd..a230fc50b7 100644 --- a/src/pages/enterprise_server/index.js +++ b/src/pages/enterprise_server/index.js @@ -1,7 +1,7 @@ import React from 'react'; import NavBar from '../../components/NavBar'; import styles from './index.module.scss'; -import LayoutProviders from '@theme/LayoutProviders'; +import LayoutProviders from '@theme/Layout/Provider'; import Footer from '@theme/Footer'; export default function Index() { diff --git a/src/pages/helm/index.js b/src/pages/helm/index.js index 7399f300e6..48fb1cd5dd 100644 --- a/src/pages/helm/index.js +++ b/src/pages/helm/index.js @@ -1,5 +1,5 @@ import React, { Component } from 'react' -import LayoutProviders from '@theme/LayoutProviders'; +import LayoutProviders from '@theme/Layout/Provider'; import NavBar from '@theme/Navbar'; import Helms from '../../components/Helm/Helm'; import styles from '../index.module.scss'; diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 5f00a52e73..0409cd4fd1 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,6 +1,6 @@ import Head from '@docusaurus/Head'; import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; -import LayoutProviders from '@theme/LayoutProviders'; +import LayoutProviders from '@theme/Layout/Provider'; import React from 'react'; import NavBar from '../components/NavBar'; import styles from './index.module.scss'; diff --git a/src/pages/tke/index.js b/src/pages/tke/index.js index 4223fa6a7e..48899ed339 100644 --- a/src/pages/tke/index.js +++ b/src/pages/tke/index.js @@ -1,5 +1,5 @@ import React, { Component } from 'react' -import LayoutProviders from '@theme/LayoutProviders'; +import LayoutProviders from '@theme/Layout/Provider'; import NavBar from '@theme/Navbar'; import Tkes from '../../components/Helm/Tke'; import styles from '../index.module.scss'; diff --git a/src/theme/BlogArchivePage/index.tsx b/src/theme/BlogArchivePage/index.tsx deleted file mode 100644 index a05afdf43f..0000000000 --- a/src/theme/BlogArchivePage/index.tsx +++ /dev/null @@ -1,92 +0,0 @@ -/** - * 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 Layout from '@theme/Layout'; -import Link from '@docusaurus/Link'; -import type {ArchiveBlogPost, Props} from '@theme/BlogArchivePage'; -import {translate} from '@docusaurus/Translate'; -import {PageMetadata} from '@docusaurus/theme-common'; - -type YearProp = { - year: string; - posts: ArchiveBlogPost[]; -}; - -function Year({year, posts}: YearProp) { - return ( - <> -

{year}

- - - ); -} - -function YearsSection({years}: {years: YearProp[]}) { - return ( -
-
-
- {years.map((_props, idx) => ( -
- -
- ))} -
-
-
- ); -} - -function listPostsByYears(blogPosts: readonly ArchiveBlogPost[]): YearProp[] { - const postsByYear = blogPosts.reduceRight((posts, post) => { - const year = post.metadata.date.split('-')[0]!; - const yearPosts = posts.get(year) ?? []; - return posts.set(year, [post, ...yearPosts]); - }, new Map()); - - return Array.from(postsByYear, ([year, posts]) => ({ - year, - posts, - })); -} - -export default function BlogArchive({archive}: Props): JSX.Element { - const title = translate({ - id: 'theme.blog.archive.title', - message: 'Archive', - description: 'The page & hero title of the blog archive page', - }); - const description = translate({ - id: 'theme.blog.archive.description', - message: 'Archive', - description: 'The page & hero description of the blog archive page', - }); - const years = listPostsByYears(archive.blogPosts); - return ( - <> - - -
-
-

{title}

-

{description}

-
-
-
{years.length > 0 && }
- - - ); -} diff --git a/src/theme/BlogLayout/index.tsx b/src/theme/BlogLayout/index.tsx deleted file mode 100644 index 97d73a1d27..0000000000 --- a/src/theme/BlogLayout/index.tsx +++ /dev/null @@ -1,50 +0,0 @@ -/** - * 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 type { Props } from '@theme/BlogLayout'; -import BlogSidebar from '@theme/BlogSidebar'; -import Layout from '@theme/Layout'; -import clsx from 'clsx'; -import React, { useEffect } from 'react'; -import styles from './styles.module.css'; -import { useLocation } from 'react-router-dom' -import Link from '@docusaurus/Link'; - -export default function BlogLayout(props: Props): JSX.Element { - const { sidebar, toc, children, ...layoutProps} = props; - - return ( - -
-
- {/* {hasSidebar && title === '所有文章' && ( - - )} */} -
- {children} -
- {toc && -
-

- - 博客首页 - -

-

目录

- {toc} -
} -
-
- - ); -} diff --git a/src/theme/BlogLayout/styles.module.css b/src/theme/BlogLayout/styles.module.css deleted file mode 100644 index fc8c8ead20..0000000000 --- a/src/theme/BlogLayout/styles.module.css +++ /dev/null @@ -1,10 +0,0 @@ -/** - * 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. - */ - -.link { - color: #101827; -} \ No newline at end of file diff --git a/src/theme/BlogListPage/index.tsx b/src/theme/BlogListPage/index.tsx deleted file mode 100644 index fb40dcd0c0..0000000000 --- a/src/theme/BlogListPage/index.tsx +++ /dev/null @@ -1,91 +0,0 @@ -/** - * 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 useDocusaurusContext from '@docusaurus/useDocusaurusContext'; -import BlogLayout from '@theme/BlogLayout'; -import BlogPostItem from '@theme/BlogPostItem'; -import BlogListPaginator from '@theme/BlogListPaginator'; -import type {Props} from '@theme/BlogListPage'; -import { - PageMetadata, - HtmlClassNameProvider, - ThemeClassNames, -} from '@docusaurus/theme-common'; -import SearchMetadata from '@theme/SearchMetadata'; -import clsx from 'clsx'; -import Layout from '@theme/Layout'; -import { FeatureHeader } from '@site/src/components/FeatureList'; - -function BlogListPageMetadata(props: Props): JSX.Element { - const {metadata} = props; - const { - siteConfig: {title: siteTitle}, - } = useDocusaurusContext(); - const {blogDescription, blogTitle, permalink} = metadata; - const isBlogOnlyMode = permalink === '/'; - const title = isBlogOnlyMode ? siteTitle : blogTitle; - return ( - <> - - - - ); -} - -function BlogListPageContent(props: Props): JSX.Element { - const {metadata, items, sidebar} = props; - - const Header = { - title: "博客", - description: "分享 Rainbond 产品最新的动态信息，以及关于云原生相关的技术文章与最佳实践。" - }; - - return ( - - -
-
-
-

所有文章

-
-
-
- {items.map(({content: BlogPostContent}) => ( - - - - ))} -
-
-
- -
-
-
- - ); -} - -export default function BlogListPage(props: Props): JSX.Element { - return ( - - - - - ); -} diff --git a/src/theme/BlogListPaginator/index.tsx b/src/theme/BlogListPaginator/index.tsx deleted file mode 100644 index ff4dda6b4b..0000000000 --- a/src/theme/BlogListPaginator/index.tsx +++ /dev/null @@ -1,52 +0,0 @@ -/** - * 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 Translate, {translate} from '@docusaurus/Translate'; -import PaginatorNavLink from '@theme/PaginatorNavLink'; -import type {Props} from '@theme/BlogListPaginator'; - -export default function BlogListPaginator(props: Props): JSX.Element { - const {metadata} = props; - const {previousPage, nextPage} = metadata; - - return ( - - ); -} diff --git a/src/theme/BlogPostAuthor/index.tsx b/src/theme/BlogPostAuthor/index.tsx deleted file mode 100644 index 8dce39bd3e..0000000000 --- a/src/theme/BlogPostAuthor/index.tsx +++ /dev/null @@ -1,50 +0,0 @@ -/** - * 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 Link, {type Props as LinkProps} from '@docusaurus/Link'; -import type {Props} from '@theme/BlogPostAuthor'; - -function MaybeLink(props: LinkProps): JSX.Element { - if (props.href) { - return ; - } - return <>{props.children}; -} - -export default function BlogPostAuthor({author}: Props): JSX.Element { - const {name, title, url, imageURL, email} = author; - const link = url || (email && `mailto:${email}`) || undefined; - return ( -
- {imageURL && ( - - {name} - - )} - - {name && ( - - )} -
- ); -} diff --git a/src/theme/BlogPostAuthors/index.tsx b/src/theme/BlogPostAuthors/index.tsx deleted file mode 100644 index 4e36a71425..0000000000 --- a/src/theme/BlogPostAuthors/index.tsx +++ /dev/null @@ -1,49 +0,0 @@ -/** - * 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 clsx from 'clsx'; -import type {Props} from '@theme/BlogPostAuthors'; -import BlogPostAuthor from '@theme/BlogPostAuthor'; - -import styles from './styles.module.css'; - -// Component responsible for the authors layout -export default function BlogPostAuthors({ - authors, - assets, -}: Props): JSX.Element | null { - const authorsCount = authors.length; - if (authorsCount === 0) { - return null; - } - const imageOnly = authors.every(({name}) => !name); - return ( -
- {authors.map((author, idx) => ( -
- -
- ))} -
- ); -} diff --git a/src/theme/BlogPostAuthors/styles.module.css b/src/theme/BlogPostAuthors/styles.module.css deleted file mode 100644 index b1bd1106f0..0000000000 --- a/src/theme/BlogPostAuthors/styles.module.css +++ /dev/null @@ -1,21 +0,0 @@ -/** - * 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. - */ - -.authorCol { - max-width: inherit !important; - flex-grow: 1 !important; -} - -.imageOnlyAuthorRow { - display: flex; - flex-flow: row wrap; -} - -.imageOnlyAuthorCol { - margin-left: 0.3rem; - margin-right: 0.3rem; -} diff --git a/src/theme/BlogPostItem/index.tsx b/src/theme/BlogPostItem/index.tsx deleted file mode 100644 index bed17f2b83..0000000000 --- a/src/theme/BlogPostItem/index.tsx +++ /dev/null @@ -1,205 +0,0 @@ -/** - * 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 Link from '@docusaurus/Link'; -import { useLocation } from '@docusaurus/router'; -import { usePluralForm } from '@docusaurus/theme-common'; -import Translate, { translate } from '@docusaurus/Translate'; -import { useBaseUrlUtils } from '@docusaurus/useBaseUrl'; -import { blogPostContainerID } from '@docusaurus/utils-common'; -import { MDXProvider } from '@mdx-js/react'; -import BlogPostAuthors from '@theme/BlogPostAuthors'; -import type { Props } from '@theme/BlogPostItem'; -import EditThisPage from '@theme/EditThisPage'; -import MDXComponents from '@theme/MDXComponents'; -import TagsListInline from '@theme/TagsListInline'; -import clsx from 'clsx'; -import React from 'react'; -// import { useLocation } from 'react-router-dom'; -import styles from './styles.module.css'; -// Very simple pluralization: probably good enough for now -function useReadingTimePlural() { - const { selectMessage } = usePluralForm(); - return (readingTimeFloat: number) => { - const readingTime = Math.ceil(readingTimeFloat); - return selectMessage( - readingTime, - translate( - { - id: 'theme.blog.post.readingTime.plurals', - description: - 'Pluralized label for "{readingTime} min read". Use as much plural forms (separated by "|") as your language support (see https://www.unicode.org/cldr/cldr-aux/charts/34/supplemental/language_plural_rules.html)', - message: 'One min read|{readingTime} min read' - }, - { readingTime } - ) - ); - }; -} - -export default function BlogPostItem(props: Props): JSX.Element { - const readingTimePlural = useReadingTimePlural(); - const { withBaseUrl } = useBaseUrlUtils(); - const { - children, - frontMatter, - assets, - metadata, - truncated, - isBlogPostPage = false - } = props; - const { - date, - formattedDate, - permalink, - tags, - readingTime, - title, - editUrl, - authors, - description - } = metadata; - - const image = assets.image ?? frontMatter.image; - const truncatedPost = !isBlogPostPage && truncated; - const tagsExists = tags.length > 0; - const TitleHeading = isBlogPostPage ? 'h1' : 'h2'; - - if (! isBlogPostPage) { - return ( - <> -
- -
-
- -
-
-

{title}

- - {description} - -
-
-
- - - {typeof readingTime !== 'undefined' && ( - <> - {' · '} - {readingTimePlural(readingTime)} - - )} -
-
-
- -
- - ); - } - return ( -
-
- - {isBlogPostPage ? ( - title - ) : ( - - {title} - - )} - -
- - - {typeof readingTime !== 'undefined' && ( - <> - {' · '} - {readingTimePlural(readingTime)} - - )} -
- -
- - {image && ( - - )} - -
- {children} -
- - {(tagsExists || truncated) && ( -
- {tagsExists && ( -
- -
- )} - - {isBlogPostPage && editUrl && ( -
- -
- )} - - {truncatedPost && ( -
- - {/* - - Read More - - */} - -
- )} -
- )} -
- ); -} diff --git a/src/theme/BlogPostItem/styles.module.css b/src/theme/BlogPostItem/styles.module.css deleted file mode 100644 index 751fd9d4d6..0000000000 --- a/src/theme/BlogPostItem/styles.module.css +++ /dev/null @@ -1,46 +0,0 @@ -/** - * 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. - */ - -.blogPostTitle { - font-size: 3rem; -} - -.blogPostData { - font-size: 0.9rem; -} - -.blogPostDetailsFull { - flex-direction: column; -} - -.col { - margin: 25px 0 25px 0; -} - -.link:hover { - text-decoration: none; - color: #101827; -} - -.link { - color: #101827; -} - -.card { - transition: .3s ease-in-out; -} - -.card:hover { - transform: translateY(-20px); -} - -.image { - height: 175px; - object-fit: contain; - vertical-align: middle; - width: 100%; -} \ No newline at end of file diff --git a/src/theme/BlogPostPage/index.tsx b/src/theme/BlogPostPage/index.tsx deleted file mode 100644 index c7b9ec88e5..0000000000 --- a/src/theme/BlogPostPage/index.tsx +++ /dev/null @@ -1,104 +0,0 @@ -/** - * 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 BlogLayout from '@theme/BlogLayout'; -import BlogPostItem from '@theme/BlogPostItem'; -import BlogPostPaginator from '@theme/BlogPostPaginator'; -import type {Props} from '@theme/BlogPostPage'; -import { - PageMetadata, - HtmlClassNameProvider, - ThemeClassNames, -} from '@docusaurus/theme-common'; -import TOC from '@theme/TOC'; -import clsx from 'clsx'; - -function BlogPostPageMetadata(props: Props): JSX.Element { - const {content: BlogPostContents} = props; - const {assets, metadata} = BlogPostContents; - const {title, description, date, tags, authors, frontMatter} = metadata; - const {keywords} = frontMatter; - const image = assets.image ?? frontMatter.image; - return ( - - - - {/* TODO double check those article meta array syntaxes, see https://ogp.me/#array */} - {authors.some((author) => author.url) && ( - author.url) - .filter(Boolean) - .join(',')} - /> - )} - {tags.length > 0 && ( - tag.label).join(',')} - /> - )} - - ); -} - -function BlogPostPageContent(props: Props): JSX.Element { - const {content: BlogPostContents, sidebar} = props; - const {assets, metadata} = BlogPostContents; - const {nextItem, prevItem, frontMatter} = metadata; - const { - hide_table_of_contents: hideTableOfContents, - toc_min_heading_level: tocMinHeadingLevel, - toc_max_heading_level: tocMaxHeadingLevel, - } = frontMatter; - return ( - 0 ? ( - - ) : undefined - }> - - - - - {(nextItem || prevItem) && ( - - )} - - ); -} - -export default function BlogPostPage(props: Props): JSX.Element { - return ( - - - - - ); -} diff --git a/src/theme/BlogPostPaginator/index.tsx b/src/theme/BlogPostPaginator/index.tsx deleted file mode 100644 index acf93a0081..0000000000 --- a/src/theme/BlogPostPaginator/index.tsx +++ /dev/null @@ -1,51 +0,0 @@ -/** - * 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 Translate, {translate} from '@docusaurus/Translate'; -import PaginatorNavLink from '@theme/PaginatorNavLink'; -import type {Props} from '@theme/BlogPostPaginator'; - -export default function BlogPostPaginator(props: Props): JSX.Element { - const {nextItem, prevItem} = props; - - return ( - - ); -} diff --git a/src/theme/BlogSidebar/index.tsx b/src/theme/BlogSidebar/index.tsx deleted file mode 100644 index 02c5a0e332..0000000000 --- a/src/theme/BlogSidebar/index.tsx +++ /dev/null @@ -1,49 +0,0 @@ -/** - * 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 Link from '@docusaurus/Link'; -import { useLocation } from '@docusaurus/router'; -import { translate } from '@docusaurus/Translate'; -import type { Props } from '@theme/BlogSidebar'; -import clsx from 'clsx'; -import React from 'react'; -import styles from './styles.module.css'; - -export default function BlogSidebar({ sidebar }: Props): JSX.Element | null { - const location_url = useLocation().pathname; - if (! location_url.includes('blog')) { - return null; - } - return ( - - ); -} diff --git a/src/theme/BlogSidebar/styles.module.css b/src/theme/BlogSidebar/styles.module.css deleted file mode 100644 index 3ca0d4b8d5..0000000000 --- a/src/theme/BlogSidebar/styles.module.css +++ /dev/null @@ -1,46 +0,0 @@ -/** - * 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. - */ - -.sidebar { - max-height: calc(100vh - (var(--ifm-navbar-height) + 2rem)); - overflow-y: auto; - position: sticky; - top: calc(var(--ifm-navbar-height) + 2rem); -} - -.sidebarItemTitle { - font-size: var(--ifm-h3-font-size); - font-weight: var(--ifm-font-weight-bold); -} - -.sidebarItemList { - list-style: none; - font-size: 0.9rem; - padding-left: 0; -} - -.sidebarItem { - margin-top: 0.7rem; -} - -.sidebarItemLink { - color: var(--ifm-font-color-base); -} - -.sidebarItemLink:hover { - text-decoration: none; -} - -.sidebarItemLinkActive { - color: var(--ifm-color-primary) !important; -} - -@media (max-width: 996px) { - .sidebar { - display: none; - } -} diff --git a/src/theme/BlogTagsListPage/index.tsx b/src/theme/BlogTagsListPage/index.tsx deleted file mode 100644 index 2f53b6ee41..0000000000 --- a/src/theme/BlogTagsListPage/index.tsx +++ /dev/null @@ -1,38 +0,0 @@ -/** - * 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 BlogLayout from '@theme/BlogLayout'; -import TagsListByLetter from '@theme/TagsListByLetter'; -import type {Props} from '@theme/BlogTagsListPage'; -import { - PageMetadata, - HtmlClassNameProvider, - ThemeClassNames, - translateTagsPageTitle, -} from '@docusaurus/theme-common'; -import SearchMetadata from '../SearchMetadata'; -import clsx from 'clsx'; - -export default function BlogTagsListPage({tags, sidebar}: Props): JSX.Element { - const title = translateTagsPageTitle(); - return ( - - - - -

{title}

- - - - ); -} diff --git a/src/theme/BlogTagsPostsPage/index.tsx b/src/theme/BlogTagsPostsPage/index.tsx deleted file mode 100644 index fddda0795d..0000000000 --- a/src/theme/BlogTagsPostsPage/index.tsx +++ /dev/null @@ -1,94 +0,0 @@ -/** - * 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 Link from '@docusaurus/Link'; -import BlogLayout from '@theme/BlogLayout'; -import BlogPostItem from '@theme/BlogPostItem'; -import type {Props} from '@theme/BlogTagsPostsPage'; -import Translate, {translate} from '@docusaurus/Translate'; -import { - PageMetadata, - HtmlClassNameProvider, - ThemeClassNames, - usePluralForm, -} from '@docusaurus/theme-common'; -import BlogListPaginator from '@theme/BlogListPaginator'; -import SearchMetadata from '@theme/SearchMetadata'; -import clsx from 'clsx'; - -// Very simple pluralization: probably good enough for now -function useBlogPostsPlural() { - const {selectMessage} = usePluralForm(); - return (count: number) => - selectMessage( - count, - translate( - { - id: 'theme.blog.post.plurals', - description: - 'Pluralized label for "{count} posts". Use as much plural forms (separated by "|") as your language support (see https://www.unicode.org/cldr/cldr-aux/charts/34/supplemental/language_plural_rules.html)', - message: 'One post|{count} posts', - }, - {count}, - ), - ); -} - -export default function BlogTagsPostsPage({ - tag, - items, - sidebar, - listMetadata, -}: Props): JSX.Element { - const blogPostsPlural = useBlogPostsPlural(); - const title = translate( - { - id: 'theme.blog.tagTitle', - description: 'The title of the page for a blog tag', - message: '{nPosts} tagged with "{tagName}"', - }, - {nPosts: blogPostsPlural(tag.count), tagName: tag.label}, - ); - - return ( - - - - -
-

{title}

- - - - View All Tags - - -
- - {items.map(({content: BlogPostContent}) => ( - - - - ))} - - - - ); -} diff --git a/src/theme/Footer/LinkItem/index.tsx b/src/theme/Footer/LinkItem/index.tsx index f5e334acef..44e1517d39 100644 --- a/src/theme/Footer/LinkItem/index.tsx +++ b/src/theme/Footer/LinkItem/index.tsx @@ -10,7 +10,7 @@ import React from 'react'; import Link from '@docusaurus/Link'; import useBaseUrl from '@docusaurus/useBaseUrl'; import isInternalUrl from '@docusaurus/isInternalUrl'; -import IconExternalLink from '@theme/IconExternalLink'; +import IconExternalLink from '@theme/Icon/ExternalLink'; import type {Props} from '@theme/Footer/LinkItem'; export default function FooterLinkItem({item}: Props): JSX.Element { diff --git a/src/theme/Footer/Links/MultiColumn/index.tsx b/src/theme/Footer/Links/MultiColumn/index.tsx index a2bad28d86..2239e8c8fb 100644 --- a/src/theme/Footer/Links/MultiColumn/index.tsx +++ b/src/theme/Footer/Links/MultiColumn/index.tsx @@ -6,8 +6,8 @@ */ import React from 'react'; -import type {Props} from '@theme/Footer/Links/MultiColumn'; import LinkItem from '@theme/Footer/LinkItem'; +import type {Props} from '@theme/Footer/Links/MultiColumn'; type ColumnType = Props['columns'][number]; type ColumnItemType = ColumnType['items'][number]; @@ -21,7 +21,7 @@ function ColumnLinkItem({item}: {item: ColumnItemType}) { dangerouslySetInnerHTML={{__html: item.html}} /> ) : ( -
  • +
    • ); diff --git a/src/theme/Footer/Links/Simple/index.tsx b/src/theme/Footer/Links/Simple/index.tsx index 72fcc0a74a..e14b77f1f3 100644 --- a/src/theme/Footer/Links/Simple/index.tsx +++ b/src/theme/Footer/Links/Simple/index.tsx @@ -6,8 +6,8 @@ */ import React from 'react'; -import type {Props} from '@theme/Footer/Links/Simple'; import LinkItem from '@theme/Footer/LinkItem'; +import type {Props} from '@theme/Footer/Links/Simple'; function Separator() { return ·; diff --git a/src/theme/Footer/Links/index.tsx b/src/theme/Footer/Links/index.tsx index 44e553e539..a4b0f3354c 100644 --- a/src/theme/Footer/Links/index.tsx +++ b/src/theme/Footer/Links/index.tsx @@ -8,9 +8,9 @@ import React from 'react'; import {isMultiColumnFooterLinks} from '@docusaurus/theme-common'; -import type {Props} from '@theme/Footer/Links'; import FooterLinksMultiColumn from '@theme/Footer/Links/MultiColumn'; import FooterLinksSimple from '@theme/Footer/Links/Simple'; +import type {Props} from '@theme/Footer/Links'; export default function FooterLinks({links}: Props): JSX.Element { return isMultiColumnFooterLinks(links) ? ( diff --git a/src/theme/Footer/Logo/index.tsx b/src/theme/Footer/Logo/index.tsx index f566555a17..ebd8e9fa32 100644 --- a/src/theme/Footer/Logo/index.tsx +++ b/src/theme/Footer/Logo/index.tsx @@ -6,13 +6,14 @@ */ import React from 'react'; - +import clsx from 'clsx'; import Link from '@docusaurus/Link'; import {useBaseUrlUtils} from '@docusaurus/useBaseUrl'; -import styles from './styles.module.css'; import ThemedImage from '@theme/ThemedImage'; import type {Props} from '@theme/Footer/Logo'; +import styles from './styles.module.css'; + function LogoImage({logo}: Props) { const {withBaseUrl} = useBaseUrlUtils(); const sources = { @@ -21,18 +22,22 @@ function LogoImage({logo}: Props) { }; return ( ); } export default function FooterLogo({logo}: Props): JSX.Element { return logo.href ? ( - + ) : ( diff --git a/src/theme/Layout/Provider/index.tsx b/src/theme/Layout/Provider/index.tsx new file mode 100644 index 0000000000..6902505547 --- /dev/null +++ b/src/theme/Layout/Provider/index.tsx @@ -0,0 +1,31 @@ +/** + * 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 {composeProviders} from '@docusaurus/theme-common'; +import { + ColorModeProvider, + AnnouncementBarProvider, + DocsPreferredVersionContextProvider, + ScrollControllerProvider, + NavbarProvider, + PluginHtmlClassNameProvider, +} from '@docusaurus/theme-common/internal'; +import type {Props} from '@theme/Layout/Provider'; + +const Provider = composeProviders([ + ColorModeProvider, + AnnouncementBarProvider, + ScrollControllerProvider, + DocsPreferredVersionContextProvider, + PluginHtmlClassNameProvider, + NavbarProvider, +]); + +export default function LayoutProvider({children}: Props): JSX.Element { + return {children}; +} diff --git a/src/theme/Layout/index.tsx b/src/theme/Layout/index.tsx index bed3e10b32..451d1580fb 100644 --- a/src/theme/Layout/index.tsx +++ b/src/theme/Layout/index.tsx @@ -8,20 +8,21 @@ import React from 'react'; import clsx from 'clsx'; import ErrorBoundary from '@docusaurus/ErrorBoundary'; +import { + PageMetadata, + SkipToContentFallbackId, + ThemeClassNames, +} from '@docusaurus/theme-common'; +import {useKeyboardNavigation} from '@docusaurus/theme-common/internal'; import SkipToContent from '@theme/SkipToContent'; import AnnouncementBar from '@theme/AnnouncementBar'; import NavbarCustom from '../../components/NavBar'; import Navbar from '@theme/Navbar'; import Footer from '@theme/Footer'; -import LayoutProviders from '@theme/LayoutProviders'; -import type {Props} from '@theme/Layout'; -import { - PageMetadata, - ThemeClassNames, - useKeyboardNavigation, -} from '@docusaurus/theme-common'; +import LayoutProvider from '@theme/Layout/Provider'; import ErrorPageContent from '@theme/ErrorPageContent'; -import './styles.css'; +import type {Props} from '@theme/Layout'; +import styles from './styles.module.css'; import { useLocation } from '@docusaurus/router'; export default function Layout(props: Props): JSX.Element { @@ -38,21 +39,32 @@ export default function Layout(props: Props): JSX.Element { const docs_url = useLocation().pathname.includes('docs'); const community_url = useLocation().pathname.includes('community'); + const blog_url = useLocation().pathname.includes('blog'); return ( - + - {docs_url || community_url ? : null } - {docs_url || community_url ? : } + {docs_url || community_url || blog_url ? : null } + {docs_url || community_url || blog_url ? : } -
    - {children} +
    + }> + {children} +
    {!noFooter &&