@powerhousedao/academy 5.0.0-staging.2 → 5.0.0-staging.20

package/scripts/generate-combined-cli-docs.ts

@@ -12,11 +12,33 @@ async function generateCombinedCliDocs() {
     const __dirname = path.dirname(__filename);
 
     // Define paths
-    const academyDocsDir = path.resolve(__dirname, "..", "docs", "academy", "04-APIReferences");
+    const academyDocsDir = path.resolve(
+      __dirname,
+      "..",
+      "docs",
+      "academy",
+      "04-APIReferences",
+    );
     const targetDocFile = path.join(academyDocsDir, "00-PowerhouseCLI.md");
 
-    const phCliCommandsPath = path.resolve(__dirname, "..", "..", "..", "clis", "ph-cli", "COMMANDS.md");
-    const phCmdCommandsPath = path.resolve(__dirname, "..", "..", "..", "clis", "ph-cmd", "COMMANDS.md");
+    const phCliCommandsPath = path.resolve(
+      __dirname,
+      "..",
+      "..",
+      "..",
+      "clis",
+      "ph-cli",
+      "COMMANDS.md",
+    );
+    const phCmdCommandsPath = path.resolve(
+      __dirname,
+      "..",
+      "..",
+      "..",
+      "clis",
+      "ph-cmd",
+      "COMMANDS.md",
+    );
 
     // Read COMMANDS.md files
     const phCliCommandsContent = fs.readFileSync(phCliCommandsPath, "utf8");
@@ -27,13 +49,18 @@ async function generateCombinedCliDocs() {
       const tocHeader = "## Table of Contents";
       const tocIndex = content.indexOf(tocHeader);
       if (tocIndex === -1) {
-        console.warn(`Warning: "## Table of Contents" not found in ${cliName} COMMANDS.md. Including entire file.`);
+        console.warn(
+          `Warning: "## Table of Contents" not found in ${cliName} COMMANDS.md. Including entire file.`,
+        );
         return content;
       }
-      let commandsSection = content.substring(tocIndex + tocHeader.length).trim();
-      
+      let commandsSection = content
+        .substring(tocIndex + tocHeader.length)
+        .trim();
+
       // Remove the auto-generation footer
-      const footerRegex = /---\\n\\n\\\*This document was automatically generated from the help text in the codebase\\\.\\\*\\n?$/m;
+      const footerRegex =
+        /---\\n\\n\\\*This document was automatically generated from the help text in the codebase\\\.\\\*\\n?$/m;
       commandsSection = commandsSection.replace(footerRegex, "").trim();
       return commandsSection;
     };
@@ -42,7 +69,7 @@ async function generateCombinedCliDocs() {
     const phCmdDocs = extractCommands(phCmdCommandsContent, "ph-cmd");
 
     // Prepare the combined markdown
-    let combinedDocs = `### ph-cmd Commands\\n\\n${phCmdDocs}\\n\\n### ph-cli Commands\\n\\n${phCliDocs}`;
+    const combinedDocs = `### ph-cmd Commands\\n\\n${phCmdDocs}\\n\\n### ph-cli Commands\\n\\n${phCliDocs}`;
 
     // Read the target documentation file
     let targetDocContent = fs.readFileSync(targetDocFile, "utf8");
@@ -54,11 +81,13 @@ async function generateCombinedCliDocs() {
     const endIndex = targetDocContent.indexOf(endPlaceholder);
 
     if (startIndex === -1 || endIndex === -1) {
-      console.error(`Error: Placeholders not found in ${targetDocFile}. Please ensure the file contains:\\n${startPlaceholder}\\n...\\n${endPlaceholder}`);
+      console.error(
+        `Error: Placeholders not found in ${targetDocFile}. Please ensure the file contains:\\n${startPlaceholder}\\n...\\n${endPlaceholder}`,
+      );
       process.exit(1);
     }
 
-    targetDocContent = 
+    targetDocContent =
       targetDocContent.substring(0, startIndex + startPlaceholder.length) +
       "\\n<!-- This content is automatically generated. Do not edit directly. -->\\n" +
       combinedDocs +
@@ -68,8 +97,9 @@ async function generateCombinedCliDocs() {
     // Write the updated content back to the target file
     fs.writeFileSync(targetDocFile, targetDocContent);
 
-    console.log(`✅ Combined CLI documentation has been generated at ${targetDocFile}`);
-
+    console.log(
+      `✅ Combined CLI documentation has been generated at ${targetDocFile}`,
+    );
   } catch (error) {
     console.error("Failed to generate combined CLI documentation:", error);
     process.exit(1);
@@ -77,4 +107,4 @@ async function generateCombinedCliDocs() {
 }
 
 // Run the script
-generateCombinedCliDocs(); 
+generateCombinedCliDocs();

package/sidebars.ts

@@ -24,6 +24,7 @@ const sidebars = {
         "academy/GetStarted/DefineToDoListDocumentModel",
         "academy/GetStarted/ImplementOperationReducers",
         "academy/GetStarted/BuildToDoListEditor",
+        "academy/GetStarted/SpecDrivenAI",
       ],
     },
     {

package/src/components/HomepageFeatures/index.tsx

@@ -1,7 +1,7 @@
 import clsx from "clsx";
 import Heading from "@theme/Heading";
 import Link from "@docusaurus/Link";
-import React from "react";
+import type React from "react";
 import styles from "./styles.module.css";
 
 type FeatureItem = {
@@ -16,11 +16,7 @@ const FeatureList: FeatureItem[] = [
     title: "Connect",
     imageSrc: require("@site/static/img/connect.png").default,
     docPath: "docs/academy/Architecture/PowerhouseArchitecture",
-    description: (
-      <>
-        Learn about the private contributor tool Connect
-      </>
-    ),
+    description: <>Learn about the private contributor tool Connect</>,
   },
   {
     title: "Switchboard",
@@ -32,29 +28,20 @@ const FeatureList: FeatureItem[] = [
     title: "Fusion",
     imageSrc: require("@site/static/img/fusion.png").default,
     docPath: "docs/academy/Architecture/PowerhouseArchitecture",
-    description: (
-      <>
-        Setup Fusion as your organizations dashboard
-      </>
-    ),
+    description: <>Setup Fusion as your organizations dashboard</>,
   },
   {
     title: "Renown",
     imageSrc: require("@site/static/img/renown.png").default,
-    docPath: "/docs/academy/MasteryTrack/BuildingUserExperiences/Authorization/RenownAuthenticationFlow",
-    description: (
-      <>
-        Dive into the customizable reputation system 
-      </>
-    ),
+    docPath:
+      "/docs/academy/MasteryTrack/BuildingUserExperiences/Authorization/RenownAuthenticationFlow",
+    description: <>Dive into the customizable reputation system</>,
   },
   {
     title: "Reactor",
     imageSrc: require("@site/static/img/reactor.png").default,
     docPath: "/docs/academy/Architecture/WorkingWithTheReactor",
-    description: (
-      <>Find out how a Powerhouse Reactor node works</>
-    ),
+    description: <>Find out how a Powerhouse Reactor node works</>,
   },
 ];
 
@@ -67,7 +54,9 @@ function Feature({ title, imageSrc, description, docPath }: FeatureItem) {
             <img src={imageSrc} alt={title} className={styles.featureImage} />
           </div>
           <div className={styles.featureText}>
-            <Heading as="h4" className={styles.featureTitle}>{title}</Heading>
+            <Heading as="h4" className={styles.featureTitle}>
+              {title}
+            </Heading>
             <p className={styles.featureDescription}>{description}</p>
           </div>
         </div>
@@ -84,34 +73,54 @@ export default function HomepageFeatures() {
         <div className={styles.learningPath}>
           {/* Get Started Card - Full Width */}
           <div className={`${styles.pathCard} ${styles.fullWidth}`}>
-            <div className={styles.cardHeader} style={{ justifyContent: 'center' }}>
+            <div
+              className={styles.cardHeader}
+              style={{ justifyContent: "center" }}
+            >
               <div className={styles.cardIconWrapper}>
                 <img src="/img/academy/icons/Flash.svg" alt="" />
               </div>
               <h3 className={styles.cardTitle}>Get started</h3>
             </div>
             <div className={styles.cardContent}>
-              <div style={{ maxWidth: '960px', margin: '0 auto', textAlign: 'center' }}>
-                <div style={{ marginBottom: '1.5rem' }}>
-                  <p style={{ fontSize: '1.1rem', marginBottom: '1rem' }}><strong>Welcome to Powerhouse!</strong></p>
-                  <p style={{ lineHeight: '1.6', color: '#444' }}>As a developer, you're about to dive into a <strong>unique ecosystem built to empower decentralized organizations</strong>. Powerhouse provides the software, infrastructure, and frameworks that enable scalable network organizations to operate efficiently.</p>
+              <div
+                style={{
+                  maxWidth: "960px",
+                  margin: "0 auto",
+                  textAlign: "center",
+                }}
+              >
+                <div style={{ marginBottom: "1.5rem" }}>
+                  <p style={{ fontSize: "1.1rem", marginBottom: "1rem" }}>
+                    <strong>Welcome to Powerhouse!</strong>
+                  </p>
+                  <p style={{ lineHeight: "1.6", color: "#444" }}>
+                    As a developer, you're about to dive into a{" "}
+                    <strong>
+                      unique ecosystem built to empower decentralized
+                      organizations
+                    </strong>
+                    . Powerhouse provides the software, infrastructure, and
+                    frameworks that enable scalable network organizations to
+                    operate efficiently.
+                  </p>
                 </div>
-                <div style={{ margin: '20px 0', textAlign: 'center' }}>
-                   <iframe
-                     src="https://drive.google.com/file/d/17dDKy-hQeI4ZlLiUZ4xhnXL4bDhJB0N-/preview"
-                     frameBorder="0"
-                     allow="autoplay; fullscreen"
-                     allowFullScreen
-                     title="Powerhouse Introduction Video"
-                     style={{
-                       width: '100%',
-                       maxWidth: '960px',
-                       aspectRatio: '16 / 9',
-                       borderRadius: '8px',
-                       display: 'block',
-                       margin: '0 auto'
-                     }}
-                   ></iframe>
+                <div style={{ margin: "20px 0", textAlign: "center" }}>
+                  <iframe
+                    src="https://drive.google.com/file/d/17dDKy-hQeI4ZlLiUZ4xhnXL4bDhJB0N-/preview"
+                    frameBorder="0"
+                    allow="autoplay; fullscreen"
+                    allowFullScreen
+                    title="Powerhouse Introduction Video"
+                    style={{
+                      width: "100%",
+                      maxWidth: "960px",
+                      aspectRatio: "16 / 9",
+                      borderRadius: "8px",
+                      display: "block",
+                      margin: "0 auto",
+                    }}
+                  ></iframe>
                 </div>
               </div>
             </div>
@@ -126,11 +135,16 @@ export default function HomepageFeatures() {
               <h3 className={styles.cardTitle}>New Link</h3>
             </div>
             <div className={styles.cardContent}>
-              <a href="@callmeT" className={styles.pathButton}>The Vision of Powerhouse</a>
+              <a href="@callmeT" className={styles.pathButton}>
+                The Vision of Powerhouse
+              </a>
             </div>
           </div>
 
-          <div className={styles.pathCard} style={{ border: '1px solid #4FC86F' }}>
+          <div
+            className={styles.pathCard}
+            style={{ border: "1px solid #4FC86F" }}
+          >
             <div className={styles.cardHeader}>
               <div className={styles.cardIconWrapper}>
                 <img src="/img/academy/icons/Create.svg" alt="" />
@@ -138,7 +152,12 @@ export default function HomepageFeatures() {
               <h3 className={styles.cardTitle}>Create</h3>
             </div>
             <div className={styles.cardContent}>
-              <a href="/docs/academy/GetStarted/CreateNewPowerhouseProject" className={styles.pathButton}>Build a Todo-list Document Model</a>
+              <a
+                href="/docs/academy/GetStarted/CreateNewPowerhouseProject"
+                className={styles.pathButton}
+              >
+                Build a Todo-list Document Model
+              </a>
             </div>
           </div>
 
@@ -150,12 +169,20 @@ export default function HomepageFeatures() {
               <h3 className={styles.cardTitle}>Document Model Theory</h3>
             </div>
             <div className={styles.cardContent}>
-              <a href="/docs/academy/GetStarted/DocumentModelTheory/WhatIsADocumentModel" className={styles.pathButton}>Deep Dive into Document Modelling</a>
+              <a
+                href="/docs/academy/GetStarted/DocumentModelTheory/WhatIsADocumentModel"
+                className={styles.pathButton}
+              >
+                Deep Dive into Document Modelling
+              </a>
             </div>
           </div>
 
           {/* Left Column Card with 2 buttons */}
-          <div className={styles.pathCard} style={{ border: '1px solid #4FC86F' }}>
+          <div
+            className={styles.pathCard}
+            style={{ border: "1px solid #4FC86F" }}
+          >
             <div className={styles.cardHeader}>
               <div className={styles.cardIconWrapper}>
                 <img src="/img/academy/icons/Editor.svg" alt="" />
@@ -163,36 +190,61 @@ export default function HomepageFeatures() {
               <h3 className={styles.cardTitle}>Build User Experiences</h3>
             </div>
             <div className={styles.cardContent}>
-              <a href="/docs/academy/GetStarted/BuildToDoListEditor" className={styles.pathButton}>Building a Todo-list Editor</a>
-              <a href="/docs/academy/BuildingUserExperiences/BuildingDocumentEditors" className={styles.pathButton}>Building Beautiful Document Editors</a>
-              <a href="/docs/academy/MasteryTrack/BuildingUserExperiences/BuildingADriveExplorer" className={styles.pathButton}>Building Custom Drive Explorers</a>
+              <a
+                href="/docs/academy/GetStarted/BuildToDoListEditor"
+                className={styles.pathButton}
+              >
+                Building a Todo-list Editor
+              </a>
+              <a
+                href="/docs/academy/BuildingUserExperiences/BuildingDocumentEditors"
+                className={styles.pathButton}
+              >
+                Building Beautiful Document Editors
+              </a>
+              <a
+                href="/docs/academy/MasteryTrack/BuildingUserExperiences/BuildingADriveExplorer"
+                className={styles.pathButton}
+              >
+                Building Custom Drive Explorers
+              </a>
             </div>
           </div>
 
           {/* Middle column with Union.svg */}
-          <div className={styles.middleColumn} style={{ 
-            display: 'flex', 
-            justifyContent: 'center', 
-            alignItems: 'flex-start', 
-            paddingTop: '-20px',
-            position: 'relative'
-          }}>
+          <div
+            className={styles.middleColumn}
+            style={{
+              display: "flex",
+              justifyContent: "center",
+              alignItems: "flex-start",
+              paddingTop: "-20px",
+              position: "relative",
+            }}
+          >
             <img src="/img/Union.svg" alt="Powerhouse Union" width="250" />
-            <div style={{ 
-              position: 'absolute',
-              top: '18px',
-              backgroundColor: 'white', 
-              padding: '8px 16px', 
-              borderRadius: '8px',
-              textAlign: 'center',
-              zIndex: 2,
-            }}>
-              <h3 className={styles.cardTitle} style={{ margin: 0 }}>Builder Track</h3>
+            <div
+              style={{
+                position: "absolute",
+                top: "18px",
+                backgroundColor: "white",
+                padding: "8px 16px",
+                borderRadius: "8px",
+                textAlign: "center",
+                zIndex: 2,
+              }}
+            >
+              <h3 className={styles.cardTitle} style={{ margin: 0 }}>
+                Builder Track
+              </h3>
             </div>
           </div>
 
           {/* Right Column Card with 3 buttons */}
-          <div className={styles.pathCard} style={{ border: '1px solid #4FC86F' }}>
+          <div
+            className={styles.pathCard}
+            style={{ border: "1px solid #4FC86F" }}
+          >
             <div className={styles.cardHeader}>
               <div className={styles.cardIconWrapper}>
                 <img src="/img/academy/icons/Data.svg" alt="" />
@@ -200,15 +252,33 @@ export default function HomepageFeatures() {
               <h3 className={styles.cardTitle}>Work with Data</h3>
             </div>
             <div className={styles.cardContent}>
-              <a href="//docs/academy/MasteryTrack/WorkWithData/UsingTheAPI" className={styles.pathButton}>Reading & Writing through the API</a>
-              <a href="/docs/academy/MasteryTrack/WorkWithData/WorkingWithSubgraphs" className={styles.pathButton}>Create your own Subgraph</a>
-              <a href="/docs/academy/WorkWithData/Analytics Engine/intro" className={styles.pathButton}>Using the Analytics Engine</a>
+              <a
+                href="//docs/academy/MasteryTrack/WorkWithData/UsingTheAPI"
+                className={styles.pathButton}
+              >
+                Reading & Writing through the API
+              </a>
+              <a
+                href="/docs/academy/MasteryTrack/WorkWithData/WorkingWithSubgraphs"
+                className={styles.pathButton}
+              >
+                Create your own Subgraph
+              </a>
+              <a
+                href="/docs/academy/WorkWithData/Analytics Engine/intro"
+                className={styles.pathButton}
+              >
+                Using the Analytics Engine
+              </a>
             </div>
           </div>
 
           {/* Launch Card - Full Width with 3 column buttons */}
           <div className={`${styles.pathCard} ${styles.fullWidth}`}>
-            <div className={styles.cardHeader} style={{ justifyContent: 'center' }}>
+            <div
+              className={styles.cardHeader}
+              style={{ justifyContent: "center" }}
+            >
               <div className={styles.cardIconWrapper}>
                 <img src="/img/academy/icons/Launch.svg" alt="" />
               </div>
@@ -216,9 +286,24 @@ export default function HomepageFeatures() {
             </div>
             <div className={styles.cardContent}>
               <div className={styles.buttonContainer}>
-                <a href="/docs/academy/MasteryTrack/Launch/PublishYourProject" className={styles.pathButton}>Package & Publish</a>
-                <a href="/docs/academy/Launch/LaunchYourBackend" className={styles.pathButton}>Launch Back-end</a>
-                <a href="/docs/academy/Launch/LaunchYourFrontend" className={styles.pathButton}>Launch Front-end</a>
+                <a
+                  href="/docs/academy/MasteryTrack/Launch/PublishYourProject"
+                  className={styles.pathButton}
+                >
+                  Package & Publish
+                </a>
+                <a
+                  href="/docs/academy/Launch/LaunchYourBackend"
+                  className={styles.pathButton}
+                >
+                  Launch Back-end
+                </a>
+                <a
+                  href="/docs/academy/Launch/LaunchYourFrontend"
+                  className={styles.pathButton}
+                >
+                  Launch Front-end
+                </a>
               </div>
             </div>
           </div>
@@ -232,11 +317,19 @@ export default function HomepageFeatures() {
                 <Link to={props.docPath} className={styles.featureLink}>
                   <div className={styles.featureContent}>
                     <div className={styles.featureImageWrapper}>
-                      <img src={props.imageSrc} alt={props.title} className={styles.featureImage} />
+                      <img
+                        src={props.imageSrc}
+                        alt={props.title}
+                        className={styles.featureImage}
+                      />
                     </div>
                     <div className={styles.featureText}>
-                      <Heading as="h4" className={styles.featureTitle}>{props.title}</Heading>
-                      <p className={styles.featureDescription}>{props.description}</p>
+                      <Heading as="h4" className={styles.featureTitle}>
+                        {props.title}
+                      </Heading>
+                      <p className={styles.featureDescription}>
+                        {props.description}
+                      </p>
                     </div>
                   </div>
                 </Link>

package/src/components/HomepageFeatures/styles.module.css

@@ -156,10 +156,9 @@
   color: var(--ifm-color-primary);
 }
 
-
 .learningPath {
   width: 100%;
-  padding: 3rem 0 0 0;  /* Added top padding */
+  padding: 3rem 0 0 0; /* Added top padding */
   margin-bottom: 3rem;
   display: grid;
   grid-template-columns: repeat(3, 1fr);