Adds examples page

7 files changed, 179 insertions, 0 deletions

diff --git a/docs/src/components/Examples/Functions/capitalise.js b/docs/src/components/Examples/Functions/capitalise.js
new file mode 100644
index 000000000..39f7497b5
--- /dev/null
+++ b/docs/src/components/Examples/Functions/capitalise.js
@@ -0,0 +1,8 @@
+/**
+ * 
+ * @param {String} word  
+ * @returns Capitalised Word
+ */
+export default function capitalise(word) {
+    return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
+  }
\ No newline at end of file
diff --git a/docs/src/components/Examples/Functions/format-name.js b/docs/src/components/Examples/Functions/format-name.js
new file mode 100644
index 000000000..890275c9d
--- /dev/null
+++ b/docs/src/components/Examples/Functions/format-name.js
@@ -0,0 +1,24 @@
+import capitalise from './capitalise'
+
+/**
+ * 
+ * @param {String} name 
+ * @returns Formats the Template Name
+ */
+export default function formatName(name){
+    return name.includes('multiple')
+    ?
+    `${capitalise(name.split('-')[1])} ${capitalise(name.split('-')[0])}'s`
+    :
+    name
+        .split('-')
+        .map((str)=>(
+            str.replace('with','')
+        ))
+        .map((str)=>(
+            str.replace('framework','')
+        ))
+        .map((str)=>(capitalise(str)))
+        .join(' ')
+        .trim()
+}
\ No newline at end of file
diff --git a/docs/src/components/Examples/Functions/get-examples-data.js b/docs/src/components/Examples/Functions/get-examples-data.js
new file mode 100644
index 000000000..e206bab10
--- /dev/null
+++ b/docs/src/components/Examples/Functions/get-examples-data.js
@@ -0,0 +1,75 @@
+import glob from 'tiny-glob'
+import fs from 'fs'
+
+
+/**
+ * @returns list of templates's package.json from the examples folder
+ */
+async function getPkgJSON(){
+    let data = []
+    const paths = await glob('../examples/*/package.json',{filesOnly:true})
+    paths.map((files)=>{
+        let readFile =  fs.readFileSync(files)
+        let json = JSON.parse(readFile)
+        return data.push({...json})
+    })
+    return data
+}
+
+/**
+ * @returns list of templates readme from the examples folder
+ */
+async function getExamplesREADME(){
+    let data = []
+    const paths = await glob('../examples/*/README.md',{filesOnly:true})
+    paths.map( (files)=>{
+        const buffer = fs.readFileSync(files)
+        let text = buffer.toString()  
+        let fileName = files.split('/')[2]
+        data.push({fileName,text})
+    })
+    return data
+}
+
+/**
+ * @returns list of template data
+ */
+async function getTemplateData(){ 
+    let data = []
+    const pkgJSONS =  await getPkgJSON()
+    pkgJSONS.map((pkg)=>{
+        let {name} = pkg
+        name = name.replace('@example/','')
+        let obj = {
+            name,
+            pkgJSON: pkg,
+            readme:undefined,
+        }
+        data.push(obj)
+    })
+    return data
+}
+
+
+/**
+ * 
+ * @returns Array of Template objects, 
+ */
+async function templateData() {
+    let readmeData = await getExamplesREADME()
+    let templateData = await getTemplateData()
+    let arr = templateData.map((obj,i)=>{
+        let {name} = obj
+        readmeData.map((file)=>{
+            let {fileName,text} = file
+            if(name === fileName)
+            obj.readme = text
+        })
+
+        return obj
+    })
+    return arr
+}
+
+export default templateData
+
diff --git a/docs/src/components/Examples/Functions/get-examples-headers.js b/docs/src/components/Examples/Functions/get-examples-headers.js
new file mode 100644
index 000000000..9b75d2e5d
--- /dev/null
+++ b/docs/src/components/Examples/Functions/get-examples-headers.js
@@ -0,0 +1,27 @@
+// import {templatesList as data} from './templatesList.ts'
+import templateData from './get-examples-data.js'
+const data = await templateData()
+console.log(data)
+
+// const examplesHeaders = data.map(section=>{
+//     let arr = []
+//     let obj = {
+//         depth:2,
+//         slug:section.title,
+//         text:section.title,
+//     }
+//     arr.push(obj)
+    
+//     section.children.map(example=>{
+//         let obj={
+//         depth:3,
+//         slug:example.text,
+//         text:example.text,
+//         }
+//         arr.push(obj)
+//     })
+//     return [...arr]
+// }).flat(2) 
+
+
+// export default examplesHeaders
\ No newline at end of file
diff --git a/docs/src/components/Examples/Functions/get-hero-img.js b/docs/src/components/Examples/Functions/get-hero-img.js
new file mode 100644
index 000000000..8ed1ac9b3
--- /dev/null
+++ b/docs/src/components/Examples/Functions/get-hero-img.js
@@ -0,0 +1,18 @@
+import fs from 'node:fs/promises'
+import randomIndex from './random-index'
+
+
+/**
+ * getHeroImg
+ * @returns url of random Hero Image from './public/images'
+ */
+export default async function getHeroImg(){
+    try {
+        const data =[]
+        const paths =await fs.readdir('./public/images',{filesOnly:true})
+        paths.map(path=>data.push(`/images/${path}`))
+        return data[randomIndex(paths.length)]
+    } catch (error) {
+        console.log(error)
+    }
+}
diff --git a/docs/src/components/Examples/Functions/get-thumbnail-icon.js b/docs/src/components/Examples/Functions/get-thumbnail-icon.js
new file mode 100644
index 000000000..21ae3b673
--- /dev/null
+++ b/docs/src/components/Examples/Functions/get-thumbnail-icon.js
@@ -0,0 +1,18 @@
+import fs from 'node:fs/promises'
+import randomIndex from './random-index.js'
+
+
+/**
+ * getThumbnailIcon
+ * @returns url of random Icon Image from './public/icons'
+ */
+export default async function getThumbnailIcon(){
+    try {
+        const data =[]
+        const paths =await fs.readdir('./public/icons/space-icons-rounded-small',{filesOnly:true})
+        paths.map(path=>data.push(`/icons/space-icons-rounded-small/${path}`))
+        return data[randomIndex(paths.length)]
+    } catch (error) {
+        console.log(`Error Generating Thumbnail : ${error}`)
+    }
+}
diff --git a/docs/src/components/Examples/Functions/random-index.js b/docs/src/components/Examples/Functions/random-index.js
new file mode 100644
index 000000000..a55487da5
--- /dev/null
+++ b/docs/src/components/Examples/Functions/random-index.js
@@ -0,0 +1,9 @@
+/**
+ * Random Index from Array
+ * @param {Number} length - Length of Array
+ * @returns Random Index from the Array
+ */
+
+const randomIndex = (length) => Math.round(Math.random() * (0-length)) + length - 1
+
+export default randomIndex
\ No newline at end of file