Automatically Count Articles in Docusaurus Sidebar

/**
 * Creating a sidebar enables you to:
 - create an ordered group of docs
 - render a sidebar for each doc of that group
 - provide next/previous navigation

 The sidebars can be generated from the filesystem, or explicitly defined here.

 Create as many sidebars as you want.
 */

// @ts-check

/** @type {import('@docusaurus/plugin-content-docs').SidebarsConfig} */
const sidebars = {
  // By default, Docusaurus generates a sidebar from the docs folder structure
  tutorialSidebar: [{ type: "autogenerated", dirName: "." }],

  // But you can create a sidebar manually
  /*
  tutorialSidebar: [
    'intro',
    'hello',
    {
      type: 'category',
      label: 'Tutorial',
      items: ['tutorial-basics/create-a-document'],
    },
  ],
   */
};

export default sidebars;

const fs = require("fs"); // Import Node.js file system module to work with files and directories
const path = require("path"); // Import Node.js path module to handle file paths

/** @type {import('@docusaurus/plugin-content-docs').SidebarsConfig} */
// This is a type definition for Docusaurus sidebar configuration to enable IDE autocompletion
function generateSidebar() {
  // Set the base directory path, pointing to the 'papers' folder. Modify as needed.
  const baseDir = path.join(__dirname, "papers");

  // Read all subdirectories under 'papers', filtering out hidden ones (starting with a dot)
  const categories = fs.readdirSync(baseDir).filter((item) => {
    const itemPath = path.join(baseDir, item);
    // Ensure it's a directory and not hidden
    return fs.statSync(itemPath).isDirectory() && !item.startsWith(".");
  });

  const sidebarItems = []; // Array to store sidebar items

  // Add a fixed 'intro' item at the beginning
  sidebarItems.push("intro");

  // Iterate through all category directories
  categories.forEach((category) => {
    const categoryPath = path.join(baseDir, category); // Get the full path for each category
    const count = countItemsInDirectory(categoryPath); // Count the number of items in the directory

    // Try to read the '_category_.json' file within the category directory to get label and link
    const categoryJsonPath = path.join(categoryPath, "_category_.json");
    let label = category; // Default label is the directory name
    let link = undefined; // Default link is undefined
    if (fs.existsSync(categoryJsonPath)) {
      // If the '_category_.json' file exists
      const categoryJson = JSON.parse(
        fs.readFileSync(categoryJsonPath, "utf8")
      ); // Read and parse the JSON file
      label = categoryJson.label || category; // Use the label from the JSON file or default to directory name
      link = categoryJson.link; // Use the link from the JSON file
    }

    // Append the item count to the label
    label = `${label} (${count})`;

    // Create a sidebar item, with type 'category', indicating this is a category
    const sidebarItem = {
      type: "category",
      label: label, // Display label
      items: [{ type: "autogenerated", dirName: category }], // Automatically generate document items under the category
    };

    if (link) {
      // If a link is provided, add it to the category
      sidebarItem.link = link;
    }

    sidebarItems.push(sidebarItem); // Add the category item to the sidebar array
  });

  // Return an object containing the sidebar configuration
  return {
    papersSidebar: sidebarItems,
  };
}

// Count the valid items (including subdirectories and Markdown files) in a specified directory
function countItemsInDirectory(dirPath) {
  const items = fs.readdirSync(dirPath).filter((item) => {
    const itemPath = path.join(dirPath, item);
    // Exclude '_category_.json' and hidden files (starting with a dot)
    if (item === "_category_.json" || item.startsWith(".")) return false;
    const stat = fs.statSync(itemPath);
    // Only count directories and .md files
    return stat.isDirectory() || (stat.isFile() && item.endsWith(".md"));
  });
  return items.length; // Return the count of items
}

// Export the generated sidebar configuration for Docusaurus to use
export default generateSidebar();