Skip to content

Commit d4ff2fe

Browse files
avinxshKDavinxshKD
committed
fix: replace window.confirm calls with app ConfirmModal
1 parent 7478319 commit d4ff2fe

7 files changed

Lines changed: 95 additions & 50 deletions

File tree

‎src/GraphWorkspace.jsx‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react';
22
import ZoomComp from './component/ZoomSetter';
3-
4-
// import { actionType as T } from './reducer';
3+
import ConfirmModal from './component/modals/ConfirmModal';
4+
import { actionType as T } from './reducer';
55
import './graphWorkspace.css';
66
// import localStorageManager from './graph-builder/local-storage-manager';
77
import TabBar from './component/TabBar';
@@ -80,6 +80,16 @@ const GraphComp = (props) => {
8080
))}
8181
<ZoomComp dispatcher={dispatcher} superState={superState} />
8282
</div>
83+
<ConfirmModal
84+
isOpen={superState.confirmModal.open}
85+
title="Confirm"
86+
message={superState.confirmModal.message}
87+
onConfirm={() => {
88+
if (superState.confirmModal.onConfirm) superState.confirmModal.onConfirm();
89+
dispatcher({ type: T.SET_CONFIRM_MODAL, payload: { open: false, message: '', onConfirm: null } });
90+
}}
91+
onCancel={() => dispatcher({ type: T.SET_CONFIRM_MODAL, payload: { open: false, message: '', onConfirm: null } })}
92+
/>
8393
</div>
8494
);
8595
};

‎src/component/modals/History.jsx‎

Lines changed: 44 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React, { useEffect, useState } from 'react';
22
import Modal from './ParentModal';
3+
import ConfirmModal from './ConfirmModal';
34
import './settings.css';
45
import { actionType as T } from '../../reducer';
56
import GA from '../../graph-builder/graph-actions';
@@ -21,6 +22,8 @@ const HistoryModal = ({ superState, dispatcher }) => {
2122
return res;
2223
};
2324
const [filterAction, setFilterAction] = useState(mapActionToTrue());
25+
const [restoreConfirmOpen, setRestoreConfirmOpen] = useState(false);
26+
const [pendingRestoreIndex, setPendingRestoreIndex] = useState(null);
2427

2528
const getLabelFromID = (x) => {
2629
if (superState.curGraphInstance) {
@@ -71,20 +74,33 @@ const HistoryModal = ({ superState, dispatcher }) => {
7174
[GA.SET_BENDW]: 'EdgeBend',
7275
};
7376

74-
const restoreState = (index) => {
75-
// eslint-disable-next-line no-alert
76-
if (window.confirm('Are you sure to restore the selected state?')) {
77-
let tempCurState = curState;
78-
while (index > tempCurState) {
79-
superState.curGraphInstance.undoSingleAction();
80-
tempCurState += 1;
81-
}
82-
while (index < tempCurState) {
83-
superState.curGraphInstance.redoSingleAction();
84-
tempCurState -= 1;
85-
}
86-
setcurState(tempCurState);
77+
const doRestore = (index) => {
78+
let tempCurState = curState;
79+
while (index > tempCurState) {
80+
superState.curGraphInstance.undoSingleAction();
81+
tempCurState += 1;
82+
}
83+
while (index < tempCurState) {
84+
superState.curGraphInstance.redoSingleAction();
85+
tempCurState -= 1;
8786
}
87+
setcurState(tempCurState);
88+
};
89+
90+
const restoreState = (index) => {
91+
setPendingRestoreIndex(index);
92+
setRestoreConfirmOpen(true);
93+
};
94+
95+
const handleRestoreConfirm = () => {
96+
doRestore(pendingRestoreIndex);
97+
setRestoreConfirmOpen(false);
98+
setPendingRestoreIndex(null);
99+
};
100+
101+
const handleRestoreCancel = () => {
102+
setRestoreConfirmOpen(false);
103+
setPendingRestoreIndex(null);
88104
};
89105
const prefixTid = (tid, str, authorName, index, hash) => {
90106
const DT = new Date(parseInt(tid, 10));
@@ -127,11 +143,19 @@ const HistoryModal = ({ superState, dispatcher }) => {
127143

128144
const close = () => dispatcher({ type: T.SET_HISTORY_MODAL, payload: false });
129145
return (
130-
<Modal
131-
ModelOpen={superState.viewHistory}
132-
closeModal={close}
133-
title="History"
134-
>
146+
<>
147+
<ConfirmModal
148+
isOpen={restoreConfirmOpen}
149+
title="Restore State"
150+
message="Are you sure you want to restore the selected state?"
151+
onConfirm={handleRestoreConfirm}
152+
onCancel={handleRestoreCancel}
153+
/>
154+
<Modal
155+
ModelOpen={superState.viewHistory}
156+
closeModal={close}
157+
title="History"
158+
>
135159
<div className="hist-container">
136160
<fieldset>
137161
<legend>Filters</legend>
@@ -168,7 +192,8 @@ const HistoryModal = ({ superState, dispatcher }) => {
168192
</table>
169193
</div>
170194
</div>
171-
</Modal>
195+
</Modal>
196+
</>
172197
);
173198
};
174199

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

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -31,14 +31,20 @@ class GraphCanvas extends Core {
3131
}
3232

3333
clearAll() {
34-
if (this.cy.elements().length === 0) return true;
35-
// eslint-disable-next-line no-alert
36-
if (!window.confirm('Do want to clear all elements?')) return false;
37-
this.cy.elements().forEach((el) => this.deleteElem(el.id(), 0));
38-
// this.actionArr = [];
39-
this.dispatcher({ type: T.CHANGE_RESET, payload: true });
40-
this.cy.emit('graph-modified');
41-
return true;
34+
if (this.cy.elements().length === 0) return;
35+
this.dispatcher({
36+
type: T.SET_CONFIRM_MODAL,
37+
payload: {
38+
open: true,
39+
message: 'Do you want to clear all elements?',
40+
onConfirm: () => {
41+
this.cy.elements().forEach((el) => this.deleteElem(el.id(), 0));
42+
// this.actionArr = [];
43+
this.dispatcher({ type: T.CHANGE_RESET, payload: true });
44+
this.cy.emit('graph-modified');
45+
},
46+
},
47+
});
4248
}
4349

4450
resetAllComp() {

‎src/graph-builder/graph-core/6-server.js‎

Lines changed: 22 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -86,30 +86,31 @@ class GraphServer extends GraphLoadSave {
8686
}
8787

8888
forcePushToServer() {
89-
// eslint-disable-next-line
90-
if (!window.confirm(
91-
'Forced push may result in workflow overwite and loss of changes pushed by others. Confirm?',
92-
)) return;
93-
if (this.serverID) {
94-
forceUpdateGraph(this.serverID, this.getGraphML()).then(() => {
95-
96-
}).catch((err) => {
97-
toast.error(err.response?.data?.message || err.message);
98-
});
99-
} else {
100-
postGraph(this.getGraphML()).then((serverID) => {
101-
this.set({ serverID });
102-
}).catch((err) => {
103-
toast.error(err.response?.data?.message || err.message);
104-
});
105-
}
89+
this.dispatcher({
90+
type: T.SET_CONFIRM_MODAL,
91+
payload: {
92+
open: true,
93+
message: 'Forced push may result in workflow overwite and loss of changes pushed by others. Confirm?',
94+
onConfirm: () => {
95+
if (this.serverID) {
96+
forceUpdateGraph(this.serverID, this.getGraphML()).then(() => {
97+
98+
}).catch((err) => {
99+
toast.error(err.response?.data?.message || err.message);
100+
});
101+
} else {
102+
postGraph(this.getGraphML()).then((serverID) => {
103+
this.set({ serverID });
104+
}).catch((err) => {
105+
toast.error(err.response?.data?.message || err.message);
106+
});
107+
}
108+
},
109+
},
110+
});
106111
}
107112

108113
forcePullFromServer() {
109-
// eslint-disable-next-line
110-
if (!window.confirm(
111-
'Forced pull may result in workflow overwite and loss of unsaved changes. Confirm?',
112-
)) return;
113114
if (this.serverID) {
114115
getGraph(this.serverID).then((graphXML) => {
115116
this.setGraphML(graphXML);

‎src/reducer/actionType.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ const actionType = {
4646
SET_LOGS_MESSAGE: 'SET_LOGS_MESSAGE',
4747
SET_GRAPH_INSTANCE: 'SET_GRAPH_INSTANCE',
4848
TOGGLE_DARK_MODE: 'TOGGLE_DARK_MODE',
49+
SET_CONFIRM_MODAL: 'SET_CONFIRM_MODAL',
4950
};
5051

5152
export default zealit(actionType);

‎src/reducer/initialState.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ const initialState = {
3939
logs: false,
4040
logsmessage: '',
4141
darkMode: false,
42+
confirmModal: { open: false, message: '', onConfirm: null },
4243
};
4344

4445
const initialGraphState = {

‎src/reducer/reducer.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,7 @@ const reducer = (state, action) => {
7373
case T.ELE_SELECTED: return { ...state, eleSelected: true, eleSelectedPayload: action.payload };
7474
case T.ELE_UNSELECTED: return { ...state, eleSelected: false };
7575
case T.TURN_DRAW: return { ...state, drawModeOn: action.payload };
76+
case T.SET_CONFIRM_MODAL: return { ...state, confirmModal: action.payload };
7677

7778
case T.SET_UNDO: return { ...state, undoEnabled: action.payload };
7879
case T.SET_REDO: return { ...state, redoEnabled: action.payload };

0 commit comments

Comments
 (0)