Continue refactoring mod downloading, added a few todo comments

src/components/views/DownloadModModal.vue

@@ -1,14 +1,14 @@
 <template>
     <div>
-        <div id='downloadProgressModal' :class="['modal', {'is-active':activeDownloadModName}]" v-if="activeDownloadModName">
+        <div id='downloadProgressModal' :class="['modal', {'is-active':activeDownload}]" v-if="activeDownload">
             <div class="modal-background" @click="closeModal();"></div>
             <div class='modal-content'>
                 <div class='notification is-info'>
-                    <h3 class='title'>Downloading {{activeDownloadModName}}</h3>
-                    <p>{{Math.floor(activeDownloadProgress)}}% complete</p>
+                    <h3 class='title'>Downloading {{activeDownload.modName}}</h3>
+                    <p>{{Math.floor(activeDownload.downloadProgress)}}% complete</p>
                     <Progress
                         :max='100'
-                        :value='activeDownloadProgress'
+                        :value='activeDownload.downloadProgress'
                         :className="['is-dark']"
                     />
                 </div>
@@ -107,6 +107,7 @@ import ConflictManagementProvider from '../../providers/generic/installing/Confl
 import { MOD_LOADER_VARIANTS } from '../../r2mm/installing/profile_installers/ModLoaderVariantRecord';
 import ModalCard from '../ModalCard.vue';
 import * as PackageDb from '../../r2mm/manager/PackageDexieStore';
+import { ProgressItem } from "../../store/modules/DownloadModule";
 import { installModsToProfile } from '../../utils/ProfileUtils';
 
 interface DownloadProgress {
@@ -137,12 +138,8 @@ let assignId = 0;
         static allVersions: [number, DownloadProgress][] = [];
 
 
-        get activeDownloadProgress(): number {
-            return this.$store.getters['modDownload/activeDownloadProgress'];
-        }
-
-        get activeDownloadModName() {
-            return this.$store.getters['modDownload/activeDownloadModName'];
+        get activeDownload(): ProgressItem | undefined {
+            return this.$store.getters['download/activeDownload'];
         }
 
         get activeGame(): Game {
@@ -268,7 +265,6 @@ let assignId = 0;
 
         closeModal() {
             this.$store.commit("closeDownloadModModal");
-            this.$store.commit("modDownload/reset");
         }
 
         async downloadThunderstoreMod() {
@@ -340,12 +336,15 @@ let assignId = 0;
             this.closeModal();
             this.downloadingMod = true;
 
-            let tsCombo: ThunderstoreCombo = new ThunderstoreCombo();
+            let tsCombo = new ThunderstoreCombo();
             tsCombo.setMod(tsMod);
             tsCombo.setVersion(tsVersion);
 
+            //TODO: Remove the completedCallback and await instead
+            //TODO: Once the above is done, close the modal when the downloading and installation are completed.
+
             await this.$store.dispatch(
-                'modDownload/downloadAndInstallMod',
+                'download/downloadAndInstallMod',
                 { profile: this.profile.asImmutableProfile(), mod: tsCombo }
             ).catch((reason) => this.$store.commit('error/handleError', R2Error.fromThrownValue(reason)));
         }

src/store/index.ts

@@ -7,13 +7,13 @@ import ModFilterModule from './modules/ModFilterModule';
 import ProfileModule from './modules/ProfileModule';
 import { ProfilesModule } from './modules/ProfilesModule';
 import { TsModsModule } from './modules/TsModsModule';
+import { DownloadModule } from './modules/DownloadModule';
 import { FolderMigration } from '../migrations/FolderMigration';
 import Game from '../model/game/Game';
 import GameManager from '../model/game/GameManager';
 import R2Error from '../model/errors/R2Error';
 import { getModLoaderPackageNames } from '../r2mm/installing/profile_installers/ModLoaderVariantRecord';
 import ManagerSettings from '../r2mm/manager/ManagerSettings';
-import ModDownloadModule from "../store/modules/ModDownloadModule";
 
 Vue.use(Vuex);
 
@@ -129,7 +129,7 @@ export const store = {
         profile: ProfileModule,
         profiles: ProfilesModule,
         tsMods: TsModsModule,
-        modDownload: ModDownloadModule,
+        download: DownloadModule,
     },
 
     // enable strict mode (adds overhead!)

src/store/modules/ModDownloadModule.ts → src/store/modules/DownloadModule.ts

@@ -1,64 +1,46 @@
 import {ActionTree, GetterTree} from 'vuex';
 
-import StatusEnum from '../../model/enums/StatusEnum';
 import {ImmutableProfile} from '../../model/Profile';
 import ThunderstoreCombo from '../../model/ThunderstoreCombo';
 import ThunderstoreDownloaderProvider from '../../providers/ror2/downloading/ThunderstoreDownloaderProvider';
 import {State as RootState} from '../index';
 import R2Error from "../../model/errors/R2Error";
 
-interface ProgressItem {
+// TODO: Replace the "enum" in '../../model/enums/StatusEnum' with a proper enum like this one.
+enum StatusEnum {
+    FAILURE = 0,
+    PENDING = 1,
+    SUCCESS = 2,
+}
+
+export interface ProgressItem {
     modName: string;
     installProgress: number;
     downloadProgress: number;
-    status: number; // StatusEnum
+    status: StatusEnum;
     error: R2Error | null;
 }
 
 interface State {
     downloads: ProgressItem[];
-    dependencyDownloads: ProgressItem[];
 }
 
 /**
  * State for Mod Downloading/Installation.
  */
-export default {
+export const DownloadModule = {
     namespaced: true,
 
     state: (): State => ({
         downloads: [],
-        dependencyDownloads: [],
     }),
 
     getters: <GetterTree<State, RootState>>{
-        allDownloads(state): ProgressItem[] {
-            return state.downloads;
-        },
-        activeDownload(state): ProgressItem {
+        activeDownload(state): ProgressItem | undefined {
             return state.downloads.slice(-1)[0]; // Last element of the array
         },
-        activeDownloadProgress(state): number | undefined {
-            if (state.downloads.length > 0) {
-                return state.downloads.slice(-1)[0].downloadProgress; // Last element of the array
-            }
-        },
-        activeDownloadModName(state): string | undefined {
-            if (state.downloads.length > 0) {
-                return state.downloads.slice(-1)[0].modName; // Last element of the array
-            }
-        },
-        activeDownloadProgressItem(state): ProgressItem | undefined {
-            if (state.downloads.length > 0) {
-                return state.downloads.slice(-1)[0]; // Last element of the array
-            }
-        },
     },
     mutations: {
-        reset(state: State) {
-            state.downloads = [];
-            state.dependencyDownloads = [];
-        },
         addDownload(state: State, modName: string) {
             state.downloads.push({
                 modName: modName,
@@ -71,21 +53,16 @@ export default {
         updateDownloadProgress(state: State, params: { progress: number, modName: string, status: number, err: R2Error | null }) {
             let downloadMod = state.downloads.find((progressItem) => progressItem.modName === params.modName);
 
-            if (!downloadMod) {
-                state.dependencyDownloads.push({
-                    modName: params.modName,
-                    installProgress: 0,
-                    downloadProgress: 0,
-                    status: StatusEnum.PENDING,
-                    error: null
-                });
-                downloadMod = state.dependencyDownloads.find((progressItem) => progressItem.modName === params.modName);
-            }
+            // Doesn't do anything when the downloaded mod is not found in the array (which means it is a dependency).
+            // TODO: figure out if/how/where to track/display these dependencies' progresses.
+            // Might be affected by removing the completedCallback as one way to do it is to have it return
+            // a list of all of the downloaded mods (including the dependencies).
 
             if (downloadMod) {
                 downloadMod.downloadProgress = params.progress;
                 downloadMod.status = params.status;
                 if (params.status === StatusEnum.FAILURE && params.err) {
+                    // TODO: do something with these failed downloads, i.e. display the error(s) to the user.
                     downloadMod.error = params.err;
                 }
             }
@@ -101,13 +78,7 @@ export default {
                 mod: ThunderstoreCombo,
             }
         ) {
-            state.downloads.push({
-                modName: params.mod.getMod().getName(),
-                installProgress: 0,
-                downloadProgress: 0,
-                status: StatusEnum.PENDING,
-                error: null
-            });
+            commit('addDownload', { modName: params.mod.getMod().getName() });
 
             ThunderstoreDownloaderProvider.instance.download(
                 params.profile,
@@ -117,6 +88,7 @@ export default {
                 (progress, modName, status, err) => {
                     commit('updateDownloadProgress', { progress, modName, status, err });
                 },
+                //TODO: refactor to remove this completedCallback and just await for the return
                 (mods) => {
                     mods.forEach((mod) => {
                         commit(