Skip to content

Commit a3cca95

Browse files
Yihe LiuYihe Liu
authored andcommitted
move account modals out from FeatureTab
1 parent a6bd877 commit a3cca95

File tree

4 files changed

+277
-109
lines changed

4 files changed

+277
-109
lines changed

server/controllers/save.controller.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -187,7 +187,7 @@ const saveController = {
187187
const { SaveName } = req.body;
188188
const { email } = req.session;
189189
console.log('157', email, SaveName);
190-
190+
191191
const newSaveQuery = 'INSERT INTO saveddb(email,SaveName,SaveData) VALUES (?,?,?)';
192192
const values = [email, SaveName, '{}'];
193193
try {

src/components/DBDisplay/FeatureTab.tsx

Lines changed: 113 additions & 107 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import axios, { AxiosResponse } from 'axios';
44
import { NavLink, useNavigate } from 'react-router-dom';
55
import { useNavStore } from '../../store/navStore';
66
import { useModalStore } from '../../store/useModalStore';
7+
import { accountModalStore } from '../../store/accountModalStore';
78

89
// Functions imported:
910
import parseSql from '../../parse';
@@ -40,6 +41,17 @@ export default function FeatureTab(props: any) {
4041
// dbSpy 8.0: get the state store in Zustand
4142
const toggleClicked = useNavStore((state) => state.toggleClicked);
4243
const { openQueryModal, closeQueryModal, queryModalOpened } = useModalStore();
44+
const {
45+
saveDbModalOpened,
46+
setSaveDbModalOpen,
47+
setSaveDbModalClose,
48+
loadDbModalOpened,
49+
setLoadDbModalOpen,
50+
setLoadDbModalClose,
51+
nameArr,
52+
setNameArr,
53+
setDeleteDbModalOpen,
54+
} = accountModalStore();
4355

4456
const navigate = useNavigate();
4557

@@ -60,10 +72,10 @@ export default function FeatureTab(props: any) {
6072
const { setWelcome, isSchema, setDBName } = useSettingsStore((state) => state);
6173
const [action, setAction] = useState(new Array());
6274
// const [queryModalOpened, setQueryModalOpened] = useState(false);
63-
const [saveDbNameModalOpened, setSaveDbNameModalOpened] = useState(false);
64-
const [loadDbModalOpened, setLoadDbModalOpened] = useState(false);
75+
//const [saveDbNameModalOpened, setSaveDbNameModalOpened] = useState(false);
76+
//const [loadDbModalOpened, setLoadDbModalOpened] = useState(false);
6577
const [deleteDbModalOpened, setDeleteDbModalOpened] = useState(false);
66-
const [nameArr, setNameArr] = useState<string[]>([]);
78+
//const [nameArr, setNameArr] = useState<string[]>([]);
6779
//END: STATE DECLARATION
6880

6981
//create references for HTML elements
@@ -146,29 +158,23 @@ export default function FeatureTab(props: any) {
146158
setWelcome(false);
147159
};
148160

149-
// // Export QueryModal
150-
// const openQueryModal = () => {
151-
// setQueryModalOpened(true);
152-
// };
153-
// const closeQueryModal = () => {
154-
// setQueryModalOpened(false);
155-
// };
156-
161+
// dbSpy8.0: use Zustand to handle states
162+
// store in /store/accountModalStore
157163
//SaveDbNameModal - dbSpy 7.0
158164
const openSaveDbNameModal = () => {
159165
if (!user) alert('Must sign in to save!');
160166
else {
161-
setSaveDbNameModalOpened(true);
167+
setSaveDbModalOpen();
162168
}
163169
};
164170

165-
const closeSaveDbNameModal = (input?: string) => {
166-
//pull dbName from input field and send it to the database along with the schema. - dbSpy 7.0
167-
if (input) {
168-
saveSchema(input);
169-
}
170-
setSaveDbNameModalOpened(false);
171-
};
171+
// const closeSaveDbNameModal = (input?: string) => {
172+
// //pull dbName from input field and send it to the database along with the schema. - dbSpy 7.0
173+
// if (input) {
174+
// saveSchema(input);
175+
// }
176+
// setSaveDbModalClose();
177+
// };
172178

173179
// LoadDbModal
174180
// Open loadDbName Modal and send get request to database to get&list all the databases name. - dbSpy 7.0
@@ -184,7 +190,7 @@ export default function FeatureTab(props: any) {
184190
for (let saveName of res.data.data) {
185191
nameArr.push(saveName.SaveName);
186192
}
187-
setLoadDbModalOpened(true);
193+
setLoadDbModalOpen();
188194
setNameArr(nameArr);
189195
})
190196
.catch((err) => {
@@ -207,7 +213,7 @@ export default function FeatureTab(props: any) {
207213
for (let saveName of res.data.data) {
208214
nameArr.push(saveName.SaveName);
209215
}
210-
setDeleteDbModalOpened(true);
216+
setDeleteDbModalOpen();
211217
setNameArr(nameArr);
212218
})
213219
.catch((err) => {
@@ -217,89 +223,89 @@ export default function FeatureTab(props: any) {
217223
}
218224
return [];
219225
};
220-
// Load selected database - dbSpy 7.0
221-
const closeLoadDbModal = (input?: string) => {
222-
if (input) {
223-
loadSchema(input);
224-
setDBName(input);
225-
}
226-
setLoadDbModalOpened(false);
227-
};
226+
// // Load selected database - dbSpy 7.0
227+
// const closeLoadDbModal = (input?: string) => {
228+
// if (input) {
229+
// loadSchema(input);
230+
// setDBName(input);
231+
// }
232+
// setLoadDbModalClose();
233+
// };
228234
// Delete selected database - dbSpy 7.0
229-
const closeDeleteDbModal = (input?: string) => {
230-
if (input) {
231-
deleteDatabase(input);
232-
}
233-
setDeleteDbModalOpened(false);
234-
};
235+
// const closeDeleteDbModal = (input?: string) => {
236+
// if (input) {
237+
// deleteDatabase(input);
238+
// }
239+
// setDeleteDbModalOpened(false);
240+
// };
235241

236-
// Function for saving databases. Reworked for multiple saves - dbspy 7.0
237-
const saveSchema = (inputName: string): void => {
238-
//check to see if a table is present in the schemaStore
239-
if (Object.keys(schemaStore).length !== 0) {
240-
//Create request body with the schema to be saved and the inputted name to save it under
241-
const postBody = {
242-
schema: JSON.stringify(schemaStore),
243-
SaveName: inputName,
244-
TableData: JSON.stringify(dataStore),
245-
};
246-
//make a get request to see if the name already exists in the database
247-
axios
248-
.get<string[]>('/api/saveFiles/allSave')
249-
.then((res: AxiosResponse) => {
250-
const nameArr = [];
251-
for (let saveName of res.data.data) {
252-
nameArr.push(saveName.SaveName);
253-
}
254-
// if the name already exists then send to one route and if not then send to the other
255-
// route with combined middleware.
256-
if (nameArr.includes(inputName)) {
257-
axios
258-
.patch('/api/saveFiles/save', postBody)
259-
.catch((err) => console.error('err', err));
260-
} else {
261-
axios
262-
.post('/api/saveFiles/CreateAndSave', postBody)
263-
.catch((err) => console.error('err', err));
264-
}
265-
})
266-
.catch((err) => console.error('Err', err));
267-
} else {
268-
//if no table is present, send alert to the user
269-
alert('No schema displayed.');
270-
}
271-
};
242+
// // Function for saving databases. Reworked for multiple saves - dbspy 7.0
243+
// const saveSchema = (inputName: string): void => {
244+
// //check to see if a table is present in the schemaStore
245+
// if (Object.keys(schemaStore).length !== 0) {
246+
// //Create request body with the schema to be saved and the inputted name to save it under
247+
// const postBody = {
248+
// schema: JSON.stringify(schemaStore),
249+
// SaveName: inputName,
250+
// TableData: JSON.stringify(dataStore),
251+
// };
252+
// //make a get request to see if the name already exists in the database
253+
// axios
254+
// .get<string[]>('/api/saveFiles/allSave')
255+
// .then((res: AxiosResponse) => {
256+
// const nameArr = [];
257+
// for (let saveName of res.data.data) {
258+
// nameArr.push(saveName.SaveName);
259+
// }
260+
// // if the name already exists then send to one route and if not then send to the other
261+
// // route with combined middleware.
262+
// if (nameArr.includes(inputName)) {
263+
// axios
264+
// .patch('/api/saveFiles/save', postBody)
265+
// .catch((err) => console.error('err', err));
266+
// } else {
267+
// axios
268+
// .post('/api/saveFiles/CreateAndSave', postBody)
269+
// .catch((err) => console.error('err', err));
270+
// }
271+
// })
272+
// .catch((err) => console.error('Err', err));
273+
// } else {
274+
// //if no table is present, send alert to the user
275+
// alert('No schema displayed.');
276+
// }
277+
// };
272278

273-
// Reworked for multiple loads - dbSpy 7.0
274-
const loadSchema = async (inputName: string) => {
275-
try {
276-
//send the inputName along with the get request as query in the parameters.
277-
const data = await fetch(`/api/saveFiles/loadSave?SaveName=${inputName}`);
278-
if (data.status === 204) return alert('No database stored!');
279-
const schemaString = await data.json();
280-
281-
setDataStore(JSON.parse(schemaString.tableData));
282-
283-
return setSchemaStore(JSON.parse(schemaString.data));
284-
} catch (err) {
285-
console.log(err);
286-
console.error('err retrieve', err);
287-
window.alert(err);
288-
}
289-
};
279+
// // Reworked for multiple loads - dbSpy 7.0
280+
// const loadSchema = async (inputName: string) => {
281+
// try {
282+
// //send the inputName along with the get request as query in the parameters.
283+
// const data = await fetch(`/api/saveFiles/loadSave?SaveName=${inputName}`);
284+
// if (data.status === 204) return alert('No database stored!');
285+
// const schemaString = await data.json();
286+
287+
// setDataStore(JSON.parse(schemaString.tableData));
288+
289+
// return setSchemaStore(JSON.parse(schemaString.data));
290+
// } catch (err) {
291+
// console.log(err);
292+
// console.error('err retrieve', err);
293+
// window.alert(err);
294+
// }
295+
// };
290296
// Function for deleting databases - dbspy 7.0
291-
const deleteDatabase = (inputName: string) => {
292-
try {
293-
//send the inputName along with the delete request as query in the parameters.
294-
axios
295-
.delete(`/api/saveFiles/deleteSave/${inputName}`)
296-
.catch((err) => console.error('err', err));
297-
} catch (err) {
298-
console.log(err);
299-
console.error('err retrieve', err);
300-
window.alert(err);
301-
}
302-
};
297+
// const deleteDatabase = (inputName: string) => {
298+
// try {
299+
// //send the inputName along with the delete request as query in the parameters.
300+
// axios
301+
// .delete(`/api/saveFiles/deleteSave/${inputName}`)
302+
// .catch((err) => console.error('err', err));
303+
// } catch (err) {
304+
// console.log(err);
305+
// console.error('err retrieve', err);
306+
// window.alert(err);
307+
// }
308+
// };
303309

304310
// END: HELPER FUNCTIONS
305311

@@ -543,15 +549,15 @@ export default function FeatureTab(props: any) {
543549
{/* Query Output Modal */}
544550
{/* Sending props to child components. */}
545551
{/* {queryModalOpened ? <QueryModal closeQueryModal={closeQueryModal} /> : null} */}
546-
{saveDbNameModalOpened ? (
547-
<DbNameInput closeSaveDbNameModal={closeSaveDbNameModal} />
548-
) : null}
549-
{loadDbModalOpened ? (
552+
{/* {saveDbModalOpened ? (
553+
<DbNameInput closeSaveDbNameModal={setSaveDbModalClose} />
554+
) : null} */}
555+
{/* {loadDbModalOpened ? (
550556
<LoadDbModal nameArr={nameArr} closeLoadDbModal={closeLoadDbModal} />
551-
) : null}
552-
{deleteDbModalOpened ? (
557+
) : null} */}
558+
{/* {deleteDbModalOpened ? (
553559
<DeleteDbModal nameArr={nameArr} closeDeleteDbModal={closeDeleteDbModal} />
554-
) : null}
560+
) : null} */}
555561
</div>
556562
</>
557563
);

0 commit comments

Comments
 (0)