Improve the updating of Profiles view's list by making fs checks …

…asynchronous

- Changes have been made to `updateProfileList()` function.
- End results have not been changed, only getting there has been improved.

src/components/profiles-modals/DeleteProfileModal.vue

@@ -1,27 +1,19 @@
 <script lang="ts">
 import { Vue, Component } from 'vue-property-decorator';
 import { ModalCard } from "../all";
-import FileUtils from "../../utils/FileUtils";
 import R2Error from "../../model/errors/R2Error";
-import Profile from "../../model/Profile";
 import FsProvider from "../../providers/generic/file/FsProvider";
 
-
 let fs: FsProvider;
 
 @Component({
     components: {ModalCard}
 })
 export default class DeleteProfileModal extends Vue {
-
     async created() {
         fs = FsProvider.instance;
     }
 
-    get activeProfile(): Profile {
-        return this.$store.getters['profile/activeProfile'];
-    }
-
     get isOpen(): boolean {
         return this.$store.state.modals.isDeleteProfileModalOpen;
     }
@@ -34,27 +26,13 @@ export default class DeleteProfileModal extends Vue {
         this.$store.commit('closeDeleteProfileModal');
     }
 
-    async removeProfileAfterConfirmation() {
+    async removeProfile() {
         try {
-            await FileUtils.emptyDirectory(this.activeProfile.getPathOfProfile());
-            await fs.rmdir(this.activeProfile.getPathOfProfile());
+            await this.$store.dispatch('profiles/removeSelectedProfile', {fs: fs, store: this.$store});
         } catch (e) {
-            const err = R2Error.fromThrownValue(e, 'Error whilst deleting profile');
+            const err = R2Error.fromThrownValue(e, 'Error whilst deleting profile with DeleteProfileModal');
             this.$store.commit('error/handleError', err);
         }
-        if (
-            this.activeProfile
-                .getProfileName()
-                .toLowerCase() !== 'default'
-        ) {
-            for (let profileIteration = 0; profileIteration < this.profileList.length; profileIteration++) {
-                if (this.profileList[profileIteration] === this.activeProfile.getProfileName()) {
-                    this.$store.commit('profiles/spliceProfileList', profileIteration);
-                    break;
-                }
-            }
-        }
-        await this.$store.dispatch('profile/updateActiveProfile', 'Default');
         this.closeDeleteProfileModal();
     }
 }
@@ -74,7 +52,7 @@ export default class DeleteProfileModal extends Vue {
         <template v-slot:footer>
             <button
                 class="button is-danger"
-                @click="removeProfileAfterConfirmation()"
+                @click="removeProfile()"
             >Delete profile</button>
         </template>
 

src/pages/Profiles.vue

@@ -361,7 +361,7 @@ export default class Profiles extends Vue {
         if (safeName === '') {
             return;
         }
-        this.$store.commit('profiles/pushToProfileList', safeName);
+        this.$store.commit('profiles/setProfileList', [...this.profileList, safeName].sort());
         await this.setSelectedProfile(safeName);
         this.addingProfile = false;
         document.dispatchEvent(new CustomEvent("created-profile", {detail: safeName}));
@@ -603,16 +603,22 @@ export default class Profiles extends Vue {
     }
 
     async updateProfileList() {
-        let profileList = ["Default"];
         const profilesDirectory: string = this.activeProfile.getDirectory();
-        await fs.readdir(profilesDirectory).then(dirContents => {
-            dirContents.forEach(async (file: string) => {
-                if ((await fs.stat(path.join(profilesDirectory, file))).isDirectory() && file.toLowerCase() !== 'default' && file.toLowerCase() !== "_profile_update") {
-                    profileList = [...profileList, file].sort();
-                    this.$store.commit('profiles/setProfileList', profileList);
-                }
+        let profilesDirectoryContents = ['Default'];
+
+        try {
+            profilesDirectoryContents = await fs.readdir(profilesDirectory);
+            let promises = profilesDirectoryContents.map(async function(file) {
+                return ((await fs.stat(path.join(profilesDirectory, file))).isDirectory() && file.toLowerCase() !== 'default' && file.toLowerCase() !== "_profile_update")
+                    ? file : undefined;
             });
-        }).catch(() => { /* Do nothing */ });
+            Promise.all(promises).then((profileList) => {
+                this.$store.commit('profiles/setProfileList', ["Default", ...profileList.filter(file => file)].sort());
+            })
+        } catch (e) {
+            const err = R2Error.fromThrownValue(e, 'Error whilst updating ProfileList');
+            this.$store.commit('error/handleError', err);
+        }
     }
 
     async created() {

src/store/index.ts

@@ -5,7 +5,7 @@ import ErrorModule from './modules/ErrorModule';
 import ModalsModule from './modules/ModalsModule';
 import ModFilterModule from './modules/ModFilterModule';
 import ProfileModule from './modules/ProfileModule';
-import ProfilesModule from './modules/ProfilesModule';
+import { ProfilesModule } from './modules/ProfilesModule';
 import { TsModsModule } from './modules/TsModsModule';
 import { FolderMigration } from '../migrations/FolderMigration';
 import Game from '../model/game/Game';

src/store/modules/ProfilesModule.ts

@@ -1,25 +1,51 @@
+import FileUtils from "../../utils/FileUtils";
+import R2Error from "../../model/errors/R2Error";
+import { ActionTree, Store } from "vuex";
+import { State as RootState } from "../../store";
+import Profile from "../../model/Profile";
+import FsProvider from "../../providers/generic/file/FsProvider";
+
 interface State {
     profileList: string[];
 }
 
 /**
  * State for Profiles, i.e. list for profiles in a single game/community.
  */
-export default {
+export const ProfilesModule = {
     namespaced: true,
 
     state: (): State => ({
         profileList: ['Default'],
     }),
     mutations: {
-        pushToProfileList(state: State, profile: string) {
-            state.profileList.push(profile);
-        },
-        spliceProfileList(state: State, index: number) {
-            state.profileList.splice(index, 1);
+        setProfileList(state: State, profileList: string[]) {
+            state.profileList = profileList;
         },
-        setProfileList(state: State, list: string[]) {
-            state.profileList = list;
+    },
+    actions: <ActionTree<State, RootState>>{
+        async removeSelectedProfile({commit, rootGetters, state, dispatch}, params: {fs: FsProvider, store: Store<any>}) {
+            const activeProfile: Profile = rootGetters['profile/activeProfile'];
+            const path = activeProfile.getPathOfProfile();
+            const profileName = activeProfile.getProfileName();
+
+            try {
+                await FileUtils.emptyDirectory(path);
+                await params.fs.rmdir(path);
+            } catch (e) {
+                const err = R2Error.fromThrownValue(e, 'Error whilst deleting profile from disk');
+                await params.store.dispatch('error/handleError', err);
+            }
+
+            if (profileName.toLowerCase() !== 'default') {
+                try {
+                    state.profileList = state.profileList.filter((p: string) => p !== profileName)
+                    await params.store.dispatch('profile/updateActiveProfile', 'Default');
+                } catch (e) {
+                    const err = R2Error.fromThrownValue(e, 'Error whilst deleting profile from vuex storage');
+                    await params.store.dispatch('error/handleError', err);
+                }
+            }
         },
     },
 }