docs: Guides nav update (#426)

* next * fix * fix * cleanup * cleanup * fix * fix * fix * remove console log * rereview * fix
FuelLabs · Sep 27, 2024 · 8f08d93 · 8f08d93
1 parent 168fa39
commit 8f08d93
Show file tree

Hide file tree

Showing 7 changed files with 52 additions and 35 deletions.
diff --git a/docs/nightly/fuel-specs b/docs/nightly/fuel-specs
diff --git a/scripts/generate-links/getSortedLinks.mjs b/scripts/generate-links/getSortedLinks.mjs
@@ -344,6 +344,7 @@ function handleSubmenu(
   ];
 
   return {
+    slug,
     subpath,
     label: thisCategory,
     isExternal,

diff --git a/scripts/generate-links/index.mjs b/scripts/generate-links/index.mjs
@@ -20,21 +20,15 @@ async function main() {
       const final = slugs.map(({ slug }) => getDocBySlug(slug, slugs));
       let sortedLinks = getSortedLinks(orders[key], final);
 
-      if (key === 'intro') {
-        sortedLinks.push({
-          slug: '/guides',
-          label: 'Guides',
-          isExternal: false,
-        });
-      }
       if (key.includes('guides')) {
         const newLinks = {};
-        sortedLinks.forEach((link) => {
-          newLinks[
-            link.label.toLowerCase().replaceAll(' ', '_').replaceAll('-', '_')
-          ] = link;
+        sortedLinks = sortedLinks.map((link) => {
+          link.key = link.label
+            .toLowerCase()
+            .replaceAll(' ', '_')
+            .replaceAll('-', '_');
+          return link;
         });
-        sortedLinks = newLinks;
       }
       if (Array.isArray(sortedLinks)) {
         sortedLinks = sortedLinks.map((link) => {
@@ -49,10 +43,10 @@ async function main() {
         fs.mkdirSync(folderPath, { recursive: true });
       }
       fs.writeFileSync(`${folderPath}/${key}.json`, json, 'utf-8');
-      if (!key.includes('guides') && key !== 'contributing') {
+      if (key !== 'contributing') {
         if (
           key.includes('nightly') ||
-          ['intro', 'contributing'].includes(key)
+          ['guides', 'intro', 'contributing'].includes(key)
         ) {
           const cleanKey = key.replace('nightly-', '');
           allNightlyOrders.push({
@@ -106,6 +100,9 @@ function getSidebarName(key) {
     case 'migrations-and-disclosures':
       newKey = 'Migrations & Disclosures';
       break;
+    case 'guides':
+      newKey = 'Guides';
+      break;
     case 'integration-docs':
       newKey = 'Integrations';
       break;
@@ -119,6 +116,7 @@ function handleAllOrders(allOrders, folderPath, filename) {
   const correctOrder = [
     'migrations-and-disclosures',
     'intro',
+    'guides',
     'sway',
     'sway-libs',
     'sway-standards',

diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
@@ -59,13 +59,25 @@ export function Sidebar({
       {allNavs && (
         <>
           {/* DOCS */}
-
           {allNavs.map((navOrder) => {
             const catIndex = versionSet === 'default' ? 1 : 2;
-            let key = navOrder.links[0].slug.split('/')[catIndex];
+
+            let slug = navOrder.links[0]?.slug;
+
+            if (!slug && navOrder.links[0]?.submenu?.[0]?.slug) {
+              slug = navOrder.links[0].submenu[0].slug;
+            }
+
+            if (!slug) {
+              console.warn(`No slug found for navOrder.key: ${navOrder.key}`);
+              return null;
+            }
+
+            let key = slug.split('/')[catIndex];
             if (key === 'sway') {
               key = 'forc';
             }
+
             return (
               <Box key={navOrder.key}>
                 <SidebarSection

diff --git a/src/components/SidebarSection.tsx b/src/components/SidebarSection.tsx
@@ -26,7 +26,7 @@ export function SidebarSection({
   version,
 }: SectionProps) {
   const [isOpened, setIsOpened] = useState<boolean | undefined>(
-    book === 'guides' ||
+    (book.toLowerCase() === 'guides' && docSlug?.includes('guides')) ||
       docSlug?.includes(`/${book.toLowerCase()}/`) ||
       docSlug === `docs/${book.toLowerCase()}` ||
       (book === 'Intro' && !docSlug)
@@ -58,6 +58,9 @@ export function SidebarSection({
       case 'Migrations-and-disclosures':
         githubLink = 'https://github.com/FuelLabs/migrations-and-disclosures';
         break;
+      case 'Guides':
+        githubLink = 'https://github.com/FuelLabs/docs-hub';
+        break;
       case 'Integration-docs':
         githubLink = 'https://github.com/FuelLabs/integration-docs';
         break;
@@ -94,22 +97,22 @@ export function SidebarSection({
           <Box.VStack gap='0' css={styles.sectionContainer}>
             {/* biome-ignore lint/suspicious/noExplicitAny: */}
             {links.map((link: any, index: number) => {
-              if (link.slug) {
+              if (link.submenu) {
                 return (
-                  <SidebarLink
+                  <SidebarSubmenu
+                    key={link.submenu[0].slug}
                     onClick={onClick}
-                    key={link.slug}
-                    item={link}
-                    isIndex={index === 0 && bookHasIndex}
+                    {...link}
                   />
                 );
               }
-              if (link.submenu) {
+              if (link.slug) {
                 return (
-                  <SidebarSubmenu
-                    key={link.submenu[0].slug}
+                  <SidebarLink
                     onClick={onClick}
-                    {...link}
+                    key={link.slug}
+                    item={link}
+                    isIndex={index === 0 && bookHasIndex}
                   />
                 );
               }

diff --git a/src/lib/getActiveNav.ts b/src/lib/getActiveNav.ts
@@ -7,11 +7,7 @@ export function getActiveNav(
   doc?: DocType
 ) {
   let navs = undefined;
-  if (
-    !doc ||
-    (!doc.originalSlug.includes('guides') &&
-      !doc.originalSlug.includes('docs/contributing'))
-  ) {
+  if (!doc || !doc.originalSlug.includes('docs/contributing')) {
     if (versionSet === 'nightly') {
       navs = allNightlyNavs;
     } else {

diff --git a/src/lib/md-doc.ts b/src/lib/md-doc.ts
@@ -71,6 +71,7 @@ export class Doc {
       .replace('docs/sway/', '')
       .replace('docs/sway-standards/', '')
       .replace('docs/sway-by-example-lib/', '')
+      .replace('docs/guides/', '')
       .replace('docs/fuel-specs/', '')}`;
 
     let pageLink = `${config.repository}${actualPath.replace(
@@ -212,9 +213,15 @@ export class Doc {
         .replace(`${guideName}/`, '')
         .replace('/index', '');
 
-      const key = slug.split('/')[0].replaceAll('-', '_');
-      const guideLinks = [links[key]];
-      return guideLinks as SidebarLinkItem[];
+      const key = slug.split('/')[0].replace(/-/g, '_');
+
+      const guideLink = links.find((link) => link.key === key);
+
+      if (guideLink?.submenu) {
+        return guideLink.submenu as SidebarLinkItem[];
+      }
+      console.warn(`No guide link found for key: ${key}`);
+      return [];
     }
     return links as SidebarLinkItem[];
   }