Skip to content

Commit 4d797b1

Browse files
lizlooneylizlooney
committed
Made fetching the list of modules async and return a promise.
1 parent ab4802b commit 4d797b1

File tree

1 file changed

+41
-70
lines changed

1 file changed

+41
-70
lines changed

‎src/App.tsx‎

Lines changed: 41 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -241,8 +241,6 @@ const App: React.FC = () => {
241241
const [storage, setStorage] = useState<commonStorage.Storage | null>(null);
242242
const [mostRecentModulePath, setMostRecentModulePath] = useState<string | null>(null);
243243
const [shownPythonToolboxCategories, setShownPythonToolboxCategories] = useState<Set<string>>(new Set());
244-
const [triggerListModules, setTriggerListModules] = useState(0);
245-
const afterListModulesSuccess = useRef<() => void>(() => {});
246244
const [modules, setModules] = useState<commonStorage.Project[]>([]);
247245
const [treeData, setTreeData] = useState<TreeDataNode[]>([]);
248246
const [treeExpandedKeys, setTreeExpandedKeys] = useState<React.Key[]>([]);
@@ -327,6 +325,7 @@ const App: React.FC = () => {
327325
}
328326
fetchMostRecentModulePath();
329327
initializeShownPythonToolboxCategories();
328+
initializeModules();
330329
}, [storage]);
331330

332331
const fetchMostRecentModulePath = async () => {
@@ -350,42 +349,30 @@ const App: React.FC = () => {
350349
}
351350
};
352351

353-
// Fetch the list of modules from storage.
354-
useEffect(() => {
355-
if (ignoreEffect()) {
356-
return;
352+
const initializeModules = async () => {
353+
const array = await fetchListOfModules();
354+
if (array.length === 0) {
355+
setNewProjectNameModalPurpose(PURPOSE_NEW_PROJECT);
356+
setNewProjectNameModalInitialValue('');
357+
setNewProjectNameModalTitle('Welcome to WPILib Blocks!');
358+
setNewProjectNameModalIsOpen(true);
357359
}
358-
// mostRecentModulePath hasn't been fetched yet. Try again in a bit.
359-
if (mostRecentModulePath == null) {
360-
setTimeout(() => {
361-
setTriggerListModules(Date.now());
362-
}, 50);
363-
return;
364-
}
365-
366-
fetchListOfModules();
367-
}, [triggerListModules]);
360+
};
368361

369-
const fetchListOfModules = async () => {
370-
try {
371-
const array = await storage.listModules();
372-
setModules(array)
373-
const callback = afterListModulesSuccess.current;
374-
afterListModulesSuccess.current = () => {};
375-
callback();
376-
377-
if (array.length === 0) {
378-
setNewProjectNameModalPurpose(PURPOSE_NEW_PROJECT);
379-
setNewProjectNameModalInitialValue('');
380-
setNewProjectNameModalTitle('Welcome to WPILib Blocks!');
381-
setNewProjectNameModalIsOpen(true);
362+
const fetchListOfModules = async (): Promise<commonStorage.Project[]> => {
363+
return new Promise(async (resolve, reject) => {
364+
try {
365+
const array = await storage.listModules();
366+
setModules(array)
367+
resolve(array);
368+
} catch (e) {
369+
console.log('Failed to load the list of modules. Caught the following error...');
370+
console.log(e);
371+
setAlertErrorMessage('Failed to load the list of modules.');
372+
setAlertErrorVisible(true);
373+
reject(new Error('Failed to load the list of modules.'));
382374
}
383-
} catch (e) {
384-
console.log('Failed to load the list of modules. Caught the following error...');
385-
console.log(e);
386-
setAlertErrorMessage('Failed to load the list of modules.');
387-
setAlertErrorVisible(true);
388-
}
375+
});
389376
};
390377

391378
// When the list of modules is set, update the treeData and treeExpandedKeys.
@@ -621,10 +608,8 @@ const App: React.FC = () => {
621608
try {
622609
await storage.createModule(
623610
commonStorage.MODULE_TYPE_PROJECT, newProjectPath, projectContent);
624-
afterListModulesSuccess.current = () => {
625-
setCurrentModulePath(newProjectPath);
626-
};
627-
setTriggerListModules(Date.now());
611+
await fetchListOfModules();
612+
setCurrentModulePath(newProjectPath);
628613
} catch (e) {
629614
console.log('Failed to create a new project. Caught the following error...');
630615
console.log(e);
@@ -636,10 +621,8 @@ const App: React.FC = () => {
636621
await storage.renameModule(
637622
currentModule.moduleType, currentModule.projectName,
638623
currentModule.moduleName, newProjectName);
639-
afterListModulesSuccess.current = () => {
640-
setCurrentModulePath(newProjectPath);
641-
};
642-
setTriggerListModules(Date.now());
624+
await fetchListOfModules();
625+
setCurrentModulePath(newProjectPath);
643626
} catch (e) {
644627
console.log('Failed to rename the project. Caught the following error...');
645628
console.log(e);
@@ -651,10 +634,8 @@ const App: React.FC = () => {
651634
await storage.copyModule(
652635
currentModule.moduleType, currentModule.projectName,
653636
currentModule.moduleName, newProjectName);
654-
afterListModulesSuccess.current = () => {
655-
setCurrentModulePath(newProjectPath);
656-
};
657-
setTriggerListModules(Date.now());
637+
await fetchListOfModules();
638+
setCurrentModulePath(newProjectPath);
658639
} catch (e) {
659640
console.log('Failed to copy the project. Caught the following error...');
660641
console.log(e);
@@ -714,10 +695,8 @@ const App: React.FC = () => {
714695
try {
715696
await storage.createModule(
716697
commonStorage.MODULE_TYPE_MECHANISM, newModulePath, mechanismContent);
717-
afterListModulesSuccess.current = () => {
718-
setCurrentModulePath(newModulePath);
719-
};
720-
setTriggerListModules(Date.now());
698+
await fetchListOfModules();
699+
setCurrentModulePath(newModulePath);
721700
} catch (e) {
722701
console.log('Failed to create a new mechanism. Caught the following error...');
723702
console.log(e);
@@ -729,10 +708,8 @@ const App: React.FC = () => {
729708
try {
730709
await storage.createModule(
731710
commonStorage.MODULE_TYPE_OPMODE, newModulePath, opModeContent);
732-
afterListModulesSuccess.current = () => {
733-
setCurrentModulePath(newModulePath);
734-
};
735-
setTriggerListModules(Date.now());
711+
await fetchListOfModules();
712+
setCurrentModulePath(newModulePath);
736713
} catch (e) {
737714
console.log('Failed to create a new OpMode. Caught the following error...');
738715
console.log(e);
@@ -744,10 +721,8 @@ const App: React.FC = () => {
744721
await storage.renameModule(
745722
currentModule.moduleType, currentModule.projectName,
746723
currentModule.moduleName, newModuleName);
747-
afterListModulesSuccess.current = () => {
748-
setCurrentModulePath(newModulePath);
749-
};
750-
setTriggerListModules(Date.now());
724+
await fetchListOfModules();
725+
setCurrentModulePath(newModulePath);
751726
} catch (e) {
752727
console.log('Failed to rename the module. Caught the following error...');
753728
console.log(e);
@@ -759,10 +734,8 @@ const App: React.FC = () => {
759734
await storage.copyModule(
760735
currentModule.moduleType, currentModule.projectName,
761736
currentModule.moduleName, newModuleName);
762-
afterListModulesSuccess.current = () => {
763-
setCurrentModulePath(newModulePath);
764-
};
765-
setTriggerListModules(Date.now());
737+
await fetchListOfModules();
738+
setCurrentModulePath(newModulePath);
766739
} catch (e) {
767740
console.log('Failed to copy the module. Caught the following error...');
768741
console.log(e);
@@ -888,7 +861,7 @@ const App: React.FC = () => {
888861
}
889862
try {
890863
await storage.deleteModule(moduleTypeToDelete, modulePathToDelete);
891-
setTriggerListModules(Date.now());
864+
await fetchListOfModules();
892865
} catch (e) {
893866
console.log('Failed to delete the project. Caught the following error...');
894867
console.log(e);
@@ -906,7 +879,7 @@ const App: React.FC = () => {
906879
setCurrentModulePath(projectPath);
907880
try {
908881
await storage.deleteModule(moduleTypeToDelete, modulePathToDelete);
909-
setTriggerListModules(Date.now());
882+
await fetchListOfModules();
910883
} catch (e) {
911884
console.log('Failed to delete the module. Caught the following error...');
912885
console.log(e);
@@ -940,11 +913,9 @@ const App: React.FC = () => {
940913
try {
941914
await storage.uploadProject(uploadProjectName, dataUrl);
942915
onSuccess('Upload successful');
943-
afterListModulesSuccess.current = () => {
944-
const uploadProjectPath = commonStorage.makeProjectPath(uploadProjectName);
945-
setCurrentModulePath(uploadProjectPath);
946-
};
947-
setTriggerListModules(Date.now());
916+
await fetchListOfModules();
917+
const uploadProjectPath = commonStorage.makeProjectPath(uploadProjectName);
918+
setCurrentModulePath(uploadProjectPath);
948919
} catch (e) {
949920
console.log('Failed to upload the project. Caught the following error...');
950921
console.log(e);

0 commit comments

Comments
 (0)