Address code review feedback

Copilot · mikebarkmin · Copilot · commit feff4fd80c1e · 2025-11-01T23:26:20.000Z
- Remove unused CSS options from build script
- Add proper type definition for VS Code API instead of using 'any'
- Use crypto.randomBytes() for secure nonce generation instead of Math.random()
- Add example.learningmap file for testing

Co-authored-by: mikebarkmin &lt;2592379+mikebarkmin@users.noreply.github.com&gt;
diff --git a/platforms/vscode/.vscodeignore b/platforms/vscode/.vscodeignore
@@ -6,3 +6,5 @@ src/**
 tsconfig.json
 node_modules/**
 *.map
+example.learningmap
+DEVELOPMENT.md
diff --git a/platforms/vscode/example.learningmap b/platforms/vscode/example.learningmap
@@ -0,0 +1,46 @@
+{
+  "nodes": [
+    {
+      "id": "1",
+      "type": "topic",
+      "position": {
+        "x": 250,
+        "y": 100
+      },
+      "data": {
+        "state": "unlocked",
+        "label": "Getting Started",
+        "description": "Learn the basics of creating learningmaps"
+      }
+    },
+    {
+      "id": "2",
+      "type": "topic",
+      "position": {
+        "x": 250,
+        "y": 250
+      },
+      "data": {
+        "state": "locked",
+        "label": "Advanced Topics",
+        "description": "Deep dive into advanced features"
+      }
+    }
+  ],
+  "edges": [
+    {
+      "id": "e1-2",
+      "source": "1",
+      "target": "2"
+    }
+  ],
+  "settings": {
+    "title": "Sample Learningmap",
+    "background": {
+      "color": "#ffffff"
+    }
+  },
+  "version": 1,
+  "type": "learningmap",
+  "source": "vscode-extension"
+}
diff --git a/platforms/vscode/src/LearningmapEditorProvider.ts b/platforms/vscode/src/LearningmapEditorProvider.ts
@@ -1,4 +1,5 @@
 import * as vscode from 'vscode';
+import * as crypto from 'crypto';
 
 /**
  * Provider for learningmap custom editor.
@@ -138,10 +139,5 @@ export class LearningmapEditorProvider implements vscode.CustomTextEditorProvide
 }
 
 function getNonce() {
-  let text = '';
-  const possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
-  for (let i = 0; i < 32; i++) {
-    text += possible.charAt(Math.floor(Math.random() * possible.length));
-  }
-  return text;
+  return crypto.randomBytes(16).toString('hex');
 }
diff --git a/platforms/vscode/src/webview.tsx b/platforms/vscode/src/webview.tsx
@@ -3,8 +3,15 @@ import { createRoot } from 'react-dom/client';
 import { LearningMapEditor, useEditorStore, RoadmapData } from '@learningmap/learningmap';
 import '@learningmap/learningmap/index.css';
 
-// VS Code API
-declare const acquireVsCodeApi: any;
+// VS Code API type
+interface VSCodeApi {
+  postMessage(message: any): void;
+  setState(state: any): void;
+  getState(): any;
+}
+
+// VS Code API - this is provided by VS Code in webview context
+declare function acquireVsCodeApi(): VSCodeApi;
 const vscode = acquireVsCodeApi();
 
 interface VSCodeMessage {
diff --git a/scripts/build-vscode.mjs b/scripts/build-vscode.mjs
@@ -55,18 +55,6 @@ const webviewOptions = {
   },
 };
 
-// Build CSS separately
-const cssOptions = {
-  ...commonOptions,
-  entryPoints: [
-    path.join(__dirname, "../packages/learningmap/dist/index.css"),
-  ],
-  outfile: path.join(__dirname, "../platforms/vscode/dist/webview.css"),
-  loader: {
-    ".css": "copy",
-  },
-};
-
 async function build() {
   try {
     if (isWatch) {
