Open sketch source

apps/desktop/src/main/handlers/openSketchSourceFile.ts

@@ -0,0 +1,37 @@
+import path from 'path'
+import fs from 'fs'
+import { shell } from 'electron'
+
+/**
+ * Opens the source file (index.ts or index.js) for a sketch module in the default app.
+ * @param sketchesDir The absolute path to the sketches directory
+ * @param moduleId The sketch's moduleId
+ * @returns Promise<{ success: boolean; error?: string }>
+ */
+export const openSketchSourceFile = async (
+  sketchesDir: string,
+  moduleId: string,
+): Promise<{ success: boolean; error?: string }> => {
+  try {
+    const tsPath = path.join(sketchesDir, moduleId, 'index.ts')
+    const jsPath = path.join(sketchesDir, moduleId, 'index.js')
+    let filePath = tsPath
+    if (fs.existsSync(tsPath)) {
+      filePath = tsPath
+    } else if (fs.existsSync(jsPath)) {
+      filePath = jsPath
+    } else {
+      return { success: false, error: 'Source file not found' }
+    }
+    const openResult = await shell.openPath(filePath)
+    if (openResult) {
+      return { success: false, error: openResult }
+    }
+    return { success: true }
+  } catch (err) {
+    return {
+      success: false,
+      error: err instanceof Error ? err.message : 'Unknown error opening file',
+    }
+  }
+}

apps/desktop/src/main/index.ts

@@ -2,6 +2,7 @@ import { app, BrowserWindow, dialog, ipcMain, screen, session } from 'electron'
 import { electronApp, optimizer } from '@electron-toolkit/utils'
 import { REDUX_DEVTOOLS, installExtension } from '@tomjs/electron-devtools-installer'
 import { ProjectData } from '@hedron-gl/app-store'
+import { openSketchSourceFile } from './handlers/openSketchSourceFile'
 import { saveFrameHandler, saveFrameSequenceHandler } from './handlers/frameHandlers'
 import {
   DialogEvents,
@@ -112,6 +113,13 @@ ipcMain.handle(FileEvents.OpenFolder, async (_, folderPath: string) => {
   return await openFolder(folderPath)
 })
 
+ipcMain.handle(
+  FileEvents.OpenSketchSourceFile,
+  async (_, sketchesDir: string, moduleId: string) => {
+    return await openSketchSourceFile(sketchesDir, moduleId)
+  },
+)
+
 ipcMain.handle(SketchEvents.StartSketchesServer, async (_, sketchesDir: string) => {
   return await startSketchesServer(sketchesDir)
 })

apps/desktop/src/renderer/components/ActiveSketch/ActiveSketch.tsx

@@ -15,6 +15,7 @@ import {
 
 import { Node } from '@hedron-gl/engine'
 import c from './ActiveSketch.module.css'
+import { openSketchSourceFile } from './openSketchSourceFile'
 import { useActiveSketch } from '@components/hooks/useActiveSketch'
 import { engineStore } from '@renderer/engine'
 import { SketchControls } from '@components/SketchControls/SketchControls'
@@ -63,6 +64,11 @@ export const ActiveSketch = () => {
               icon: 'arrow_downward',
               onClick: () => engineStore.getState().moveSketchDown(activeSketch.id),
             },
+            {
+              label: 'Open Source',
+              icon: 'code',
+              onClick: () => openSketchSourceFile(activeSketch.moduleId),
+            },
             {
               label: 'Delete Sketch',
               icon: 'delete',

apps/desktop/src/renderer/components/ActiveSketch/openSketchSourceFile.ts

@@ -0,0 +1,26 @@
+// openSketchSourceFile.ts
+// Utility to open the source file for a sketch in the default program
+import { appStore } from '@renderer/appStore'
+import { FileEvents } from '@shared/Events'
+
+/**
+ * Attempts to open the source file (index.ts or index.js) for a sketch module in the default app.
+ * @param moduleId The sketch's moduleId
+ * @returns Promise<void>
+ */
+export async function openSketchSourceFile(moduleId: string) {
+  const sketchesDir = appStore.getState().sketchesDir
+  if (!sketchesDir) {
+    alert('No sketches directory set')
+    return
+  }
+  // Ask main process to open the file
+  const result = await window.electronApi.ipcRenderer.invoke(
+    FileEvents.OpenSketchSourceFile,
+    sketchesDir,
+    moduleId,
+  )
+  if (!result?.success) {
+    alert(result?.error || 'Source file not found for this sketch.')
+  }
+}

apps/desktop/src/shared/Events.ts

@@ -38,6 +38,7 @@ export enum DialogEvents {
 export enum FileEvents {
   SaveProject = 'save-project',
   OpenFolder = 'open-folder',
+  OpenSketchSourceFile = 'open-sketch-source-file',
 }
 
 type ResponseCanceled = {