Merge pull request #154 from Rahuljagwani/main

issue #153 resolved

Author: pradeeban

src/graph-builder/graph-core/2-canvas.js

@@ -32,7 +32,8 @@ class GraphCanvas extends Core {
         // eslint-disable-next-line no-alert
         if (!window.confirm('Do want to clear all elements?')) return false;
         this.cy.elements().forEach((el) => this.deleteElem(el.id(), 0));
-        this.actionArr = [];
+        // this.actionArr = [];
+        this.dispatcher({ type: T.CHANGE_RESET, payload: true });
         this.cy.emit('graph-modified');
         return true;
     }

src/graph-builder/graph-core/4-undo-redo.js

@@ -138,6 +138,18 @@ class GraphUndoRedo extends GraphComponent {
         this.informUI();
     }
 
+    resetAfterClear() {
+        const limit = this.curActionIndex;
+        this.curActionIndex = 0;
+        while (this.curActionIndex !== this.actionArr.length && this.curActionIndex !== limit) {
+            this.performAction(this.actionArr[this.curActionIndex].equivalent);
+            this.curActionIndex += 1;
+        }
+        this.informUI();
+        this.dispatcher({ type: T.CHANGE_RESET, payload: false });
+        return true;
+    }
+
     setCurStatus() {
         super.setCurStatus();
         this.informUI();

src/reducer/actionType.js

@@ -18,6 +18,7 @@ const actionType = {
     ADD_GRAPH: 'ADD_GRAPH',
     ADD_GRAPH_BULK: 'ADD_GRAPH_BULK',
     CHANGE_TAB: 'CHANGE_TAB',
+    CHANGE_RESET: 'CHANGE_RESET',
     REMOVE_GRAPH: 'REMOVE_GRAPH',
     NEW_GRAPH: 'NEW_GRAPH',
     SET_SHARE_MODAL: 'SET_SHARE_MODAL',

src/reducer/initialState.js

@@ -25,6 +25,7 @@ const initialState = {
     curGraphInstance: null,
     zoomLevel: 100,
     uploadedDirName: null,
+    resetEnabled: false,
 };
 
 const initialGraphState = {

src/reducer/reducer.js

@@ -173,6 +173,9 @@ const reducer = (state, action) => {
     case T.SET_NEW_GRAPH_MODAL: {
         return { ...state, newGraphModal: action.payload };
     }
+    case T.CHANGE_RESET: {
+        return { ...state, resetEnabled: action.payload };
+    }
 
     case T.EDIT_TEXTFILE: {
         return {

src/toolbarActions/toolbarFunctions.js

@@ -145,6 +145,10 @@ const clearAll = (state) => {
     getGraphFun(state).clearAll();
 };
 
+const resetAfterClear = (state) => {
+    getGraphFun(state).resetAfterClear();
+};
+
 const editDetails = (state, setState) => {
     setState({
         type: T.SET_EDIT_DETAILS_MODAL,
@@ -182,6 +186,6 @@ const toggleServer = (state, dispatcher) => {
 export {
     createNode, editElement, deleteElem, downloadImg, saveAction, saveGraphMLFile,
     createFile, readFile, readTextFile, newProject, clearAll, editDetails, undo, redo,
-    openShareModal, openSettingModal, viewHistory,
+    openShareModal, openSettingModal, viewHistory, resetAfterClear,
     toggleServer,
 };

src/toolbarActions/toolbarList.js

@@ -1,7 +1,7 @@
 /* eslint-disable no-alert */
 import {
     FaSave, FaUndo, FaRedo, FaTrash, FaFileImport, FaPlus, FaDownload, FaEdit, FaRegTimesCircle, FaHistory,
-    FaHammer, FaBug, FaBomb, FaToggleOn, FaThermometerEmpty,
+    FaHammer, FaBug, FaBomb, FaToggleOn, FaThermometerEmpty, FaUndoAlt,
 } from 'react-icons/fa';
 
 import {
@@ -11,7 +11,7 @@ import {
 
 import {
     createNode, editElement, deleteElem, downloadImg, saveAction, saveGraphMLFile,
-    createFile, readFile, clearAll, undo, redo, viewHistory,
+    createFile, readFile, clearAll, undo, redo, viewHistory, resetAfterClear,
     toggleServer,
     // openSettingModal,
 } from './toolbarFunctions';
@@ -65,17 +65,26 @@ const toolbarList = (state, dispatcher) => [
         text: 'Empty',
         icon: FaThermometerEmpty,
         action: clearAll,
-        active: state.curGraphInstance,
+        active: state.curGraphInstance && !state.resetEnabled,
         visibility: true,
         hotkey: 'Ctrl+Backspace',
     },
+    {
+        type: 'action',
+        text: 'Reset',
+        icon: FaUndoAlt,
+        action: resetAfterClear,
+        active: state.curGraphInstance && state.resetEnabled,
+        visibility: true,
+        hotkey: 'Ctrl+I',
+    },
     { type: 'vsep' },
     {
         type: 'action',
         text: 'Undo',
         icon: FaUndo,
         action: undo,
-        active: state.undoEnabled && state.curGraphInstance,
+        active: state.undoEnabled && state.curGraphInstance && !state.resetEnabled,
         visibility: true,
         hotkey: 'Ctrl+Z',
     },
@@ -84,7 +93,7 @@ const toolbarList = (state, dispatcher) => [
         text: 'Redo',
         icon: FaRedo,
         action: redo,
-        active: state.redoEnabled && state.curGraphInstance,
+        active: state.redoEnabled && state.curGraphInstance && !state.resetEnabled,
         visibility: true,
         hotkey: 'Ctrl+Shift+Z,Ctrl+Y',
     },