feat(docs): updating examples to be flat (#1069)

Co-authored-by: Joshua Croft <joshuacroft@Joshuas-MacBook-Pro.local> Co-authored-by: gautamgambhir97 <gautam.gambhir@fetch.ai>
fetchai · Nov 26, 2024 · c9a2d9c · c9a2d9c
1 parent 2a5296c
commit c9a2d9c
Show file tree

Hide file tree

Showing 3 changed files with 62 additions and 49 deletions.
diff --git a/pages/_meta.json b/pages/_meta.json
@@ -29,8 +29,7 @@
   "concepts": "Concepts",
   "guides": "Guides",
   "examples": {
-    "title": "Examples",
-    "href": "examples/first-agent"
+    "title": "Examples"
   },
   "references": "References",
   "apis": "APIs"

diff --git a/pages/examples/_meta.json b/pages/examples/_meta.json
@@ -1,12 +1,21 @@
 {
   "easy": {
-    "title": "Easy Topics"
+    "title": "Easy Topics",
+    "theme": {
+      "collapsed": false
+    }
   },
   "intermediate": {
-    "title": "Intermediate Topics"
+    "title": "Intermediate Topics",
+    "theme": {
+      "collapsed": false
+    }
   },
   "advanced": {
-    "title": "Advanced Topics"
+    "title": "Advanced Topics",
+    "theme": {
+      "collapsed": false
+    }
   },
   "postgres-database-with-an-agent": {
     "title": "Postgres Database with an Agent",

diff --git a/theme/fetch-ai-docs/components/sidebar.tsx b/theme/fetch-ai-docs/components/sidebar.tsx
@@ -143,53 +143,58 @@ function FolderImpl({ item, anchors }: FolderProps): ReactElement {
     return (
       <>
         <li className={cn({ open, active }, "nx-w-full")}>
-          <ComponentToUse
-            id={`sidebar${item.route?.split("/").join("-").toLowerCase()}`}
-            href={isLink ? item.route : undefined}
-            className={cn(
-              "nx-items-center  nx-w-full nx-justify-between nx-gap-2",
-              isLink ? "first-title" : "nx-text-left nx-w-full",
-              classes.link,
-              active ? classes.active : classes.inactive,
-              activeRouteInside ? "nextra-active-route" : "",
-            )}
-            onClick={(e) => {
-              const clickedToggleIcon = ["svg", "path"].includes(
-                (e.target as HTMLElement).tagName.toLowerCase(),
-              );
-              if (clickedToggleIcon) {
-                e.preventDefault();
-              }
-              if (isLink) {
-                if (active || clickedToggleIcon) {
+          {(!isLink || ["Ledger", "Indexer"].includes(item.title)) && (
+            <ComponentToUse
+              id={`sidebar${item.route?.split("/").join("-").toLowerCase()}`}
+              href={isLink ? item.route : undefined}
+              className={cn(
+                "nx-items-center  nx-w-full nx-justify-between nx-gap-2",
+                isLink ? "first-title" : "nx-text-left nx-w-full",
+                classes.link,
+                active ? classes.active : classes.inactive,
+                activeRouteInside ? "nextra-active-route" : "",
+              )}
+              onClick={(e) => {
+                const clickedToggleIcon = ["svg", "path"].includes(
+                  (e.target as HTMLElement).tagName.toLowerCase(),
+                );
+                if (clickedToggleIcon) {
+                  e.preventDefault();
+                }
+                if (isLink) {
+                  if (active || clickedToggleIcon) {
+                    TreeState[item.route] = !open;
+                  } else {
+                    TreeState[item.route] = true;
+                    setMenu(false);
+                  }
+                  rerender({});
+                  return;
+                }
+                if (active) return;
+                // removing menu toggle for collapsed content
+                if (!item.collapsed) {
                   TreeState[item.route] = !open;
-                } else {
-                  TreeState[item.route] = true;
-                  setMenu(false);
                 }
                 rerender({});
-                return;
-              }
-              if (active) return;
-              TreeState[item.route] = !open;
-              rerender({});
-            }}
-          >
-            {renderComponent(config.sidebar.titleComponent, {
-              title: item.title,
-              type: item.type,
-              route: item.route,
-            })}
-            {!config.sidebar.autoCollapse && !isLink && (
-              <ArrowRightIcon
-                className="nx-h-[18px] nx-min-w-[18px] nx-rounded-sm nx-p-0.5 hover:nx-bg-gray-800/5 dark:hover:nx-bg-gray-100/5"
-                pathClassName={cn(
-                  "nx-origin-center nx-transition-transform rtl:-nx-rotate-180",
-                  open && "ltr:nx-rotate-90 rtl:nx-rotate-[-270deg]",
-                )}
-              />
-            )}
-          </ComponentToUse>
+              }}
+            >
+              {renderComponent(config.sidebar.titleComponent, {
+                title: item.title,
+                type: item.type,
+                route: item.route,
+              })}
+              {!config.sidebar.autoCollapse && !isLink && !item.collapsed && (
+                <ArrowRightIcon
+                  className="nx-h-[18px] nx-min-w-[18px] nx-rounded-sm nx-p-0.5 hover:nx-bg-gray-800/5 dark:hover:nx-bg-gray-100/5"
+                  pathClassName={cn(
+                    "nx-origin-center nx-transition-transform rtl:-nx-rotate-180",
+                    open && "ltr:nx-rotate-90 rtl:nx-rotate-[-270deg]",
+                  )}
+                />
+              )}
+            </ComponentToUse>
+          )}
           <Collapse
             className="ltr:nx-pr-0 rtl:nx-pl-0 nx-pt-1"
             isOpen={config.sidebar.autoCollapse || open}