Attempt to move the save-to-board feature into a button instead of just magic cmd

malcolm-sparkfun · malcolm-sparkfun · commit 1ac255934697 · 2025-06-19T15:06:23.000-06:00
diff --git a/kernel/src/components/Dialog.ts b/kernel/src/components/Dialog.ts
@@ -1,14 +1,20 @@
 import { ConnectCard } from './ConnectCard';
 import { ServiceContainer } from '../services/ServiceContainer';
+import { Card } from './Card';
+import { LabShell } from '@jupyterlab/application';
+import { NotebookPanel } from '@jupyterlab/notebook';
+import type { JupyterLiteServer } from '@jupyterlite/server';
 
 export interface DialogProps {
   closeDialog: () => void;
   serviceContainer: ServiceContainer;
+  app?: JupyterLiteServer;
 }
 
 export class Dialog {
   private element: HTMLDivElement;
   private connectCard: ConnectCard;
+  private saveCard: Card
 
   constructor(props: DialogProps) {
     this.element = document.createElement('div');
@@ -33,7 +39,45 @@ export class Dialog {
     },
     props.serviceContainer.deviceService);
 
+    this.saveCard = new Card({
+      action: 'save',
+      icon: '📥',
+      title: 'Save Notebook',
+      description: 'Save notebook to RedBoard',
+      color: 'var(--ui-red)'
+    }, 
+    // create an arrow function that calls the save method on the serviceContainer but first iterates over all cells and gathers their code content if they are code cells
+    async () => {
+      // TODO: current widget might not be correct at this level, need to check and possibly change how we're getting this
+      const notebook = props.app?.shell.currentWidget as NotebookPanel | null;
+      var allCellContent : string = '';
+
+      console.log("[Dialog] saveCard: Saving notebook content...");
+
+      if (notebook) {
+        console.log("[Dialog] saveCard: Found notebook:", notebook.title.label);
+        notebook.revealed.then(() => {
+          
+          
+          for (const cell of notebook.content.model.cells) {
+            // TODO: nbformat has this property as 'cell_type' not 'type'
+            // but it seems from the JupyterLab direct docs that it should be 'type'
+            if (cell.type === 'code') {
+              allCellContent += cell.source + '\n\n';
+            }
+          }
+
+          console.log("[Dialog] saveCard: Cells to save:", allCellContent);
+        });  
+      }
+
+      return props.serviceContainer.saveCodeToDevice(allCellContent, (content) => {
+        console.log("[Dialog] saveCard: Streaming output:", content);
+      });
+    });
+
     optionsContainer.appendChild(this.connectCard.getElement());
+    optionsContainer.appendChild(this.saveCard.getElement());
 
     let content = document.createElement('div');
     content.className = 'welcome-dialog';
@@ -69,3 +113,4 @@ export class Dialog {
     return this.element;
   }
 }
+
diff --git a/kernel/src/index.ts b/kernel/src/index.ts
@@ -1,6 +1,7 @@
 // Removed Widget import as we're no longer using @lumino/widgets
 import { JupyterLiteServer, JupyterLiteServerPlugin } from '@jupyterlite/server';
 import { IKernel, IKernelSpecs } from '@jupyterlite/kernel';
+// import { INotebookTracker, NotebookPanel } from '@jupyterlab/notebook';
 import { EmbeddedKernel } from './kernel';
 import WelcomePanel from './panel';
 import { ServiceContainer } from './services/ServiceContainer';
@@ -51,7 +52,10 @@ const kernelPlugin: JupyterLiteServerPlugin<void> = {
         // Save the DeviceService instance so we can restore it if kernel is restarted
         devService = serviceContainer.deviceService;
 
-        const welcomePanel = new WelcomePanel(serviceContainer);
+        const welcomePanel = new WelcomePanel(
+          serviceContainer,
+          app
+        );
         document.body.appendChild(welcomePanel.getElement());
         const kernel = new EmbeddedKernel(options, serviceContainer);
 
@@ -69,6 +73,18 @@ const kernelPlugin: JupyterLiteServerPlugin<void> = {
         return kernel;
       }
     });
+
+    // notebookTracker.currentChanged.connect((tracker, panel: NotebookPanel | null) => {
+    //   if (panel) {
+    //     console.log("Notebook changed to: ", panel.context.path);
+    //     const currentNotebookPanel = notebookTracker.currentWidget;
+        
+
+    //   }
+    //   else{
+    //     console.log("No notebook currently active on currentChanged event.")
+    //   }
+    // });
   }
 };
 
diff --git a/kernel/src/kernel.ts b/kernel/src/kernel.ts
@@ -4,9 +4,6 @@ import { ServiceContainer } from './services/ServiceContainer';
 
 const reconnectString: string = "%connect%"
 const saveString: string = "%save%";
-const bootFileName: string = "main.py";
-const bootSavePrefix: string = `with open('${bootFileName}', 'w') as f:\n    f.write('''\n`;
-const bootSaveSuffix: string = "\n''')\n";
 
 export class EmbeddedKernel extends BaseKernel {
 
@@ -83,53 +80,11 @@ export class EmbeddedKernel extends BaseKernel {
     }
     if (code.includes(saveString)) {
       // Burn the code after the save string into the main.py file
-      this.outputResponse(`Save command detected, saving code to ${bootFileName}...`);
+      this.outputResponse(`Save command detected, saving code...`);
       const codeToSave = code.split(saveString)[1].trim();
-      if (!codeToSave) {
-        return {
-          status: 'error',
-          execution_count: this.executionCount,
-          ename: 'ValueError',
-          evalue: 'No code provided to save',
-          traceback: ['Please provide code to save after the %save% command']
-        };
-      }
-      // Burn the code by adding it to the main.py file. Can call executeRequest with the code to save 
-      // but append the code to write it to the main.py file at the start of the code.
-      const bootCode = `# This code is automatically generated by the Embedded Kernel\n${codeToSave}`;
-      const bootCodeWithSave = `${bootSavePrefix}${bootCode}${bootSaveSuffix}`;
-
-      // Execute the command to save the main.py file
-      if (!this.serviceContainer.deviceService.getTransport()) {
-        console.log(`[Kernel] executeRequest - No transport available for saving ${bootFileName}`);
-        return {
-          status: 'error',
-          execution_count: this.executionCount,
-          ename: 'TransportError',
-          evalue: `No transport available to save ${bootFileName}`,
-          traceback: ['Please connect a device first']
-        };
-      }
-      const result = await this.serviceContainer.consoleService.executeCommand(bootCodeWithSave, (content) => {
-        console.log("[Kernel] executeRequest - Streaming output:", content);
-        this.stream(content);
-      });
-      if (!result.success) {
-        console.log("[Kernel] executeRequest - Command execution failed:", result.error);
-        return {
-          status: 'error',
-          execution_count: this.executionCount,
-          ename: 'ExecutionError',
-          evalue: result.error || 'Unknown error',
-          traceback: [result.error || 'Unknown error']
-        };
-      }
-      console.log(`[Kernel] executeRequest - Code saved to ${bootFileName} successfully`);
-      return {
-        status: 'ok',
-        execution_count: this.executionCount,
-        user_expressions: {},
-      };
+      // pass the "stream" to the saveCodeToDevice method
+      const result = await this.serviceContainer.saveCodeToDevice(codeToSave, this.outputResponse.bind(this));
+      return result;
     }
 
     try {
diff --git a/kernel/src/panel.ts b/kernel/src/panel.ts
@@ -2,6 +2,7 @@ import { globalStyles, animations, overlayStyles, dialogStyles, minimizedStyles,
 import { MinimizedButton } from './components/MinimizedButton';
 import { Dialog } from './components/Dialog';
 import { ServiceContainer } from './services/ServiceContainer';
+import type { JupyterLiteServer } from '@jupyterlite/server';
 
 class DialogPanel {
   private element: HTMLDivElement;
@@ -91,7 +92,10 @@ export default class WelcomePanel {
   private minimizedPanel: MinimizedPanel;
   private dialogPanel: DialogPanel;
 
-  constructor(private serviceContainer: ServiceContainer) {
+  constructor(
+    private serviceContainer: ServiceContainer,
+    private app?: JupyterLiteServer
+  ) {
 
     this.element = document.createElement('div');
     this.element.id = 'jp-kernel-welcome-panel';
@@ -115,6 +119,7 @@ export default class WelcomePanel {
     const dialog = new Dialog({
       closeDialog: () => this.hide(),
       serviceContainer: this.serviceContainer,
+      app: this.app,
     });
     this.dialogPanel = new DialogPanel(dialog);
 
diff --git a/kernel/src/services/ServiceContainer.ts b/kernel/src/services/ServiceContainer.ts
@@ -3,6 +3,10 @@ import { ConsoleService } from './ConsoleService';
 import { FirmwareService } from './FirmwareService';
 import { FlashService } from './FlashService';
 
+const bootFileName: string = "main.py";
+const bootSavePrefix: string = `with open('${bootFileName}', 'w') as f:\n    f.write('''\n`;
+const bootSaveSuffix: string = "\n''')\n";
+
 export class ServiceContainer {
 
   private _deviceService: DeviceService;
@@ -44,4 +48,53 @@ export class ServiceContainer {
   public get flashService(): FlashService {
     return this._flashService;
   }
+  
+  public async saveCodeToDevice(
+    codeToSave: string,
+    stream: (content: string) => void
+  ): Promise<{ status: string; execution_count: number; ename?: string; evalue?: string; traceback?: string[] }> {
+    if (!codeToSave) {
+      return {
+        status: 'error',
+        execution_count: 0,
+        ename: 'ValueError',
+        evalue: 'No code provided to save',
+        traceback: ['Please provide code to save after the %save% command']
+      };
+    }
+    
+    const bootCode = `# This code is automatically generated by the Embedded Kernel\n${codeToSave}`;
+    const bootCodeWithSave = `${bootSavePrefix}${bootCode}${bootSaveSuffix}`;
+
+    if (!this._deviceService.getTransport()) {
+      console.log(`[ServiceContainer] saveCodeToDevice - No transport available for saving`);
+      return {
+        status: 'error',
+        execution_count: 0,
+        ename: 'TransportError',
+        evalue: 'No transport available to save code',
+        traceback: ['Please connect a device first']
+      };
+    }
+
+    const result = await this._consoleService.executeCommand(bootCodeWithSave, stream);
+    
+    if (!result.success) {
+      console.log("[ServiceContainer] saveCodeToDevice - Command execution failed:", result.error);
+      return {
+        status: 'error',
+        execution_count: 0,
+        ename: 'ExecutionError',
+        evalue: result.error || 'Unknown error',
+        traceback: [result.error || 'Unknown error']
+      };
+    }
+    
+    console.log(`[ServiceContainer] saveCodeToDevice - Code saved successfully`);
+    return {
+      status: 'ok',
+      execution_count: 0,
+      user_expressions: {},
+    };
+  }
 }
