feat: added release channel toggle to debug menu

it is saved to the items table and requires an app restart

ts/components/dialog/debug/DebugMenuModal.tsx

@@ -7,6 +7,7 @@ import { updateDebugMenuModal } from '../../../state/ducks/modalDialog';
 import { AboutInfo, DebugActions, OtherInfo } from './components';
 import { SessionWrapperModal } from '../../SessionWrapperModal';
 import { FeatureFlags } from './FeatureFlags';
+import { ReleaseChannel } from './ReleaseChannel';
 
 const StyledContent = styled(Flex)`
   padding-inline: var(--margins-sm);
@@ -50,7 +51,9 @@ export function DebugMenuModal() {
           <DebugActions />
           <SpacerSM />
           <FeatureFlags flags={window.sessionFeatureFlags} />
-          <SpacerMD />
+          <SpacerSM />
+          <ReleaseChannel />
+          <SpacerSM />
           <AboutInfo />
           <OtherInfo />
           <SpacerMD />

ts/components/dialog/debug/ReleaseChannel.tsx

@@ -0,0 +1,93 @@
+import { capitalize } from 'lodash';
+import { useDispatch } from 'react-redux';
+import useUpdate from 'react-use/lib/useUpdate';
+import { localize } from '../../../localization/localeTools';
+import { updateConfirmModal } from '../../../state/ducks/modalDialog';
+import { Flex } from '../../basic/Flex';
+import { SessionButtonColor } from '../../basic/SessionButton';
+import { SessionRadioGroup } from '../../basic/SessionRadioGroup';
+import { HintText } from '../../basic/Text';
+import { ALPHA_CHANNEL, LATEST_CHANNEL, type ReleaseChannels } from '../../../updater/types';
+import { Storage } from '../../../util/storage';
+
+const items = [
+  {
+    label: capitalize(LATEST_CHANNEL),
+    value: LATEST_CHANNEL,
+    inputDataTestId: `input-releases-${LATEST_CHANNEL}` as const,
+    labelDataTestId: `label-releases-${LATEST_CHANNEL}` as const,
+  },
+  {
+    label: capitalize(ALPHA_CHANNEL),
+    value: ALPHA_CHANNEL,
+    inputDataTestId: `input-releases-${ALPHA_CHANNEL}` as const,
+    labelDataTestId: `label-releases-${ALPHA_CHANNEL}` as const,
+  },
+];
+
+export const ReleaseChannel = () => {
+  const forceUpdate = useUpdate();
+  const releaseChannel = Storage.get('releaseChannel') as ReleaseChannels;
+
+  const dispatch = useDispatch();
+
+  const changeReleaseChannel = (channel: ReleaseChannels) => {
+    window.log.debug(
+      `WIP: [debugMenu] release channel to ${channel} was ${Storage.get('releaseChannel') || 'not set'}`
+    );
+    if (Storage.get('releaseChannel') === channel) {
+      return;
+    }
+    dispatch(
+      updateConfirmModal({
+        title: localize('warning').toString(),
+        i18nMessage: { token: 'settingsRestartDescription' },
+        okTheme: SessionButtonColor.Danger,
+        okText: localize('restart').toString(),
+        onClickOk: async () => {
+          try {
+            await Storage.put('releaseChannel', channel);
+          } catch (error) {
+            window.log.warn(
+              `[debugMenu] Something went wrong when changing the release channel to ${channel}  was ${Storage.get('releaseChannel') || 'not set'}:`,
+              error && error.stack ? error.stack : error
+            );
+          } finally {
+            window.restart();
+          }
+        },
+        onClickCancel: () => {
+          window.inboxStore?.dispatch(updateConfirmModal(null));
+          forceUpdate();
+        },
+      })
+    );
+  };
+
+  return (
+    <Flex
+      container={true}
+      width={'100%'}
+      flexDirection="column"
+      justifyContent="flex-start"
+      alignItems="flex-start"
+      flexGap="var(--margins-xs)"
+    >
+      <Flex container={true} alignItems="center">
+        <h2>Release Channel</h2>
+        <HintText>Experimental</HintText>
+      </Flex>
+      <SessionRadioGroup
+        group="release_channel"
+        initialItem={releaseChannel}
+        items={items}
+        onClick={value => {
+          if (value === LATEST_CHANNEL || value === ALPHA_CHANNEL) {
+            changeReleaseChannel(value);
+          }
+        }}
+        style={{ margin: 0 }}
+      />
+    </Flex>
+  );
+};

ts/react.d.ts

@@ -252,7 +252,11 @@ declare module 'react' {
     | 'module-message-search-result__header__name__profile-name'
     | 'module-message__author__profile-name'
     | 'module-contact-name__profile-name'
-    | 'delete-from-details';
+    | 'delete-from-details'
+    | 'input-releases-latest'
+    | 'input-releases-alpha'
+    | 'label-releases-latest'
+    | 'label-releases-alpha';
 
   interface HTMLAttributes {
     'data-testid'?: SessionDataTestId;

ts/updater/types.ts

@@ -0,0 +1,4 @@
+export const LATEST_CHANNEL = 'latest' as const;
+export const ALPHA_CHANNEL = 'alpha' as const;
+
+export type ReleaseChannels = typeof LATEST_CHANNEL | typeof ALPHA_CHANNEL;