Updated folder/files names to match convention

components/docList/index.tsx

@@ -0,0 +1,75 @@
+import { Cards, Card } from "nextra/components";
+import { useEffect, useState } from "react";
+
+export const RawDocuments = async (folder) => {
+  return await fetch(`https://api.github.com/repos/nickmackenzie/dont-get-zohod/contents/pages/${folder}`)
+    .then(response => response.json())
+    .catch(error => {
+      console.error('Error fetching file list:', error);
+    });
+}
+
+export const DocumentCards = (props) => {
+  const [documents, setDocuments] = useState<any[]>([])
+
+  useEffect(() => {
+    const func = async () => {
+      const docList = []
+      const documents = await RawDocuments(props.folder)
+      for (const document of documents.filter(doc => doc.name.includes(".md"))) {
+        const metadata = await FetchContent(document.git_url);
+        docList.push({ ...document, ...metadata })
+      }
+      setDocuments(docList);
+    }
+    func()
+  }, [])
+
+  const cards = documents?.sort((a, b) => {
+    let ta = a.title.toLowerCase(), tb = b.title.toLowerCase();
+    //if {ta} is first else if {tb} is fist else 0
+    return ta < tb ? -1 : ta > tb ? 1 : 0
+  }).map((doc, index) => (
+    <Card
+      key={index}
+      title={doc.title}
+      href={doc.path.replace(/(pages\/)/, '').replace(/.[^\/\.]+$/, '')}
+    />
+  ))
+
+  return (
+    <Cards>
+      {cards}
+    </Cards>
+  )
+}
+
+const FetchContent = async (url) => {
+  return await fetch(url)
+    .then(response => response.json())
+    .then(data => extractMetadataFromMarkdown(Buffer.from(data.content, 'base64').toString()))
+    .catch(error => {
+      console.error('Error fetching file list:', error);
+    });
+}
+
+const extractMetadataFromMarkdown = (markdown) => {
+  const charactersBetweenGroupedHyphens = /^---([\s\S]*?)---/;
+  const metadataMatched = markdown.match(charactersBetweenGroupedHyphens);
+  const metadata = metadataMatched[1];
+
+  if (!metadata) {
+    return {};
+  }
+
+  const metadataLines = metadata.split("\n");
+  const metadataObject = metadataLines.reduce((accumulator, line) => {
+    const [key, ...value] = line.split(":").map((part) => part.trim());
+
+    if (key)
+      accumulator[key] = value[1] ? value.join(":") : value.join("");
+    return accumulator;
+  }, {});
+
+  return metadataObject;
+};

components/zoho-icons/index.jsx → components/zohoIcons/index.jsx

@@ -1,4 +1,4 @@
-import styles from "./zoho-icons.module.css";
+import styles from "./zohoIcons.module.css";
 
 const IconBase = (props) => {
   return <span className={styles.zicon} style={{ ...props.style }} />;

components/zoho-icons/zoho-icons.module.css → components/zohoIcons/zohoIcons.module.css

@@ -1,5 +1,5 @@
 .zicon{    
-    background: url(../../images/product-icons.svg) no-repeat;
+    background: url(../../images/productIcons.svg) no-repeat;
     background-size: 800px auto;
     width: 40px;
     height: 40px;

pages/Deluge/_meta.json

@@ -1,3 +1,6 @@
-{  
-  "TimeDates":"Time & Dates"
-}
+{
+  "buttons": "Buttons",
+  "lists": "Lists",
+  "strings": "Strings",
+  "timeDates": "Time & Dates"
+}

pages/_meta.json

@@ -2,23 +2,23 @@
   "index": {
     "title": "Introduction"
   },
-  "Contributing": "Contributing",
+  "contributing": "Contributing",
   "---": {
     "type": "separator"
   },
-  "Deluge": "Deluge",
+  "deluge": "Deluge",
   "-- Apps": {
     "type": "separator",
     "title": "Apps"
   },
-  "Catalyst": "Catalyst",
-  "Commerce": "Commerce",
-  "Creator": "Creator",
-  "CRM": "CRM",
-  "Desk": "Desk",
-  "Sites": "Sites",
+  "catalyst": "Catalyst",
+  "commerce": "Commerce",
+  "creator": "Creator",
+  "crm": "CRM",
+  "desk": "Desk",
+  "sites": "Sites",
   "-- Resources": {
     "type": "separator"
   },
-  "Resources": "Resources"
+  "resources": "Resources"
 }

pages/index.mdx

@@ -7,7 +7,7 @@ import {
   DeskIcon,
   DelugeIcon,
   SitesIcon,
-} from "../components/zoho-icons";
+} from "../components/zohoIcons";
 
 # Don't Get Zohod 🚫