@freestyle-sh/with-vscode 0.0.1

package/README.md

@@ -0,0 +1,102 @@
+# @freestyle-sh/with-vscode
+
+[VS Code](https://github.com/coder/code-server) in the browser for [Freestyle](https://freestyle.sh) VMs, powered by code-server.
+
+## Installation
+
+```bash
+npm install @freestyle-sh/with-vscode freestyle-sandboxes
+```
+
+## Usage
+
+```typescript
+import { freestyle, VmSpec } from "freestyle-sandboxes";
+import { VmVscode } from "@freestyle-sh/with-vscode";
+
+const domain = `${crypto.randomUUID()}.style.dev`;
+
+const { vm } = await freestyle.vms.create({
+  snapshot: new VmSpec({
+    with: {
+      vscode: new VmVscode(),
+    },
+  }),
+  domains: [
+    {
+      domain,
+      vmPort: 8080,
+    },
+  ],
+});
+
+console.log(`VS Code available at: https://${domain}`);
+```
+
+### With Extensions
+
+```typescript
+const { vm } = await freestyle.vms.create({
+  snapshot: new VmSpec({
+    with: {
+      vscode: new VmVscode({
+        workdir: "/root/project",
+        extensions: ["esbenp.prettier-vscode", "dbaeumer.vscode-eslint"],
+      }),
+    },
+  }),
+  domains: [
+    {
+      domain,
+      vmPort: 8080,
+    },
+  ],
+});
+```
+
+## Options
+
+```typescript
+new VmVscode({
+  port: 8080,              // Optional: port to run on (default: 8080)
+  workdir: "/root",        // Optional: folder to open (default: /root)
+  user: "root",            // Optional: user to run as (default: root)
+  extensions: [],          // Optional: VS Code extensions to pre-install
+})
+```
+
+| Option | Type | Default | Description |
+|--------|------|---------|-------------|
+| `port` | `number` | `8080` | Port to run code-server on |
+| `workdir` | `string` | `"/root"` | Folder to open in VS Code |
+| `user` | `string` | `"root"` | User to run code-server as |
+| `extensions` | `string[]` | `[]` | VS Code extensions to pre-install (e.g. `["esbenp.prettier-vscode"]`) |
+
+## API
+
+### `vm.vscode.route({ domain })`
+
+Expose code-server publicly via Freestyle domain routing.
+
+```typescript
+await vm.vscode.route({ domain: "my-editor.example.com" });
+```
+
+### `vm.vscode.port`
+
+Returns the configured port number.
+
+## How It Works
+
+The package uses systemd services to install and run code-server during VM creation:
+
+1. Downloads code-server v4.100.3 from GitHub releases
+2. Installs any specified VS Code extensions
+3. Starts code-server as a systemd service with auto-restart
+
+Authentication is disabled by default. Code-server listens on all interfaces (0.0.0.0).
+
+## Documentation
+
+- [Freestyle Documentation](https://docs.freestyle.sh)
+- [code-server Documentation](https://coder.com/docs/code-server)

package/dist/index.d.ts

@@ -0,0 +1,39 @@
+import { VmWith, VmWithInstance, VmSpec } from 'freestyle-sandboxes';
+
+type VmVscodeOptions = {
+    /** Port to run code-server on (default: 8080) */
+    port?: number;
+    /** Folder to open in VS Code (default: /root) */
+    workdir?: string;
+    /** User to run code-server as (default: root) */
+    user?: string;
+    /** VS Code extensions to pre-install (e.g. ["esbenp.prettier-vscode"]) */
+    extensions?: string[];
+};
+type VmVscodeResolvedOptions = {
+    port: number;
+    workdir: string;
+    user: string;
+    extensions: string[];
+};
+declare class VmVscode extends VmWith<VmVscodeInstance> {
+    options: VmVscodeResolvedOptions;
+    constructor(options?: VmVscodeOptions);
+    configureSnapshotSpec(spec: VmSpec): VmSpec;
+    configureSpec(spec: VmSpec): VmSpec;
+    private composeCodeServerSpec;
+    createInstance(): VmVscodeInstance;
+    installServiceName(): string;
+}
+declare class VmVscodeInstance extends VmWithInstance {
+    builder: VmVscode;
+    readonly port: number;
+    constructor(builder: VmVscode);
+    /** Expose code-server publicly via Freestyle routing */
+    route({ domain }: {
+        domain: string;
+    }): Promise<void>;
+}
+
+export { VmVscode, VmVscodeInstance };
+export type { VmVscodeOptions, VmVscodeResolvedOptions };

package/dist/index.js

@@ -0,0 +1,134 @@
+import { VmWith, VmSpec, VmWithInstance } from 'freestyle-sandboxes';
+
+const CODE_SERVER_VERSION = "4.100.3";
+class VmVscode extends VmWith {
+  options;
+  constructor(options) {
+    super();
+    this.options = {
+      port: options?.port ?? 8080,
+      workdir: options?.workdir ?? "/root",
+      user: options?.user ?? "root",
+      extensions: options?.extensions ?? []
+    };
+  }
+  configureSnapshotSpec(spec) {
+    return this.composeCodeServerSpec(spec);
+  }
+  configureSpec(spec) {
+    return this.composeCodeServerSpec(spec);
+  }
+  composeCodeServerSpec(spec) {
+    const { port, workdir, user, extensions } = this.options;
+    const installScript = `#!/bin/bash
+set -e
+
+CODE_SERVER_VERSION="${CODE_SERVER_VERSION}"
+mkdir -p /usr/local/bin /tmp/code-server-install
+cd /tmp/code-server-install
+curl -fsSL -o code-server.tar.gz "https://github.com/coder/code-server/releases/download/v\${CODE_SERVER_VERSION}/code-server-\${CODE_SERVER_VERSION}-linux-amd64.tar.gz"
+tar -xzf code-server.tar.gz
+cp code-server-\${CODE_SERVER_VERSION}-linux-amd64/bin/code-server /usr/local/bin/code-server
+cp -r code-server-\${CODE_SERVER_VERSION}-linux-amd64/lib /usr/local/lib/code-server
+chmod +x /usr/local/bin/code-server
+rm -rf /tmp/code-server-install
+code-server --version
+`;
+    const installExtensionsScript = extensions.length > 0 ? `#!/bin/bash
+set -e
+${extensions.map((ext) => `/usr/local/bin/code-server --install-extension ${ext}`).join("\n")}
+` : null;
+    const configYaml = [
+      `bind-addr: 0.0.0.0:${port}`,
+      `auth: none`,
+      `cert: false`,
+      `disable-telemetry: true`,
+      `disable-update-check: true`
+    ].join("\n");
+    const args = [
+      `/usr/local/bin/code-server`,
+      `--config /etc/code-server/config.yaml`,
+      workdir
+    ];
+    const serviceAfter = installExtensionsScript ? [
+      "install-code-server.service",
+      "install-code-server-extensions.service"
+    ] : ["install-code-server.service"];
+    return this.composeSpecs(
+      spec,
+      new VmSpec({
+        additionalFiles: {
+          "/etc/code-server/config.yaml": { content: configYaml },
+          "/opt/install-code-server.sh": { content: installScript },
+          ...installExtensionsScript ? {
+            "/opt/install-code-server-extensions.sh": {
+              content: installExtensionsScript
+            }
+          } : {}
+        },
+        systemd: {
+          services: [
+            {
+              name: "install-code-server",
+              mode: "oneshot",
+              deleteAfterSuccess: true,
+              exec: ["bash /opt/install-code-server.sh"],
+              timeoutSec: 120
+            },
+            ...installExtensionsScript ? [
+              {
+                name: "install-code-server-extensions",
+                mode: "oneshot",
+                deleteAfterSuccess: true,
+                exec: ["bash /opt/install-code-server-extensions.sh"],
+                after: ["install-code-server.service"],
+                timeoutSec: 300
+              }
+            ] : [],
+            {
+              name: "code-server",
+              mode: "service",
+              exec: [args.join(" ")],
+              user,
+              workdir,
+              restartPolicy: {
+                policy: "always",
+                restartSec: 2
+              },
+              after: serviceAfter
+            }
+          ]
+        }
+      })
+    );
+  }
+  createInstance() {
+    return new VmVscodeInstance(this);
+  }
+  installServiceName() {
+    return "install-code-server.service";
+  }
+}
+class VmVscodeInstance extends VmWithInstance {
+  builder;
+  port;
+  constructor(builder) {
+    super();
+    this.builder = builder;
+    this.port = builder.options.port;
+  }
+  /** Expose code-server publicly via Freestyle routing */
+  async route({ domain }) {
+    const freestyle = this.vm._freestyle;
+    console.log(
+      `Routing code-server on vm ${this.vm.vmId} at port ${this.port} to domain ${domain}`
+    );
+    await freestyle.domains.mappings.create({
+      domain,
+      vmId: this.vm.vmId,
+      vmPort: this.port
+    });
+  }
+}
+
+export { VmVscode, VmVscodeInstance };

package/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "@freestyle-sh/with-vscode",
+  "version": "0.0.1",
+  "private": false,
+  "dependencies": {
+    "freestyle-sandboxes": "^0.1.14"
+  },
+  "devDependencies": {
+    "@types/node": "^22.0.0",
+    "pkgroll": "^2.11.2",
+    "typescript": "^5.8.3"
+  },
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "source": "./src/index.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "pkgroll"
+  }
+}