Wget option Added along with a new dropdown menu

functions/code.js

@@ -0,0 +1,35 @@
+// Below imports are defined in
+// `external_node_modules` of [functions] in netlify.toml
+// They are required for this function to run
+
+import { v4 as uuidv4 } from 'uuid'
+import JSZip from 'jszip'
+import { pushToGitHub } from './utils'
+
+const nbUid = uuidv4()
+const repoOwner = process.env.VUE_APP_GH_USER
+const repo = process.env.VUE_APP_GH_REPO
+
+// This function is the one Netlify function runs on
+// https://docs.netlify.com/functions/build-with-javascript/#synchronous-function-format
+exports.handler = async function (event, _) {
+  // event is a JSON object
+  const data = JSON.parse(event.body)
+  const zip = new JSZip()
+  const code = data.code
+  const template = `ignite-${data.template}`
+
+  // As usual from Download component,
+  // we will zip the files and
+  // generate a base64 format for pushing to GitHub
+  // with Octokit.
+  for (const filename in code) {
+    zip.file(filename, code[filename])
+  }
+  const content = await zip.generateAsync({ type: 'base64' })
+  const zipRes = await pushToGitHub(content, `${template}.zip`, nbUid)
+  return {
+    statusCode: 200,
+    body: zipRes
+  }
+}

functions/colab.js

@@ -3,41 +3,13 @@
 // They are required for this function to run
 
 import { v4 as uuidv4 } from 'uuid'
-import { Octokit } from '@octokit/core'
 import JSZip from 'jszip'
+import { pushToGitHub } from './utils'
 
 const nbUid = uuidv4()
 const repoOwner = process.env.VUE_APP_GH_USER
 const repo = process.env.VUE_APP_GH_REPO
 
-/**
- * Create a file on GitHub with Octokit.
- * @param {string} content
- * @param {string} filename
- * @returns download_url
- */
-async function pushToGitHub(content, filename) {
-  const octokit = new Octokit({
-    auth: process.env.VUE_APP_GH_TOKEN
-  })
-  try {
-    const res = await octokit.request(
-      'PUT /repos/{owner}/{repo}/contents/{path}',
-      {
-        owner: repoOwner,
-        repo: repo,
-        path: `nbs/${nbUid}/${filename}`,
-        message: `nb: add ${nbUid}`,
-        content: content
-      }
-    )
-    // the download url is raw url - https://raw.githubusercontent.com/...
-    return res.data.content.download_url
-  } catch (e) {
-    console.error(e)
-  }
-}
-
 // This function is the one Netlify function runs on
 // https://docs.netlify.com/functions/build-with-javascript/#synchronous-function-format
 exports.handler = async function (event, _) {
@@ -56,7 +28,7 @@ exports.handler = async function (event, _) {
     zip.file(filename, code[filename])
   }
   const content = await zip.generateAsync({ type: 'base64' })
-  const zipRes = await pushToGitHub(content, `${template}.zip`)
+  const zipRes = await pushToGitHub(content, `${template}.zip`, nbUid)
 
   const title = template
     .replace('ignite-', '')
@@ -100,7 +72,11 @@ exports.handler = async function (event, _) {
     ]
   }
   // Create the notebook on GitHub
-  await pushToGitHub(Buffer.from(JSON.stringify(nb)).toString('base64'), nbName)
+  await pushToGitHub(
+    Buffer.from(JSON.stringify(nb)).toString('base64'),
+    nbName,
+    nbUid
+  )
 
   const colabLink = `https://colab.research.google.com/github/${repoOwner}/${repo}/blob/main/nbs/${nbUid}/${nbName}`
   return {

functions/utils.js

@@ -0,0 +1,35 @@
+// Below imports are defined in
+// `external_node_modules` of [functions] in netlify.toml
+// They are required for this function to run
+
+import { Octokit } from '@octokit/core'
+
+const repoOwner = process.env.VUE_APP_GH_USER
+const repo = process.env.VUE_APP_GH_REPO
+
+/**
+ * Create a file on GitHub with Octokit.
+ * @param {string} content
+ * @param {string} filename
+ * @returns download_url
+ */
+export async function pushToGitHub(content, filename, nbUid) {
+  const octokit = new Octokit({
+    auth: process.env.VUE_APP_GH_TOKEN
+  })
+  try {
+    const res = await octokit.request(
+      'PUT /repos/{owner}/{repo}/contents/{path}',
+      {
+        owner: repoOwner,
+        repo: repo,
+        path: `nbs/${nbUid}/${filename}`,
+        message: `nb: add ${nbUid}`,
+        content: content
+      }
+    )
+    return res.data.content.download_url
+  } catch (e) {
+    console.error(e)
+  }
+}

index.html

@@ -54,6 +54,10 @@
       href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap"
       rel="stylesheet"
     />
+    <link
+      href="https://fonts.googleapis.com/icon?family=Material+Icons"
+      rel="stylesheet"
+    />
     <title>Code Generator</title>
   </head>
   <body>

netlify.toml

@@ -8,7 +8,7 @@
 
 [dev]
   publish = "dist/"
-  targetPort = 3000
+  targetPort = 5000
 
 [functions]
   directory = "functions"

src/components/CodeBlock.vue

@@ -124,7 +124,6 @@ div[class*='language-']::before,
   position: absolute;
   top: 0;
   bottom: 0;
-  z-index: 3;
   border-right: 1px solid rgba(0, 0, 0, 0.5);
   padding: 1.25rem 0;
   width: 3.5rem;
@@ -140,7 +139,6 @@ div[class*='language-']::before,
 .line-numbers {
   position: relative;
   font-size: var(--code-font-size);
-  z-index: 4;
   user-select: none;
 }