Improve Notebook UX

zasper-io · Feb 6, 2025 · 389884a · 389884a
1 parent 72ee722
commit 389884a
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 10 deletions.
diff --git a/content/content_manager.go b/content/content_manager.go
@@ -226,7 +226,7 @@ func newUntitledFile(payload ContentPayload) models.ContentModel {
 	for fileExists(filePath) {
 		i++
 		// Generate a new filename like "untitled-1.txt", "untitled-2.txt", etc.
-		filePath = GetOSPath(payload.ParentDir + "/" + fmt.Sprintf("untitled-%d.txt", i))
+		filePath = GetOSPath(payload.ParentDir + "/" + fmt.Sprintf("untitled%d.txt", i))
 	}
 
 	// Create the file with the unique filename
@@ -252,18 +252,23 @@ func newUntitledNotebook(payload ContentPayload) models.ContentModel {
 	model := models.ContentModel{}
 	model.ContentType = payload.ContentType
 
-	filePath := GetOSPath(payload.ParentDir + "/" + "untitled.ipynb")
+	filePath := payload.ParentDir + "/" + "Untitled.ipynb"
+	osFilePath := GetOSPath(filePath)
 
 	// Check if the file already exists and if so, increment the file number
 	i := 0
-	for fileExists(filePath) {
+	for fileExists(osFilePath) {
 		i++
 		// Generate a new filename like "untitled-1.txt", "untitled-2.txt", etc.
-		filePath = GetOSPath(payload.ParentDir + "/" + fmt.Sprintf("untitled-%d.ipynb", i))
+		filePath = payload.ParentDir + "/" + fmt.Sprintf("Untitled%d.ipynb", i)
+		osFilePath = GetOSPath(filePath)
 	}
 
+	log.Debug().Msgf("Creating new untitled notebook at filepath: %s", filePath)
+	log.Debug().Msgf("Creating new untitled notebook at os path: %s", osFilePath)
+
 	// Create the file with the unique filename
-	file, err := os.OpenFile(filePath, os.O_CREATE|os.O_TRUNC|os.O_RDWR, 0755)
+	file, err := os.OpenFile(osFilePath, os.O_CREATE|os.O_TRUNC|os.O_RDWR, 0755)
 	if err != nil {
 		log.Info().Msgf("Error creating file: %s", err)
 	}
@@ -273,6 +278,24 @@ func newUntitledNotebook(payload ContentPayload) models.ContentModel {
 	model.Path = filePath
 	model.Name = filepath.Base(filePath)
 
+	// Write the default notebook content to the file
+	defaultNotebook := `{	"cells": [], "metadata": {}, "nbformat": 4, "nbformat_minor": 4}`
+
+	err = os.WriteFile(osFilePath, []byte(defaultNotebook), 0644) // Write the default notebook content to the file
+	if err != nil {
+		log.Error().Err(err).Msgf("Error writing default notebook content to file: %s", osFilePath)
+	}
+
+	info, err := os.Lstat(osFilePath)
+
+	if err != nil {
+		panic(err)
+	}
+
+	model.Created = info.ModTime().UTC().Format(time.RFC3339)
+	model.Last_modified = info.ModTime().UTC().Format(time.RFC3339)
+	model.Size = info.Size()
+
 	return model
 }
 

diff --git a/ui/src/ide/editor/Launcher.tsx b/ui/src/ide/editor/Launcher.tsx
@@ -36,7 +36,6 @@ const Launcher: React.FC<LauncherProps> = ({ data, sendDataToParent }) => {
     });
 
     const resJson = await res.json();
-    console.log(resJson)
     sendDataToParent(resJson.name, resJson.path, 'notebook', kernelspec);
     setReloadCount(reloadCount + 1);
   };
@@ -67,7 +66,7 @@ const Launcher: React.FC<LauncherProps> = ({ data, sendDataToParent }) => {
           <h2 className="font-h5 fontw-300">Notebook</h2>
           {Object.keys(kernelspecs).length > 0 ? (
             Object.keys(kernelspecs).map((key) => (
-              <div className="launcher-icon" key={key} onClick={() => createNewNotebook('/', 'notebook', kernelspecs[key].name)}>
+              <div className="launcher-icon" key={key} onClick={() => createNewNotebook('', 'notebook', kernelspecs[key].name)}>
                 <img className='resourceLogoImage' src={`${BaseApiUrl}${kernelspecs[key].resources['logo-svg']}`} alt="logo" />
                 <h6>{key}</h6>
               </div>

diff --git a/ui/src/ide/editor/notebook/NotebookEditor.tsx b/ui/src/ide/editor/notebook/NotebookEditor.tsx
@@ -83,17 +83,24 @@ export default function NotebookEditor(props) {
         method: 'POST',
         body: JSON.stringify({ path : path, type: 'notebook' }),
       });
-
       if (!res.ok) {
         throw new Error('Failed to fetch data');
       }
 
       const resJson = await res.json();
+
+      if (resJson.content.cells === null) {
+        resJson.content.cells = [{
+          execution_count: 0,
+          source: '',
+          cell_type: 'code',
+          outputs: [],
+        }];
+      }
       resJson.content.cells.forEach((cell) => {
         cell.id = uuidv4(); // Add UUID to each cell object
         cell.reload = false;
       });
-
       setNotebook(resJson.content);
       setLoading(false);
     } catch (err: unknown) {
@@ -379,7 +386,7 @@ export default function NotebookEditor(props) {
       const newCell = {
         execution_count: 0,
         source: '',
-        cell_type: 'markdown',
+        cell_type: 'code',
         id: uuidv4(),
         reload: false,
         outputs: [],