chore: allow to save the notebook - fixes #25

datalayer · Aug 27, 2022 · 7084229 · 7084229
1 parent 6aacd94
commit 7084229
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 9 deletions.
diff --git a/packages/react/src/JupyterExample.tsx b/packages/react/src/JupyterExample.tsx
@@ -5,6 +5,7 @@ import Jupyter from './jupyter/Jupyter';
 import Cell from './components/cell/Cell';
 import { selectCell, cellActions } from './components/cell/CellState';
 import Notebook from './components/notebook/Notebook';
+import { notebookActions } from './components/notebook/NotebookState';
 import CellSidebarDefault from './components/notebook/cell/sidebar/CellSidebarDefault';
 // import Console from './components/console/Console';
 
@@ -24,7 +25,7 @@ const CellPreview = () => {
   )
 }
 
-const CellToolbar: React.FC = () => {
+const CellToolbar = () => {
   const cell = selectCell();
   const dispatch = useDispatch();
   return (
@@ -56,11 +57,31 @@ const CellToolbar: React.FC = () => {
   );
 }
 
+const NotebookToolbar = () => {
+  const dispatch = useDispatch();
+  return (
+    <>
+      <Box display="flex">
+        <Box mr={1}>
+          <Button
+            variant="default"
+            size="small"
+            onClick={() => dispatch(notebookActions.save.started(new Date()))}
+            >
+              Save the notebook
+          </Button>
+        </Box>
+      </Box>
+    </>
+  );
+}
+
 root.render(
   <Jupyter>
     <CellPreview/>
     <CellToolbar/>
     <Cell/>
+    <NotebookToolbar/>
     <Notebook path="test.ipynb" CellSidebar={CellSidebarDefault} />
   </Jupyter>
 );
diff --git a/packages/react/src/components/notebook/NotebookCommands.ts b/packages/react/src/components/notebook/NotebookCommands.ts
@@ -288,13 +288,11 @@ export const NotebookCommands = (
       keys: ["Shift Enter"],
       command: cmdIds.runAndAdvance,
     },
-    /*
     {
       selector: ".jp-Notebook",
       keys: ["Accel S"],
       command: cmdIds.save,
     },
-    */
     {
       selector: ".jp-Notebook",
       keys: ["Accel F"],

diff --git a/packages/react/src/components/notebook/NotebookState.ts b/packages/react/src/components/notebook/NotebookState.ts
@@ -3,7 +3,7 @@ import { useSelector } from "react-redux";
 import actionCreatorFactory, { AnyAction, Action, Success } from "typescript-fsa";
 import { combineEpics, Epic } from "redux-observable";
 import { reducerWithInitialState } from "typescript-fsa-reducers";
-import { ignoreElements, tap } from "rxjs/operators";
+import { ignoreElements, map, tap } from "rxjs/operators";
 import { ofAction } from "@datalayer/typescript-fsa-redux-observable";
 import * as nbformat from "@jupyterlab/nbformat";
 import { INotebookModel, NotebookActions } from "@jupyterlab/notebook";
@@ -141,9 +141,6 @@ export const notebookActions = {
   kernelStatusChanged: actionCreator<Kernel.Status>(
     ActionType.KERNEL_STATUS_CHANGE
   ),
-  save: actionCreator<Date | undefined>(
-    ActionType.SAVE
-  ),
   portal: actionCreator<ReactPortal[]>(
     ActionType.PORTAL
   ),
@@ -153,6 +150,9 @@ export const notebookActions = {
   setPortal: actionCreator<PortalDisplay | undefined>(
     ActionType.SET_PORTAL
   ),
+  save: actionCreator.async<Date | undefined, Date | undefined>(
+    ActionType.SAVE
+  ),
   run: actionCreator.async<void, void>(
     ActionType.RUN
   ),
@@ -276,6 +276,22 @@ const changeCellTypeEpic: Epic<
     ignoreElements(),
   );
 
+const saveEpic: Epic<
+  AnyAction,
+  Action<Success<Date | undefined, Date | undefined>>,
+  IState
+> = (action$, state$) =>
+  action$.pipe(
+    ofAction(notebookActions.save.started),
+    map(action => {
+      state$.value.notebook?.adapter?.commands.execute(cmdIds.save);
+      return notebookActions.save.done({
+        params: action.payload,
+        result: action.payload,
+      });
+    })
+  );
+
 export const notebookEpics = combineEpics(
   runEpic,
   runAllEpic,
@@ -284,6 +300,7 @@ export const notebookEpics = combineEpics(
   insertBelowEpic,
   deleteEpic,
   changeCellTypeEpic,
+  saveEpic,
 );
 
 /* Reducers */
@@ -341,10 +358,14 @@ export const notebookReducer = reducerWithInitialState(notebookInitialState)
       portal,
     }
   })
-  .case(notebookActions.save, (state: INotebookState, saveRequest: Date | undefined) => {
+  .case(notebookActions.save.done, (state: INotebookState, payload: Success<Date | undefined, Date | undefined>) => {
+    console.log('---', {
+      ...state,
+      saveRequest: payload.result,
+    });
     return {
       ...state,
-      saveRequest,
+      saveRequest: payload.result,
     }
   })
   .case(notebookActions.insertAbove.done, (state: INotebookState, payload: Success<nbformat.CellType, nbformat.CellType>) => {