@docusaurus/plugin-content-blog 0.0.0-4837 → 0.0.0-4838

package/lib/blogUtils.js

@@ -58,7 +58,7 @@ exports.paginateBlogPosts = paginateBlogPosts;
 function getBlogTags({ blogPosts, ...params }) {
     const groups = (0, utils_1.groupTaggedItems)(blogPosts, (blogPost) => blogPost.metadata.tags);
     return lodash_1.default.mapValues(groups, ({ tag, items: tagBlogPosts }) => ({
-        name: tag.label,
+        label: tag.label,
         items: tagBlogPosts.map((item) => item.id),
         permalink: tag.permalink,
         pages: paginateBlogPosts({

package/lib/index.js

@@ -52,6 +52,8 @@ async function pluginContentBlog(context, options) {
         // Fetches blog contents and returns metadata for the necessary routes.
         async loadContent() {
             const { postsPerPage: postsPerPageOption, routeBasePath, tagsBasePath, blogDescription, blogTitle, blogSidebarTitle, } = options;
+            const baseBlogUrl = (0, utils_1.normalizeUrl)([baseUrl, routeBasePath]);
+            const blogTagsListPath = (0, utils_1.normalizeUrl)([baseBlogUrl, tagsBasePath]);
             const blogPosts = await (0, blogUtils_1.generateBlogPosts)(contentPaths, context, options);
             if (!blogPosts.length) {
                 return {
@@ -59,7 +61,7 @@ async function pluginContentBlog(context, options) {
                     blogPosts: [],
                     blogListPaginated: [],
                     blogTags: {},
-                    blogTagsListPath: null,
+                    blogTagsListPath,
                     blogTagsPaginated: [],
                 };
             }
@@ -80,7 +82,6 @@ async function pluginContentBlog(context, options) {
                     };
                 }
             });
-            const baseBlogUrl = (0, utils_1.normalizeUrl)([baseUrl, routeBasePath]);
             const blogListPaginated = (0, blogUtils_1.paginateBlogPosts)({
                 blogPosts,
                 blogTitle,
@@ -94,8 +95,6 @@ async function pluginContentBlog(context, options) {
                 blogDescription,
                 blogTitle,
             });
-            const tagsPath = (0, utils_1.normalizeUrl)([baseBlogUrl, tagsBasePath]);
-            const blogTagsListPath = Object.keys(blogTags).length > 0 ? tagsPath : null;
             return {
                 blogSidebarTitle,
                 blogPosts,
@@ -185,23 +184,37 @@ async function pluginContentBlog(context, options) {
                     },
                 });
             }));
-            // Tags.
-            if (blogTagsListPath === null) {
+            // Tags. This is the last part so we early-return if there are no tags.
+            if (Object.keys(blogTags).length === 0) {
                 return;
             }
-            const tagsModule = Object.fromEntries(Object.entries(blogTags).map(([, tag]) => {
-                const tagModule = {
-                    allTagsPath: blogTagsListPath,
-                    name: tag.name,
-                    count: tag.items.length,
+            async function createTagsListPage() {
+                const tagsProp = Object.values(blogTags).map((tag) => ({
+                    label: tag.label,
                     permalink: tag.permalink,
-                };
-                return [tag.name, tagModule];
-            }));
-            async function createTagRoutes(tag) {
+                    count: tag.items.length,
+                }));
+                const tagsPropPath = await createData(`${(0, utils_1.docuHash)(`${blogTagsListPath}-tags`)}.json`, JSON.stringify(tagsProp, null, 2));
+                addRoute({
+                    path: blogTagsListPath,
+                    component: blogTagsListComponent,
+                    exact: true,
+                    modules: {
+                        sidebar: aliasedSource(sidebarProp),
+                        tags: aliasedSource(tagsPropPath),
+                    },
+                });
+            }
+            async function createTagPostsListPage(tag) {
                 await Promise.all(tag.pages.map(async (blogPaginated) => {
                     const { metadata, items } = blogPaginated;
-                    const tagsMetadataPath = await createData(`${(0, utils_1.docuHash)(metadata.permalink)}.json`, JSON.stringify(tagsModule[tag.name], null, 2));
+                    const tagProp = {
+                        label: tag.label,
+                        permalink: tag.permalink,
+                        allTagsPath: blogTagsListPath,
+                        count: tag.items.length,
+                    };
+                    const tagPropPath = await createData(`${(0, utils_1.docuHash)(metadata.permalink)}.json`, JSON.stringify(tagProp, null, 2));
                     const listMetadataPath = await createData(`${(0, utils_1.docuHash)(metadata.permalink)}-list.json`, JSON.stringify(metadata, null, 2));
                     addRoute({
                         path: metadata.permalink,
@@ -221,26 +234,14 @@ async function pluginContentBlog(context, options) {
                                     },
                                 };
                             }),
-                            metadata: aliasedSource(tagsMetadataPath),
+                            tag: aliasedSource(tagPropPath),
                             listMetadata: aliasedSource(listMetadataPath),
                         },
                     });
                 }));
             }
-            await Promise.all(Object.values(blogTags).map(createTagRoutes));
-            // Only create /tags page if there are tags.
-            if (Object.keys(blogTags).length > 0) {
-                const tagsListPath = await createData(`${(0, utils_1.docuHash)(`${blogTagsListPath}-tags`)}.json`, JSON.stringify(tagsModule, null, 2));
-                addRoute({
-                    path: blogTagsListPath,
-                    component: blogTagsListComponent,
-                    exact: true,
-                    modules: {
-                        sidebar: aliasedSource(sidebarProp),
-                        tags: aliasedSource(tagsListPath),
-                    },
-                });
-            }
+            await createTagsListPage();
+            await Promise.all(Object.values(blogTags).map(createTagPostsListPage));
         },
         translateContent({ content, translationFiles }) {
             return (0, translations_1.translateContent)(content, translationFiles);

package/lib/types.d.ts

@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import type { BrokenMarkdownLink, ContentPaths } from '@docusaurus/utils';
+import type { Tag } from '@docusaurus/types';
 import type { BlogPostMetadata } from '@docusaurus/plugin-content-blog';
 import type { Metadata as BlogPaginatedMetadata } from '@theme/BlogListPage';
 export declare type BlogContentPaths = ContentPaths;
@@ -13,16 +14,14 @@ export declare type BlogContent = {
     blogPosts: BlogPost[];
     blogListPaginated: BlogPaginated[];
     blogTags: BlogTags;
-    blogTagsListPath: string | null;
+    blogTagsListPath: string;
 };
 export declare type BlogTags = {
-    [tagKey: string]: BlogTag;
+    [permalink: string]: BlogTag;
 };
-export declare type BlogTag = {
-    name: string;
+export declare type BlogTag = Tag & {
     /** Blog post permalinks. */
     items: string[];
-    permalink: string;
     pages: BlogPaginated[];
 };
 export declare type BlogPost = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@docusaurus/plugin-content-blog",
-  "version": "0.0.0-4837",
+  "version": "0.0.0-4838",
   "description": "Blog plugin for Docusaurus.",
   "main": "lib/index.js",
   "types": "src/plugin-content-blog.d.ts",
@@ -18,12 +18,12 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@docusaurus/core": "0.0.0-4837",
-    "@docusaurus/logger": "0.0.0-4837",
-    "@docusaurus/mdx-loader": "0.0.0-4837",
-    "@docusaurus/utils": "0.0.0-4837",
-    "@docusaurus/utils-common": "0.0.0-4837",
-    "@docusaurus/utils-validation": "0.0.0-4837",
+    "@docusaurus/core": "0.0.0-4838",
+    "@docusaurus/logger": "0.0.0-4838",
+    "@docusaurus/mdx-loader": "0.0.0-4838",
+    "@docusaurus/utils": "0.0.0-4838",
+    "@docusaurus/utils-common": "0.0.0-4838",
+    "@docusaurus/utils-validation": "0.0.0-4838",
     "cheerio": "^1.0.0-rc.10",
     "feed": "^4.2.2",
     "fs-extra": "^10.0.1",
@@ -35,7 +35,7 @@
     "webpack": "^5.70.1"
   },
   "devDependencies": {
-    "@docusaurus/types": "0.0.0-4837",
+    "@docusaurus/types": "0.0.0-4838",
     "escape-string-regexp": "^4.0.0"
   },
   "peerDependencies": {
@@ -45,5 +45,5 @@
   "engines": {
     "node": ">=14"
   },
-  "gitHead": "475b73ed768e51837beba5fb7bb3885716120e9a"
+  "gitHead": "e9b56f063a75e637632bdede9cc507bece7c06f1"
 }

package/src/blogUtils.ts

@@ -114,7 +114,7 @@ export function getBlogTags({
   );
 
   return _.mapValues(groups, ({tag, items: tagBlogPosts}) => ({
-    name: tag.label,
+    label: tag.label,
     items: tagBlogPosts.map((item) => item.id),
     permalink: tag.permalink,
     pages: paginateBlogPosts({

package/src/index.ts

@@ -30,7 +30,13 @@ import type {
   BlogContentPaths,
   BlogMarkdownLoaderOptions,
 } from './types';
-import type {LoadContext, Plugin, HtmlTags} from '@docusaurus/types';
+import type {
+  LoadContext,
+  Plugin,
+  HtmlTags,
+  TagsListItem,
+  TagModule,
+} from '@docusaurus/types';
 import {
   generateBlogPosts,
   getSourceToPermalink,
@@ -43,7 +49,6 @@ import type {
   BlogPostFrontMatter,
   BlogPostMetadata,
   Assets,
-  TagModule,
 } from '@docusaurus/plugin-content-blog';
 
 export default async function pluginContentBlog(
@@ -117,6 +122,8 @@ export default async function pluginContentBlog(
         blogSidebarTitle,
       } = options;
 
+      const baseBlogUrl = normalizeUrl([baseUrl, routeBasePath]);
+      const blogTagsListPath = normalizeUrl([baseBlogUrl, tagsBasePath]);
       const blogPosts = await generateBlogPosts(contentPaths, context, options);
 
       if (!blogPosts.length) {
@@ -125,7 +132,7 @@ export default async function pluginContentBlog(
           blogPosts: [],
           blogListPaginated: [],
           blogTags: {},
-          blogTagsListPath: null,
+          blogTagsListPath,
           blogTagsPaginated: [],
         };
       }
@@ -150,8 +157,6 @@ export default async function pluginContentBlog(
         }
       });
 
-      const baseBlogUrl = normalizeUrl([baseUrl, routeBasePath]);
-
       const blogListPaginated: BlogPaginated[] = paginateBlogPosts({
         blogPosts,
         blogTitle,
@@ -167,11 +172,6 @@ export default async function pluginContentBlog(
         blogTitle,
       });
 
-      const tagsPath = normalizeUrl([baseBlogUrl, tagsBasePath]);
-
-      const blogTagsListPath =
-        Object.keys(blogTags).length > 0 ? tagsPath : null;
-
       return {
         blogSidebarTitle,
         blogPosts,
@@ -307,30 +307,47 @@ export default async function pluginContentBlog(
         }),
       );
 
-      // Tags.
-      if (blogTagsListPath === null) {
+      // Tags. This is the last part so we early-return if there are no tags.
+      if (Object.keys(blogTags).length === 0) {
         return;
       }
 
-      const tagsModule: {[tagName: string]: TagModule} = Object.fromEntries(
-        Object.entries(blogTags).map(([, tag]) => {
-          const tagModule: TagModule = {
-            allTagsPath: blogTagsListPath,
-            name: tag.name,
-            count: tag.items.length,
-            permalink: tag.permalink,
-          };
-          return [tag.name, tagModule];
-        }),
-      );
+      async function createTagsListPage() {
+        const tagsProp: TagsListItem[] = Object.values(blogTags).map((tag) => ({
+          label: tag.label,
+          permalink: tag.permalink,
+          count: tag.items.length,
+        }));
 
-      async function createTagRoutes(tag: BlogTag): Promise<void> {
+        const tagsPropPath = await createData(
+          `${docuHash(`${blogTagsListPath}-tags`)}.json`,
+          JSON.stringify(tagsProp, null, 2),
+        );
+
+        addRoute({
+          path: blogTagsListPath,
+          component: blogTagsListComponent,
+          exact: true,
+          modules: {
+            sidebar: aliasedSource(sidebarProp),
+            tags: aliasedSource(tagsPropPath),
+          },
+        });
+      }
+
+      async function createTagPostsListPage(tag: BlogTag): Promise<void> {
         await Promise.all(
           tag.pages.map(async (blogPaginated) => {
             const {metadata, items} = blogPaginated;
-            const tagsMetadataPath = await createData(
+            const tagProp: TagModule = {
+              label: tag.label,
+              permalink: tag.permalink,
+              allTagsPath: blogTagsListPath,
+              count: tag.items.length,
+            };
+            const tagPropPath = await createData(
               `${docuHash(metadata.permalink)}.json`,
-              JSON.stringify(tagsModule[tag.name], null, 2),
+              JSON.stringify(tagProp, null, 2),
             );
 
             const listMetadataPath = await createData(
@@ -356,7 +373,7 @@ export default async function pluginContentBlog(
                     },
                   };
                 }),
-                metadata: aliasedSource(tagsMetadataPath),
+                tag: aliasedSource(tagPropPath),
                 listMetadata: aliasedSource(listMetadataPath),
               },
             });
@@ -364,25 +381,8 @@ export default async function pluginContentBlog(
         );
       }
 
-      await Promise.all(Object.values(blogTags).map(createTagRoutes));
-
-      // Only create /tags page if there are tags.
-      if (Object.keys(blogTags).length > 0) {
-        const tagsListPath = await createData(
-          `${docuHash(`${blogTagsListPath}-tags`)}.json`,
-          JSON.stringify(tagsModule, null, 2),
-        );
-
-        addRoute({
-          path: blogTagsListPath,
-          component: blogTagsListComponent,
-          exact: true,
-          modules: {
-            sidebar: aliasedSource(sidebarProp),
-            tags: aliasedSource(tagsListPath),
-          },
-        });
-      }
+      await createTagsListPage();
+      await Promise.all(Object.values(blogTags).map(createTagPostsListPage));
     },
 
     translateContent({content, translationFiles}) {

package/src/plugin-content-blog.d.ts

@@ -7,8 +7,9 @@
 
 declare module '@docusaurus/plugin-content-blog' {
   import type {MDXOptions} from '@docusaurus/mdx-loader';
-  import type {FrontMatterTag, Tag} from '@docusaurus/utils';
+  import type {FrontMatterTag} from '@docusaurus/utils';
   import type {Overwrite} from 'utility-types';
+  import type {Tag} from '@docusaurus/types';
 
   export type Assets = {
     /**
@@ -406,17 +407,6 @@ declare module '@docusaurus/plugin-content-blog' {
     }
   >;
 
-  export type TagModule = {
-    /** Permalink of the tag's own page. */
-    permalink: string;
-    /** Name of the tag. */
-    name: string;
-    /** Number of posts with this tag. */
-    count: number;
-    /** The tags list page. */
-    allTagsPath: string;
-  };
-
   export type BlogSidebar = {
     title: string;
     items: {title: string; permalink: string}[];
@@ -511,28 +501,30 @@ declare module '@theme/BlogListPage' {
 }
 
 declare module '@theme/BlogTagsListPage' {
-  import type {BlogSidebar, TagModule} from '@docusaurus/plugin-content-blog';
+  import type {BlogSidebar} from '@docusaurus/plugin-content-blog';
+  import type {TagsListItem} from '@docusaurus/types';
 
   export interface Props {
     /** Blog sidebar. */
     readonly sidebar: BlogSidebar;
-    /** A map from tag names to the full tag module. */
-    readonly tags: Readonly<{[tagName: string]: TagModule}>;
+    /** All tags declared in this blog. */
+    readonly tags: TagsListItem[];
   }
 
   export default function BlogTagsListPage(props: Props): JSX.Element;
 }
 
 declare module '@theme/BlogTagsPostsPage' {
-  import type {BlogSidebar, TagModule} from '@docusaurus/plugin-content-blog';
+  import type {BlogSidebar} from '@docusaurus/plugin-content-blog';
   import type {Content} from '@theme/BlogPostPage';
   import type {Metadata} from '@theme/BlogListPage';
+  import type {TagModule} from '@docusaurus/types';
 
   export interface Props {
     /** Blog sidebar. */
     readonly sidebar: BlogSidebar;
     /** Metadata of this tag. */
-    readonly metadata: TagModule;
+    readonly tag: TagModule;
     /** Looks exactly the same as the posts list page */
     readonly listMetadata: Metadata;
     /**

package/src/types.ts

@@ -6,6 +6,7 @@
  */
 
 import type {BrokenMarkdownLink, ContentPaths} from '@docusaurus/utils';
+import type {Tag} from '@docusaurus/types';
 import type {BlogPostMetadata} from '@docusaurus/plugin-content-blog';
 import type {Metadata as BlogPaginatedMetadata} from '@theme/BlogListPage';
 
@@ -16,22 +17,16 @@ export type BlogContent = {
   blogPosts: BlogPost[];
   blogListPaginated: BlogPaginated[];
   blogTags: BlogTags;
-  blogTagsListPath: string | null;
+  blogTagsListPath: string;
 };
 
 export type BlogTags = {
-  // TODO, the key is the tag slug/permalink
-  // This is due to legacy frontmatter: tags:
-  // [{label: "xyz", permalink: "/1"}, {label: "xyz", permalink: "/2"}]
-  // Soon we should forbid declaring permalink through frontmatter
-  [tagKey: string]: BlogTag;
+  [permalink: string]: BlogTag;
 };
 
-export type BlogTag = {
-  name: string;
+export type BlogTag = Tag & {
   /** Blog post permalinks. */
   items: string[];
-  permalink: string;
   pages: BlogPaginated[];
 };