Merge pull request #7 from stateful/deep-deno

Works end-to-end, more work to do

package.json

@@ -89,6 +89,14 @@
           "stateful.runme/vercel-stdout"
         ]
       },
+      {
+        "id": "runme-deno-renderer",
+        "entrypoint": "./out/client.js",
+        "displayName": "runme deno stdout",
+        "mimeTypes": [
+          "stateful.runme/deno-stdout"
+        ]
+      },
       {
         "id": "runme-html-renderer",
         "entrypoint": "./out/client.js",
@@ -174,6 +182,7 @@
     "readable-stream": "^4.2.0",
     "svelte": "^3.50.1",
     "tmp-promise": "^3.0.3",
+    "undici": "^5.11.0",
     "vercel": "^28.4.4",
     "vite": "^3.1.4",
     "vue": "^3.2.40",

src/client/components/deno.ts

@@ -0,0 +1,82 @@
+import { LitElement, css, html } from 'lit'
+import { customElement, property } from 'lit/decorators.js'
+
+import { Deployment, Project } from '../../utils/deno/api_types'
+
+@customElement('deno-output')
+export class DenoOutput extends LitElement {
+  // Define scoped styles right with your component, in plain CSS
+  static styles = css`
+    :host {
+      display: block;
+      font-family: Arial
+    }
+
+    section {
+      padding: 10px;
+      border: 1px solid #444;
+      border-radius: 5px;
+      display: flex;
+      flex-direction: row;
+      gap: 50px;
+      align-items: flex-start;
+    }
+
+    img {
+      width: 100px;
+      padding: 20px;
+    }
+
+    h4 {
+      margin-bottom: 0;
+    }
+  `
+
+  // Declare reactive properties
+  @property({ type: Object })
+  content?: any
+
+  // Render the UI as a function of component state
+  render() {
+    if (!this.content) {
+      return html`⚠️ Ups! Something went wrong displaying the result!`
+    }
+
+    const deployed: boolean = this.content.deployed
+    const project: Project = this.content.project
+    const deployments: Deployment[] = this.content.deployments
+
+    if (!project.name || (deployments ?? []).length < 0) {
+      return html`Deploying to Deno...`
+    }
+
+    const deployment = deployments[0]
+    const len = deployments.length
+    const more = len > 1 ? deployments.slice(1, len-1) : []
+
+    return html`<section>
+      <img src="https://www.svgrepo.com/show/378789/deno.svg">
+      <div>
+        <h4>Deployment</h4>
+        ${deployed ? html`
+          <vscode-link href="https://${deployment.domainMappings[0].domain}">
+            ${deployment.domainMappings[0].domain}
+          </vscode-link>
+        ` : html`Pending` }
+        <h4>Project</h4>
+        <vscode-link href="https://dash.deno.com/projects/${project.name}/deployments">${project.name}</vscode-link>
+      </div>
+      <div>
+        <h4>Created At</h4>
+        ${deployed ? (new Date(deployment.createdAt)).toString() : 'Pending' }
+        <h4>Status</h4>
+        ${deployed ?
+          html`Ready <button>🚀 Promote to Prod</button>`
+        : 'Deploying'}
+      </div>
+      ${more.forEach(m => {
+        return html`<div>${m.domainMappings[0].domain}</div>`
+      })}
+    </section>`
+  }
+}

src/client/components/index.ts

@@ -2,5 +2,6 @@ import '@vscode/webview-ui-toolkit/dist/index-rollup.js'
 
 export * from './output'
 export * from './vercel'
+export * from './deno'
 export * from './vite'
 export * from './svelte'

src/client/index.ts

@@ -25,6 +25,11 @@ export const activate: ActivationFunction = () => ({
         vercelElem.setAttribute('content', JSON.stringify(output))
         element.appendChild(vercelElem)
         break
+      case OutputType.deno:
+        const denoElem = document.createElement('deno-output')
+        denoElem.setAttribute('content', JSON.stringify(output))
+        element.appendChild(denoElem)
+        break
       case OutputType.html:
         const tag = output.isSvelte ? 'svelte-component' : 'vite-output'
         const viteElem = document.createElement(tag)

src/constants.ts

@@ -6,6 +6,7 @@
 export enum OutputType {
   shell = 'stateful.runme/shell-stdout',
   vercel = 'stateful.runme/vercel-stdout',
+  deno = 'stateful.runme/deno-stdout',
   html = 'stateful.runme/html-stdout',
   script = 'stateful.runme/script-stdout',
   error = 'error'

src/extension/executors/deno.ts

@@ -0,0 +1,12 @@
+import { ExtensionContext, NotebookCellExecution, TextDocument } from "vscode"
+
+import { bash } from './task'
+import { deploy } from "./deno/deploy"
+
+export async function deno (
+  context: ExtensionContext,
+  exec: NotebookCellExecution,
+  doc: TextDocument
+): Promise<boolean> {
+  return Promise.all([bash(context, exec, doc), deploy(exec)]).then(([a, b]) => a && b)
+}

src/extension/executors/deno/deploy.ts

@@ -0,0 +1,78 @@
+import { NotebookCellOutput, NotebookCellOutputItem, NotebookCellExecution, window } from 'vscode'
+
+import { OutputType } from '../../../constants'
+import type { CellOutput } from '../../../types'
+import { ENV_STORE } from '../../constants'
+import { API } from '../../../utils/deno/api'
+
+export async function deploy (
+  exec: NotebookCellExecution,
+  // doc: TextDocument,
+  // argv: any
+): Promise<boolean> {
+  let token = ENV_STORE.get('DENO_ACCESS_TOKEN')
+
+  try {
+    if (!token) {
+      token = await window.showInputBox({
+        title: 'Deno Access Token',
+        prompt: 'Please enter a valid access token to run a Deno deployment.'
+      })
+    }
+
+    if (!token) {
+      throw new Error('No token supplied')
+    }
+
+    const start = new Date()
+
+    const denoAPI = API.fromToken(token)
+    const projects = await denoAPI.getProjects()
+
+    if ((projects ?? []).length < 1) {
+      throw new Error('No deno projects available')
+    }
+
+    let deployed = false
+    let iteration = 0
+    let created = start
+    while (created <= start && iteration < 30) {
+      const deployments = await denoAPI.getDeployments(projects![0].id)
+      if ((deployments || []).length > 0) {
+        created = new Date(deployments![0].createdAt) ?? start
+      }
+
+      deployed = created > start
+      exec.replaceOutput(new NotebookCellOutput([
+        NotebookCellOutputItem.json(<CellOutput>{
+            type: OutputType.deno,
+            output: { project: projects![0], deployments, deployed },
+          }, OutputType.deno),
+        ], { deno: { deploy: true } }))
+
+      // keep going slower after 20 loops
+      const timeout = 1000 + Math.max(0, iteration - 20) * 1000
+      await new Promise<void>(resolve => { setTimeout(() => { resolve() }, timeout) })
+
+      iteration++
+    }
+    if (!deployed) {
+      exec.replaceOutput(new NotebookCellOutput([
+        NotebookCellOutputItem.json(<CellOutput>{
+          type: 'error',
+          output: 'Timed out'
+        }, OutputType.deno)
+      ]))
+    }
+  } catch (err: any) {
+    exec.replaceOutput(new NotebookCellOutput([
+      NotebookCellOutputItem.json(<CellOutput>{
+        type: 'error',
+        output: err.message
+      }, OutputType.deno)
+    ]))
+    return false
+  }
+
+  return true
+}

src/extension/executors/deno/index.ts

@@ -0,0 +1 @@
+export * from './deploy'

src/extension/executors/index.ts

@@ -1,6 +1,7 @@
 import { sh, bash } from './task'
 import { vercel } from './vercel'
+import { deno } from './deno'
 import { html } from './html'
 import { js, jsx, ts, tsx } from './script'
 
-export default { sh, bash, vercel, html, js, jsx, ts, tsx }
+export default { sh, bash, vercel, html, js, jsx, ts, tsx, deno }

src/extension/executors/task.ts

@@ -1,9 +1,10 @@
 import path from 'node:path'
 import { writeFile, chmod } from 'node:fs/promises'
 
+
 import {
   Task, TextDocument, NotebookCellExecution, TaskScope, tasks,
-  window, TerminalOptions, commands, ExtensionContext, TaskRevealKind, TaskPanelKind,
+  window, TerminalOptions, ExtensionContext, TaskRevealKind, TaskPanelKind,
   // CustomExecution,
   // Pseudoterminal,
   ShellExecution
@@ -48,6 +49,7 @@ async function taskExecutor(
     const placeHolder = hasStringValue ? ph.slice(1) : ph
     stateEnv[key] = populateEnvVar(await window.showInputBox({
       title: `Set Environment Variable "${key}"`,
+      ignoreFocusOut: true,
       placeHolder,
       prompt: 'Your shell script wants to set some environment variables, please enter them here.',
       ...(hasStringValue ? { value: placeHolder } : {})
@@ -121,7 +123,7 @@ async function taskExecutor(
     reveal: isBackground ? TaskRevealKind.Always : TaskRevealKind.Always,
     panel: isBackground ? TaskPanelKind.Dedicated : TaskPanelKind.Shared
   }
-  await commands.executeCommand('workbench.action.terminal.clear')
+  // await commands.executeCommand('workbench.action.terminal.clear')
   const execution = await tasks.executeTask(taskExecution)
 
   const p = new Promise<number>((resolve) => {

src/extension/kernel.ts

@@ -37,8 +37,14 @@ export class Kernel implements vscode.Disposable {
     const exec = this.controller.createNotebookCellExecution(cell)
 
     exec.start(Date.now())
-    const languageId = runningCell.languageId as keyof typeof executor
-    const successfulCellExecution = await executor[languageId](this.#context, exec, runningCell)
+    const execKey = this.getKey(runningCell)
+    const successfulCellExecution = await executor[execKey](this.#context, exec, runningCell)
     exec.end(successfulCellExecution)
   }
+
+  private getKey(runningCell: vscode.TextDocument) : keyof typeof executor {
+    const text = runningCell.getText()
+    if (text.indexOf('deployctl deploy') > -1) { return "deno" }
+    return runningCell.languageId as keyof typeof executor
+  }
 }

src/types.ts

@@ -21,6 +21,7 @@ export type OutputTypes = (
   'stateful.runme/script-stdout' |
   'stateful.runme/shell-stdout' |
   'stateful.runme/vercel-stdout' |
+  'stateful.runme/deno-stdout' |
   'stateful.runme/html-stdout'
 )
 export interface CellOutput {