Switch to using single source of truth for selected update channel

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

src/behaviours/preferences/__snapshots__/closing-preferences.test.tsx.snap

@@ -356,13 +356,12 @@ exports[`preferences - closing-preferences given accessing preferences directly
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -370,7 +369,6 @@ exports[`preferences - closing-preferences given accessing preferences directly
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"
@@ -1066,13 +1064,12 @@ exports[`preferences - closing-preferences given already in a page and then navi
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -1080,7 +1077,6 @@ exports[`preferences - closing-preferences given already in a page and then navi
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"

src/behaviours/preferences/__snapshots__/navigation-to-application-preferences.test.ts.snap

@@ -549,13 +549,12 @@ exports[`preferences - navigation to application preferences given in some child
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -563,7 +562,6 @@ exports[`preferences - navigation to application preferences given in some child
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"

src/behaviours/preferences/__snapshots__/navigation-to-editor-preferences.test.ts.snap

@@ -344,13 +344,12 @@ exports[`preferences - navigation to editor preferences given in preferences, wh
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -358,7 +357,6 @@ exports[`preferences - navigation to editor preferences given in preferences, wh
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"

src/behaviours/preferences/__snapshots__/navigation-to-extension-specific-preferences.test.tsx.snap

@@ -344,13 +344,12 @@ exports[`preferences - navigation to extension specific preferences given in pre
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -358,7 +357,6 @@ exports[`preferences - navigation to extension specific preferences given in pre
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"
@@ -887,13 +885,12 @@ exports[`preferences - navigation to extension specific preferences given in pre
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -901,7 +898,6 @@ exports[`preferences - navigation to extension specific preferences given in pre
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"

src/behaviours/preferences/__snapshots__/navigation-to-kubernetes-preferences.test.ts.snap

@@ -344,13 +344,12 @@ exports[`preferences - navigation to kubernetes preferences given in preferences
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -358,7 +357,6 @@ exports[`preferences - navigation to kubernetes preferences given in preferences
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"

src/behaviours/preferences/__snapshots__/navigation-to-proxy-preferences.test.ts.snap

@@ -344,13 +344,12 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -358,7 +357,6 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"

src/behaviours/preferences/__snapshots__/navigation-to-telemetry-preferences.test.tsx.snap

@@ -535,13 +535,12 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -549,7 +548,6 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"
@@ -1078,13 +1076,12 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -1092,7 +1089,6 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"

src/behaviours/preferences/__snapshots__/navigation-to-terminal-preferences.test.ts.snap

@@ -344,13 +344,12 @@ exports[`preferences - navigation to terminal preferences given in preferences,
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -358,7 +357,6 @@ exports[`preferences - navigation to terminal preferences given in preferences,
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"

src/behaviours/preferences/__snapshots__/navigation-using-application-menu.test.ts.snap

@@ -352,13 +352,12 @@ exports[`preferences - navigation using application menu when navigating to pref
                 class="Select__control css-1s2u09g-control"
               >
                 <div
-                  class="Select__value-container css-319lph-ValueContainer"
+                  class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                 >
                   <div
-                    class="Select__placeholder css-14el2xx-placeholder"
+                    class="Select__single-value css-qc6sy-singleValue"
-                    id="react-select-update-channel-input-placeholder"
                   >
-                    Select...
+                    Stable
                   </div>
                   <div
                     class="Select__input-container css-6j8wv5-Input"
@@ -366,7 +365,6 @@ exports[`preferences - navigation using application menu when navigating to pref
                   >
                     <input
                       aria-autocomplete="list"
-                      aria-describedby="react-select-update-channel-input-placeholder"
                       aria-expanded="false"
                       aria-haspopup="true"
                       autocapitalize="none"

src/behaviours/preferences/__snapshots__/navigation-using-tray.test.ts.snap

@@ -355,13 +355,12 @@ exports[`show-about-using-tray when navigating using tray renders 1`] = `
                   class="Select__control css-1s2u09g-control"
                 >
                   <div
-                    class="Select__value-container css-319lph-ValueContainer"
+                    class="Select__value-container Select__value-container--has-value css-319lph-ValueContainer"
                   >
                     <div
-                      class="Select__placeholder css-14el2xx-placeholder"
+                      class="Select__single-value css-qc6sy-singleValue"
-                      id="react-select-update-channel-input-placeholder"
                     >
-                      Select...
+                      Stable
                     </div>
                     <div
                       class="Select__input-container css-6j8wv5-Input"
@@ -369,7 +368,6 @@ exports[`show-about-using-tray when navigating using tray renders 1`] = `
                     >
                       <input
                         aria-autocomplete="list"
-                        aria-describedby="react-select-update-channel-input-placeholder"
                         aria-expanded="false"
                         aria-haspopup="true"
                         autocapitalize="none"

src/common/user-store/preferences-helpers.ts

@@ -6,14 +6,11 @@
 import moment from "moment-timezone";
 import path from "path";
 import os from "os";
-import { getAppVersion } from "../utils";
 import type { editor } from "monaco-editor";
 import merge from "lodash/merge";
-import { SemVer } from "semver";
 import { defaultThemeId, defaultEditorFontFamily, defaultFontSize, defaultTerminalFontFamily } from "../vars";
 import type { ObservableMap } from "mobx";
 import { observable } from "mobx";
-import { readonly } from "../utils/readonly";
 
 export interface KubeconfigSyncEntry extends KubeconfigSyncValue {
   filePath: string;
@@ -296,38 +293,6 @@ const terminalConfig: PreferenceDescription<TerminalConfig, TerminalConfig> = {
   },
 };
 
-export interface UpdateChannelInfo {
-  label: string;
-}
-
-export const updateChannels = readonly(new Map<string, UpdateChannelInfo>([
-  ["latest", {
-    label: "Stable",
-  }],
-  ["beta", {
-    label: "Beta",
-  }],
-  ["alpha", {
-    label: "Alpha",
-  }],
-]));
-export const defaultUpdateChannel = new SemVer(getAppVersion()).prerelease[0]?.toString() || "latest";
-
-const updateChannel: PreferenceDescription<string> = {
-  fromStore(val) {
-    return !val || !updateChannels.has(val)
-      ? defaultUpdateChannel
-      : val;
-  },
-  toStore(val) {
-    if (!updateChannels.has(val) || val === defaultUpdateChannel) {
-      return undefined;
-    }
-
-    return val;
-  },
-};
-
 export type ExtensionRegistryLocation = "default" | "npmrc" | "custom";
 
 export type ExtensionRegistry = {
@@ -365,7 +330,7 @@ export type UserStoreFlatModel = {
 
 export type UserPreferencesModel = {
   [field in keyof typeof DESCRIPTORS]: PreferencesModelType<field>;
-};
+} & { updateChannel: string };
 
 export const DESCRIPTORS = {
   httpsProxy,
@@ -385,6 +350,5 @@ export const DESCRIPTORS = {
   editorConfiguration,
   terminalCopyOnSelect,
   terminalConfig,
-  updateChannel,
   extensionRegistryUrl,
 };

src/common/user-store/user-store.injectable.ts

@@ -6,6 +6,7 @@ import { getInjectable } from "@ogre-tools/injectable";
 import { ipcMain } from "electron";
 import userStoreFileNameMigrationInjectable from "./file-name-migration.injectable";
 import { UserStore } from "./user-store";
+import selectedUpdateChannelInjectable from "../application-update/selected-update-channel/selected-update-channel.injectable";
 
 const userStoreInjectable = getInjectable({
   id: "user-store",
@@ -17,7 +18,9 @@ const userStoreInjectable = getInjectable({
       di.inject(userStoreFileNameMigrationInjectable);
     }
 
-    return UserStore.createInstance();
+    return UserStore.createInstance({
+      selectedUpdateChannel: di.inject(selectedUpdateChannelInjectable),
+    });
   },
 
   causesSideEffects: true,

src/common/user-store/user-store.ts

@@ -15,15 +15,22 @@ import { getOrInsertSet, toggle, toJS, object } from "../../renderer/utils";
 import { DESCRIPTORS } from "./preferences-helpers";
 import type { UserPreferencesModel, StoreType } from "./preferences-helpers";
 import logger from "../../main/logger";
+import type { SelectedUpdateChannel } from "../application-update/selected-update-channel/selected-update-channel.injectable";
+import type { UpdateChannelId } from "../application-update/update-channels";
 
 export interface UserStoreModel {
   lastSeenAppVersion: string;
   preferences: UserPreferencesModel;
 }
 
+interface Dependencies {
+  selectedUpdateChannel: SelectedUpdateChannel;
+}
+
 export class UserStore extends BaseStore<UserStoreModel> /* implements UserStoreFlatModel (when strict null is enabled) */ {
   readonly displayName = "UserStore";
-  constructor() {
+
+  constructor(private dependencies: Dependencies) {
     super({
       configName: "lens-user-store",
       migrations,
@@ -63,7 +70,6 @@ export class UserStore extends BaseStore<UserStoreModel> /* implements UserStore
   @observable kubectlBinariesPath!: StoreType<typeof DESCRIPTORS["kubectlBinariesPath"]>;
   @observable terminalCopyOnSelect!: StoreType<typeof DESCRIPTORS["terminalCopyOnSelect"]>;
   @observable terminalConfig!: StoreType<typeof DESCRIPTORS["terminalConfig"]>;
-  @observable updateChannel!: StoreType<typeof DESCRIPTORS["updateChannel"]>;
   @observable extensionRegistryUrl!: StoreType<typeof DESCRIPTORS["extensionRegistryUrl"]>;
 
   /**
@@ -171,6 +177,11 @@ export class UserStore extends BaseStore<UserStoreModel> /* implements UserStore
         this[key] = newVal;
       }
     }
+
+    // TODO: Switch to action-based saving instead saving stores by reaction
+    if (preferences?.updateChannel) {
+      this.dependencies.selectedUpdateChannel.setValue(preferences?.updateChannel as UpdateChannelId);
+    }
   }
 
   toJSON(): UserStoreModel {
@@ -181,7 +192,12 @@ export class UserStore extends BaseStore<UserStoreModel> /* implements UserStore
 
     return toJS({
       lastSeenAppVersion: this.lastSeenAppVersion,
-      preferences,
+
+      preferences: {
+        ...preferences,
+
+        updateChannel: this.dependencies.selectedUpdateChannel.value.get().id,
+      },
     });
   }
 }

src/renderer/components/+preferences/application.tsx

@@ -12,7 +12,7 @@ import type { UserStore } from "../../../common/user-store";
 import { Input } from "../input";
 import { Switch } from "../switch";
 import moment from "moment-timezone";
-import { updateChannels, defaultExtensionRegistryUrl, defaultUpdateChannel, defaultLocaleTimezone, defaultExtensionRegistryUrlLocation } from "../../../common/user-store/preferences-helpers";
+import { defaultExtensionRegistryUrl, defaultLocaleTimezone, defaultExtensionRegistryUrlLocation } from "../../../common/user-store/preferences-helpers";
 import type { IComputedValue } from "mobx";
 import { runInAction } from "mobx";
 import { isUrl } from "../input/input_validators";
@@ -24,11 +24,17 @@ import { Preferences } from "./preferences";
 import userStoreInjectable from "../../../common/user-store/user-store.injectable";
 import themeStoreInjectable from "../../themes/store.injectable";
 import { defaultThemeId } from "../../../common/vars";
+import { updateChannels } from "../../../common/application-update/update-channels";
+import { map, toPairs } from "lodash/fp";
+import { pipeline } from "@ogre-tools/fp";
+import type { SelectedUpdateChannel } from "../../../common/application-update/selected-update-channel/selected-update-channel.injectable";
+import selectedUpdateChannelInjectable from "../../../common/application-update/selected-update-channel/selected-update-channel.injectable";
 
 interface Dependencies {
   appPreferenceItems: IComputedValue<RegisteredAppPreference[]>;
   userStore: UserStore;
   themeStore: ThemeStore;
+  selectedUpdateChannel: SelectedUpdateChannel;
 }
 
 const timezoneOptions = moment.tz.names()
@@ -36,10 +42,16 @@ const timezoneOptions = moment.tz.names()
     value: timezone,
     label: timezone.replace("_", " "),
   }));
-const updateChannelOptions = Array.from(updateChannels, ([channel, { label }]) => ({
+
-  value: channel,
+const updateChannelOptions = pipeline(
-  label,
+  toPairs(updateChannels),
-}));
+
+  map(([, channel]) => ({
+    value: channel.id,
+    label: channel.label,
+  })),
+);
+
 const extensionInstallRegistryOptions = [
   {
     value: "default",
@@ -55,7 +67,7 @@ const extensionInstallRegistryOptions = [
   },
 ] as const;
 
-const NonInjectedApplication: React.FC<Dependencies> = ({ appPreferenceItems, userStore, themeStore }) => {
+const NonInjectedApplication: React.FC<Dependencies> = ({ appPreferenceItems, userStore, themeStore, selectedUpdateChannel }) => {
   const [customUrl, setCustomUrl] = React.useState(userStore.extensionRegistryUrl.customUrl || "");
   const themeOptions = [
     {
@@ -144,8 +156,8 @@ const NonInjectedApplication: React.FC<Dependencies> = ({ appPreferenceItems, us
           <Select
             id="update-channel-input"
             options={updateChannelOptions}
-            value={userStore.updateChannel}
+            value={selectedUpdateChannel.value.get().id}
-            onChange={value => userStore.updateChannel = value?.value ?? defaultUpdateChannel}
+            onChange={(selected) => selectedUpdateChannel.setValue(selected?.value) }
             themeName="lens"
           />
         </section>
@@ -175,6 +187,7 @@ export const Application = withInjectables<Dependencies>(
       appPreferenceItems: di.inject(appPreferencesInjectable),
       userStore: di.inject(userStoreInjectable),
       themeStore: di.inject(themeStoreInjectable),
+      selectedUpdateChannel: di.inject(selectedUpdateChannelInjectable),
     }),
   },
 );