Better UX for changing the active game version (#400)

Handles #346 

Changes:
- removed save button in the versions menu
- active game version changes automatically after downloading,
redownloading, and changing selected radio button
- added toast popup so users know the active gave version was changed

src/routes/settings/versions/OfficialVersions.svelte

@@ -14,6 +14,7 @@
   import { UpdateStore } from "$lib/stores/AppStore";
   import { saveActiveVersionChange } from "$lib/rpc/config";
   import { _ } from "svelte-i18n";
+  import { toastStore } from "$lib/stores/ToastStore";
 
   let versionsLoaded = false;
   let releases: ReleaseInfo[] = [];
@@ -102,7 +103,7 @@
     versionsLoaded = true;
   }
 
-  async function saveOfficialVersionChange(evt) {
+  async function saveOfficialVersionChange() {
     const success = await saveActiveVersionChange(
       "official",
       $VersionStore.selectedVersions.official,
@@ -112,10 +113,11 @@
       $VersionStore.activeVersionName = $VersionStore.selectedVersions.official;
       $VersionStore.selectedVersions.unofficial = null;
       $VersionStore.selectedVersions.devel = null;
+      toastStore.makeToast("Saved game version!", "info");
     }
   }
 
-  async function openOfficialVersionFolder(evt) {
+  async function openOfficialVersionFolder() {
     openVersionFolder("official");
   }
 
@@ -145,6 +147,8 @@
       }
     }
     releases = releases;
+    $VersionStore.selectedVersions.official = event.detail.version;
+    await saveOfficialVersionChange();
   }
 
   async function onRemoveVersion(event: any) {

src/routes/settings/versions/UnofficialVersions.svelte

@@ -53,7 +53,7 @@
     versionsLoaded = true;
   }
 
-  async function onSaveVersionChange(evt: any) {
+  async function onSaveVersionChange() {
     const success = await saveActiveVersionChange(
       "unofficial",
       $VersionStore.selectedVersions.unofficial,
@@ -67,7 +67,7 @@
     }
   }
 
-  async function onOpenVersionFolder(evt: any) {
+  async function onOpenVersionFolder() {
     openVersionFolder("unofficial");
   }
 

src/routes/settings/versions/VersionList.svelte

@@ -1,11 +1,7 @@
 <script lang="ts">
   import type { VersionFolders } from "$lib/rpc/versions";
-  import {
-    VersionStore,
-    type VersionStoreIFace,
-  } from "$lib/stores/VersionStore";
+  import { VersionStore } from "$lib/stores/VersionStore";
   import type { ReleaseInfo } from "$lib/utils/github";
-  import IconSave from "~icons/mdi/content-save";
   import IconRefresh from "~icons/mdi/refresh";
   import IconFolderOpen from "~icons/mdi/folder-open";
   import IconGitHub from "~icons/mdi/github";
@@ -40,15 +36,6 @@
     "inline-block text-sm font-normal text-center disabled:cursor-not-allowed p-4 border-b-2 border-transparent text-gray-400 hover:text-orange-300 hover:border-orange-500 dark:hover:text-orange-300 dark:text-orange-400";
 
   const dispatch = createEventDispatcher();
-
-  function changesPending(versionStore: VersionStoreIFace): boolean {
-    return (
-      versionStore.selectedVersions[releaseType] !== null &&
-      versionStore.selectedVersions[releaseType] !== "" &&
-      versionStore.selectedVersions[releaseType] !==
-        versionStore.activeVersionName
-    );
-  }
 </script>
 
 <TabItem
@@ -69,14 +56,6 @@
         </p>
       </div>
       <div class="flex">
-        {#if changesPending($VersionStore)}
-          <Button
-            class="!p-2 mr-2 rounded-md dark:bg-green-500 hover:dark:bg-green-600 text-slate-900"
-            on:click={() => dispatch("versionChange")}
-          >
-            <IconSave aria-label={$_("settings_versions_icon_save_altText")} />
-          </Button>
-        {/if}
         <Button
           class="!p-2 mr-2 rounded-md dark:bg-orange-500 hover:dark:bg-orange-600 text-slate-900"
           on:click={() => dispatch("refreshVersions")}
@@ -121,6 +100,7 @@
                 <Radio
                   class="disabled:cursor-not-allowed p-0"
                   bind:group={$VersionStore.selectedVersions[releaseType]}
+                  on:change={() => dispatch("versionChange")}
                   value={release.version}
                   disabled={!release.isDownloaded}
                   name={`${releaseType}-release`}