Merge pull request #774 from OWASP/modify-save

Guard in electron for unsaved changes

Author: jgadsden

td.vue/public/preload.js

@@ -8,6 +8,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
     // renderer to electron main
     updateMenu: (locale) => ipcRenderer.send('update-menu', locale),
     modelClosed: (fileName) => ipcRenderer.send('model-closed', fileName),
+    modelModified: (modified) => ipcRenderer.send('model-modified', modified),
     modelOpened: (fileName) => ipcRenderer.send('model-opened', fileName),
     modelPrint: (printer) => ipcRenderer.send('model-print', printer),
     modelSaved: (modelData, fileName) => ipcRenderer.send('model-saved', modelData, fileName),

td.vue/src/components/Graph.vue

@@ -77,6 +77,7 @@ export default {
             this.graph = diagramService.edit(this.$refs.graph_container, this.diagram);
             stencil.get(this.graph, this.$refs.stencil_container);
             console.debug('diagram ID: ' + this.diagram.id);
+            this.$store.dispatch(tmActions.unmodified);
         },
         threatSelected(threatId) {
             this.$refs.threatEditDialog.editThreat(threatId);
@@ -86,10 +87,11 @@ export default {
             updated.cells = this.graph.toJSON().cells;
             this.$store.dispatch(tmActions.diagramUpdated, updated);
             this.$store.dispatch(tmActions.save);
+            this.$store.dispatch(tmActions.unmodified);
         },
         async closed() {
-            const diagramChanged = JSON.stringify(this.graph.toJSON().cells) !== JSON.stringify(this.diagram.cells);
-            if (!diagramChanged || await this.getConfirmModal()) {
+            if (!this.$store.getters.modelChanged || await this.getConfirmModal()) {
+                this.$store.dispatch(tmActions.unmodified);
                 this.$router.push({ name: `${this.providerType}ThreatModel`, params: this.$route.params });
             }
         },

td.vue/src/desktop/desktop.js

@@ -93,6 +93,7 @@ app.on('ready', async () => {
 
     ipcMain.on('update-menu', handleUpdateMenu);
     ipcMain.on('model-closed', handleModelClosed);
+    ipcMain.on('model-modified', handleModelModified);
     ipcMain.on('model-opened', handleModelOpened);
     ipcMain.on('model-print', handleModelPrint);
     ipcMain.on('model-saved', handleModelSaved);
@@ -108,7 +109,9 @@ app.on('open-file', function(event, path) {
     // handle this event
     event.preventDefault();
     logger.log.debug('Open file from recent documents: ' + path);
-    menu.readModelData(path);
+    if (menu.guardModel() === true) {
+        menu.readModelData(path);
+    }
 });
 
 function handleUpdateMenu (_event, locale) {
@@ -123,6 +126,11 @@ function handleModelClosed (_event, fileName) {
     menu.modelClosed();
 }
 
+function handleModelModified (_event, modified) {
+    logger.log.debug('Modified model notification from renderer: ' + modified);
+    menu.modelModified(modified);
+}
+
 function handleModelOpened (_event, fileName) {
     logger.log.debug('Open model notification from renderer for file name: ' + fileName);
     menu.modelOpened();

td.vue/src/desktop/menu.js

@@ -32,7 +32,8 @@ var language = defaultLanguage;
 export const model = {
     fileDirectory: '',
     filePath: '',
-    isOpen: false
+    isOpen: false,
+    isModified: false
 };
 
 export function getMenuTemplate () {
@@ -147,9 +148,8 @@ export function getMenuTemplate () {
 
 // Open file system dialog and read file contents into model
 function openModel () {
-    if (model.isOpen === true) {
-        logger.log.debug('Checking that the existing model is not modified');
-        logger.log.warn('TODO check from renderer that existing open file is not modified');
+    if (guardModel() === false) {
+        return;
     }
     dialog.showOpenDialog({
         title: messages[language].desktop.file.open,
@@ -226,6 +226,9 @@ function saveModelDataAs (modelData, fileName) {
 
 // open a new model
 function newModel () {
+    if (guardModel() === false) {
+        return;
+    }
     let newName = 'new-model.json';
     logger.log.debug(messages[language].desktop.file.new + ': ' + newName);
     // prompt the renderer to open a new model
@@ -242,12 +245,38 @@ function printModel () {
 
 // close the model
 function closeModel () {
+    if (guardModel() === false) {
+        return;
+    }
     logger.log.debug(messages[language].desktop.file.close + ': ' + model.filePath);
     // prompt the renderer to close the model
     mainWindow.webContents.send('close-model', path.basename(model.filePath));
     modelClosed();
 }
 
+// close the model
+export function guardModel () {
+    if (model.isOpen === false || model.isModified === false) {
+        return true;
+    }
+    logger.log.debug('Check existing open and modified model can be closed');
+    const dialogOptions = {
+        title: messages[language].forms.discardTitle,
+        message: messages[language].forms.discardMessage,
+        buttons: [ messages[language].forms.ok, messages[language].forms.cancel ],
+        type: 'warning',
+        defaultId: 1,
+        cancelId: 1
+    };
+    let guard = false;
+    let result = dialog.showMessageBoxSync(mainWindow, dialogOptions);
+    if (result === 0) {
+        guard = true;
+    }
+    logger.log.debug(messages[language].forms.discardTitle + ': ' + guard);
+    return guard;
+}
+
 // read threat model from file, eg after open-file app module event
 export function readModelData (filePath) {
     model.filePath = filePath;
@@ -282,22 +311,6 @@ function saveModelData (modelData) {
     }
 }
 
-// the renderer has requested to save the model with a filename
-export const modelSaved = (modelData, fileName) => {
-    // if the filePath is empty then this is the first time a save has been requested
-    if (!model.filePath || model.filePath === '') {
-        saveModelDataAs(modelData, fileName);
-    } else {
-        saveModelData(modelData);
-    }
-};
-
-// clear out the model, either by menu or by renderer request
-export const modelClosed = () => {
-    model.filePath = '';
-    model.isOpen = false;
-};
-
 // Open saveAs file system dialog and write contents as HTML
 function saveHTMLReport (htmlPath) {
     htmlPath += '.html';
@@ -360,6 +373,25 @@ function savePDFReport (pdfPath) {
     });
 }
 
+// clear out the model, either by menu or by renderer request
+export const modelClosed = () => {
+    model.filePath = '';
+    model.isOpen = false;
+};
+
+// the renderer has modified the model
+export const modelModified = (modified) => {
+    model.isModified = modified;
+};
+
+// the renderer has opened a new model
+export const modelOpened = () => {
+    // for security reasons the renderer can not provide the full path
+    // so wait for a save before filling in the file path
+    model.filePath = '';
+    model.isOpen = true;
+};
+
 // the renderer has requested a report to be printed
 export const modelPrint = (printer) => {
     let reportPath = path.join(path.dirname(model.filePath), path.basename(model.filePath, '.json'));
@@ -376,14 +408,17 @@ export const modelPrint = (printer) => {
     }
 };
 
-// the renderer has opened a new model
-export const modelOpened = () => {
-    // for security reasons the renderer can not provide the full path
-    // so wait for a save before filling in the file path
-    model.filePath = '';
-    model.isOpen = true;
+// the renderer has requested to save the model with a filename
+export const modelSaved = (modelData, fileName) => {
+    // if the filePath is empty then this is the first time a save has been requested
+    if (!model.filePath || model.filePath === '') {
+        saveModelDataAs(modelData, fileName);
+    } else {
+        saveModelData(modelData);
+    }
 };
 
+// the renderer has changed the language
 export const setLocale = (locale) => {
     language = languages.includes(locale) ? locale : defaultLanguage;
 };
@@ -394,7 +429,9 @@ export const setMainWindow = (window) => {
 
 export default {
     getMenuTemplate,
+    guardModel,
     modelClosed,
+    modelModified,
     modelOpened,
     modelPrint,
     modelSaved,

td.vue/src/main.desktop.js

@@ -20,8 +20,6 @@ Vue.config.productionTip = false;
 
 // informing renderer that desktop menu shell has closed the model
 window.electronAPI.onCloseModel((_event, fileName) =>  {
-    console.warn('TODO check that any existing open model has not been modified');
-    // getConfirmModal();
     console.debug('Closing model with file name : ' + fileName);
     app.$store.dispatch(threatmodelActions.clear);
     localAuth();
@@ -34,8 +32,6 @@ window.electronAPI.onCloseModel((_event, fileName) =>  {
 
 // request from desktop menu shell -> renderer to start a new model
 window.electronAPI.onNewModel((_event, fileName) =>  {
-    console.warn('TODO check that any existing open model has not been modified');
-    // getConfirmModal();
     console.debug('New model with file name : ' + fileName);
     app.$store.dispatch(threatmodelActions.update, { fileName: fileName });
     localAuth();

td.vue/src/service/migration/diagram.js

@@ -35,7 +35,9 @@ const upgradeAndDraw = (diagram, graph) => {
     updated.diagramType = diagram.diagramType;
     graph.getCells().forEach((cell) => dataChanged.updateStyleAttrs(cell));
     store.get().dispatch(tmActions.diagramUpdated, updated);
-    store.get().dispatch(tmActions.setImmutableCopy);
+    store.get().dispatch(tmActions.setRollback);
+    store.get().dispatch(tmActions.unmodified);
+
 };
 
 const drawGraph = (diagram, graph) => {

td.vue/src/service/x6/graph/events.js

@@ -6,6 +6,7 @@ import dataChanged from './data-changed.js';
 import defaultProperties from '@/service/entity/default-properties.js';
 import store from '@/store/index.js';
 import { CELL_SELECTED, CELL_UNSELECTED } from '@/store/actions/cell.js';
+import { THREATMODEL_MODIFIED } from '@/store/actions/threatmodel.js';
 import shapes from '@/service/x6/shapes/index.js';
 
 const edgeConnected = ({ isNew, edge }) => {
@@ -71,6 +72,12 @@ const cellAdded = (graph) => ({ cell }) => {
         cell.setData(defaultProperties.getByType(cell.type));
     }
     store.get().dispatch(CELL_SELECTED, cell);
+    store.get().dispatch(THREATMODEL_MODIFIED);
+};
+
+const cellDeleted = () => {
+    console.debug('cell deleted: ');
+    store.get().dispatch(THREATMODEL_MODIFIED);
 };
 
 const cellSelected = ({ cell }) => {
@@ -100,6 +107,7 @@ const cellSelected = ({ cell }) => {
 
     store.get().dispatch(CELL_SELECTED, cell);
     dataChanged.updateStyleAttrs(cell);
+    store.get().dispatch(THREATMODEL_MODIFIED);
 };
 
 const cellUnselected = ({ cell }) => {
@@ -142,6 +150,7 @@ const listen = (graph) => {
     graph.on('cell:mouseleave', removeCellTools);
     graph.on('cell:mouseenter', mouseEnter);
     graph.on('cell:added', cellAdded(graph));
+    graph.on('cell:removed', cellDeleted);
     graph.on('cell:change:data', cellDataChanged);
     graph.on('cell:selected', cellSelected);
     graph.on('cell:unselected', cellUnselected);
@@ -156,6 +165,7 @@ const removeListeners = (graph) => {
     graph.off('cell:mouseleave', removeCellTools);
     graph.off('cell:mouseenter', mouseEnter);
     graph.off('cell:added', cellAdded(graph));
+    graph.off('cell:removed', cellDeleted);
     graph.off('cell:change:data', cellDataChanged);
     graph.off('cell:selected', cellSelected);
     graph.off('cell:unselected', cellUnselected);

td.vue/src/store/actions/threatmodel.js

@@ -5,22 +5,27 @@ export const THREATMODEL_FETCH = 'THREATMODEL_FETCH';
 export const THREATMODEL_FETCH_ALL = 'THREATMODEL_FETCH_ALL';
 export const THREATMODEL_CREATE = 'THREATMODEL_CREATE';
 export const THREATMODEL_CONTRIBUTORS_UPDATED = 'THREATMODEL_CONTRIBUTORS_UPDATED';
+export const THREATMODEL_MODIFIED = 'THREATMODEL_MODIFIED;';
 export const THREATMODEL_RESTORE = 'THREATMODEL_RESTORE';
 export const THREATMODEL_SAVE = 'THREATMODEL_SAVE';
-export const THREATMODEL_SET_IMMUTABLE_COPY = 'THREATMODEL_SET_IMMUTABLE_COPY';
 export const THREATMODEL_SELECTED = 'THREATMODEL_SELECTED';
+export const THREATMODEL_SET_ROLLBACK = 'THREATMODEL_SET_ROLLBACK';
+export const THREATMODEL_UNMODIFIED = 'THREATMODEL_UNMODIFIED';
 export const THREATMODEL_UPDATE = 'THREATMODEL_UPDATE';
 
 export default {
     clear: THREATMODEL_CLEAR,
+    contributorsUpdated: THREATMODEL_CONTRIBUTORS_UPDATED,
     create: THREATMODEL_CREATE,
     diagramSelected: THREATMODEL_DIAGRAM_SELECTED,
     diagramUpdated: THREATMODEL_DIAGRAM_UPDATED,
     fetch: THREATMODEL_FETCH,
     fetchAll: THREATMODEL_FETCH_ALL,
+    modified: THREATMODEL_MODIFIED,
     restore: THREATMODEL_RESTORE,
     save: THREATMODEL_SAVE,
     selected: THREATMODEL_SELECTED,
-    setImmutableCopy: THREATMODEL_SET_IMMUTABLE_COPY,
+    setRollback: THREATMODEL_SET_ROLLBACK,
+    unmodified: THREATMODEL_UNMODIFIED,
     update: THREATMODEL_UPDATE
 };