Improve get all trees

apps/frontpage/app/docs-all/sitemap.ts

@@ -1,41 +1,45 @@
 import { MetadataRoute } from 'next';
-import { getDocsTreeFromPath } from '../../lib/get-docs-tree-from-path';
-import { docsVersions } from '@repo/utils';
-import {
-  FlatTreeNode,
-  getFlatTreeSitemap,
-} from '../../lib/get-flat-tree-sitemap';
-import { getUrl } from '../../lib/get-url';
+import { FlatTreeNode, getFlatTree } from '../../lib/get-flat-tree';
+import { getAllTrees } from '../../lib/get-all-trees';
+import { docsVersions, latestVersion } from '@repo/utils';
 
 export default function sitemap(): MetadataRoute.Sitemap {
   // Generate docs tree for each version
-  const listofTrees = docsVersions.map((version) => {
-    return {
-      version: version,
-      tree: getDocsTreeFromPath(`content/docs/${version.id}`),
-    };
-  });
+  const listofTrees = getAllTrees();
 
   // We flatten the tree for each version
   const flatTree: FlatTreeNode[] = [];
   listofTrees.forEach((list) => {
-    const newTree = getFlatTreeSitemap(list.tree);
+    const newTree = list.children ? getFlatTree({ tree: list.children }) : [];
     const treeWithVersion = newTree.map((node) => {
-      node.version = list.version;
+      node.version = docsVersions.find((version) => version.id === list.name);
       return node;
     });
 
     flatTree.push(...treeWithVersion);
   });
 
-  // Generate URLs for each node - The getUrl function will remove the version from the URL
+  // Generate URLs for each node
   const docsUrls = flatTree.map((node) => ({
-    url: getUrl(`https://storybook.js.org${node.slug}`, node.version),
+    url: `https://storybook.js.org${node.slug}`,
+  }));
+
+  // Remove https://storybook.js.org/docs/get-started as we are redirecting to https://storybook.js.org/docs
+  const filteredDocsUrls = docsUrls.filter(
+    (node) => node.url !== 'https://storybook.js.org/docs/get-started',
+  );
+
+  const docsHomeUrls = docsVersions.map((version) => ({
+    url:
+      version.id === latestVersion.id
+        ? 'https://storybook.js.org/docs'
+        : `https://storybook.js.org/docs/${version.inSlug || version.id}`,
   }));
 
   return [
     { url: 'https://storybook.js.org' },
     { url: 'https://storybook.js.org/community' },
-    ...docsUrls,
+    ...docsHomeUrls,
+    ...filteredDocsUrls,
   ];
 }

apps/frontpage/app/docs/[[...slug]]/page.tsx

@@ -1,15 +1,15 @@
 import { notFound, redirect } from 'next/navigation';
 import Link from 'next/link';
-import type { TreeProps } from '@repo/utils';
 import { globalSearchMetaKeys, globalSearchImportance } from '@repo/ui';
-import { latestVersion, cn } from '@repo/utils';
+import { latestVersion, cn, docsVersions } from '@repo/utils';
 import { getVersion } from '../../../lib/get-version';
 import { getPageData } from '../../../lib/get-page';
 import { Renderers } from '../../../components/docs/renderers';
-import { getDocsTreeFromPath } from '../../../lib/get-docs-tree-from-path';
 import { DocsFooter } from '../../../components/docs/footer/footer';
 import { Metadata } from 'next';
 import { TableOfContent } from '../../../components/docs/table-of-content';
+import { getAllTrees } from '../../../lib/get-all-trees';
+import { getFlatTree } from '../../../lib/get-flat-tree';
 
 interface PageProps {
   params: {
@@ -33,38 +33,22 @@ export async function generateMetadata({
   };
 }
 
-const latestVersionId = latestVersion.id;
-
 export const generateStaticParams = () => {
-  const result: { slug: string[] }[] = [];
-  const tree = getDocsTreeFromPath();
-
-  const getSlugs = (data: TreeProps[]) => {
-    data.forEach((item) => {
-      if ('slug' in item) {
-        const newSlug = item.slug.replace('/docs/', '').split('/');
-        const { id: versionId, inSlug: versionInSlug } = getVersion(newSlug);
+  const listofTrees = getAllTrees();
 
-        const isLatest = versionId === latestVersionId;
+  const flatTree = getFlatTree({
+    tree: listofTrees,
+    filterDrafts: false,
+    filterSecondLevelDirectories: false,
+  });
 
-        if (isLatest) {
-          // Remove the version
-          newSlug.shift();
-        } else if (versionInSlug) {
-          newSlug[0] = versionInSlug;
-        }
-        result.push({
-          slug: newSlug,
-        });
-      }
-      if (item.children) {
-        getSlugs(item.children);
-      }
-    });
-  };
-  getSlugs(tree);
+  const listOfSlugs = flatTree
+    .filter((node) => node.slug !== '/docs')
+    .map((node) => ({
+      slug: node.slug.replace('/docs/', '').split('/'),
+    }));
 
-  return result;
+  return listOfSlugs;
 };
 
 export default async function Page({ params: { slug } }: PageProps) {
@@ -106,7 +90,8 @@ export default async function Page({ params: { slug } }: PageProps) {
             {page.title || 'Title is missing'}
           </h1>
           {!page.hideRendererSelector && <Renderers />}
-          {page.tabs && page.tabs.length > 0 ? (
+          {/* TODO: Bring back tabs */}
+          {/* {page.tabs && page.tabs.length > 0 ? (
             <div className="flex items-center gap-8 border-b border-zinc-200">
               {page.tabs.map((tab) => {
                 const isActive = tab.slug === `/docs/${slug?.join('/')}`;
@@ -125,7 +110,7 @@ export default async function Page({ params: { slug } }: PageProps) {
                 );
               })}
             </div>
-          ) : null}
+          ) : null} */}
           <div
             className={cn(
               '[&>details]:my-6',

apps/frontpage/app/docs/layout.tsx

@@ -3,23 +3,16 @@ import Image from 'next/image';
 import { fetchGithubCount } from '@repo/utils';
 import { Sidebar } from '../../components/docs/sidebar/sidebar';
 import { NavDocs } from '../../components/docs/sidebar/docs-nav';
-import { getDocsTreeFromPath } from '../../lib/get-docs-tree-from-path';
 import { DocsProvider } from './provider';
 import { Submenu } from '../../components/docs/submenu';
 import { DocsMainNav } from '../../components/docs/sidebar/docs-main-nav';
-import { docsVersions } from '@repo/utils';
 import { ReactNode } from 'react';
 import { TOCSectionTitles } from '../../components/docs/toc-section-titles';
+import { getAllTrees } from '../../lib/get-all-trees';
 
 export default async function Layout({ children }: { children: ReactNode }) {
   const { number: githubCount } = await fetchGithubCount();
-
-  const listofTrees = docsVersions.map((version) => {
-    return {
-      version: version.id,
-      tree: getDocsTreeFromPath(`content/docs/${version.id}`),
-    };
-  });
+  const listofTrees = getAllTrees();
 
   return (
     <DocsProvider>

apps/frontpage/app/docs/sitemap.ts

@@ -1,26 +1,34 @@
 import { MetadataRoute } from 'next';
-import { getDocsTreeFromPath } from '../../lib/get-docs-tree-from-path';
 import { docsVersions } from '@repo/utils';
-import { getUrl } from '../../lib/get-url';
-import { getFlatTreeSitemap } from '../../lib/get-flat-tree-sitemap';
+import { getFlatTree } from '../../lib/get-flat-tree';
+import { getAllTrees } from '../../lib/get-all-trees';
 
 export default function sitemap(): MetadataRoute.Sitemap {
   const latestVersion = docsVersions[0];
 
   // Generate docs tree for the latest version only
-  const tree = getDocsTreeFromPath(`content/docs/${latestVersion.id}`);
+  const listOfTrees = getAllTrees();
+  const tree = listOfTrees.find((tree) => tree.name === latestVersion.id);
 
   // We flatten the tree
-  const flatTree = getFlatTreeSitemap(tree);
+  const flatTree = tree?.children && getFlatTree({ tree: tree?.children });
 
-  // Generate URLs for each node - The getUrl function will remove the version from the URL
-  const docsUrls = flatTree.map((node) => ({
-    url: getUrl(`https://storybook.js.org${node.slug}`, latestVersion),
-  }));
+  // Generate URLs for each node
+  const docsUrls = flatTree
+    ? flatTree.map((node) => ({
+        url: `https://storybook.js.org${node.slug}`,
+      }))
+    : [];
+
+  // Remove https://storybook.js.org/docs/get-started as we are redirecting to https://storybook.js.org/docs
+  const filteredDocsUrls = docsUrls.filter(
+    (node) => node.url !== 'https://storybook.js.org/docs/get-started',
+  );
 
   return [
     { url: 'https://storybook.js.org' },
     { url: 'https://storybook.js.org/community' },
-    ...docsUrls,
+    { url: 'https://storybook.js.org/docs' },
+    ...filteredDocsUrls,
   ];
 }

apps/frontpage/components/docs/footer/actions.ts

@@ -7,8 +7,7 @@ import { z } from 'zod';
 
 import type { TreeProps } from '@repo/utils';
 import { docsVersions } from '@repo/utils';
-import { buildPathWithVersion } from '../../../lib/build-path-with-version';
-import { getDocsTreeFromPath } from '../../../lib/get-docs-tree-from-path';
+import { getAllTrees } from '../../../lib/get-all-trees';
 
 const siteUrl = process.env.VERCEL_ENV === 'production';
 
@@ -36,9 +35,10 @@ function addSlugs(tree: TreeProps[]) {
   });
 }
 
-versions.forEach((v) => {
-  const tree = getDocsTreeFromPath(`content/docs/${v}`);
-  addSlugs(tree);
+const listOfTrees = getAllTrees();
+
+listOfTrees.forEach((tree) => {
+  addSlugs(tree.children!);
 });
 
 const repositoryOwner = 'storybookjs';
@@ -85,8 +85,7 @@ function createCommentBody({
   rating: Rating;
   comment?: string;
 }) {
-  const path = buildPathWithVersion(slug, version);
-  const link = `**[${path}](https://storybook.js.org${path})**`;
+  const link = `**[${slug}](https://storybook.js.org${slug})**`;
 
   const meta = [
     `| ${ratingSymbols[rating]} | v${version} | ${renderer} | ${codeLanguage} |`,