Show all labs flags if developerMode enabled (#11746)

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

src/IConfigOptions.ts

@@ -95,7 +95,7 @@ export interface IConfigOptions {
     integrations_rest_url?: string;
     integrations_widgets_urls?: string[];
 
-    show_labs_settings?: boolean;
+    show_labs_settings: boolean;
     features?: Record<string, boolean>; // <FeatureName, EnabledBool>
 
     bug_report_endpoint_url?: string; // omission disables bug reporting

src/SdkConfig.ts

@@ -31,6 +31,7 @@ export const DEFAULTS: DeepReadonly<IConfigOptions> = {
     integrations_ui_url: "https://scalar.vector.im/",
     integrations_rest_url: "https://scalar.vector.im/api",
     uisi_autorageshake_app: "element-auto-uisi",
+    show_labs_settings: false,
 
     jitsi: {
         preferred_domain: "meet.element.io",

src/components/views/dialogs/UserSettingsDialog.tsx

@@ -21,14 +21,13 @@ import TabbedView, { Tab } from "../../structures/TabbedView";
 import { _t, _td } from "../../../languageHandler";
 import GeneralUserSettingsTab from "../settings/tabs/user/GeneralUserSettingsTab";
 import SettingsStore, { CallbackFn } from "../../../settings/SettingsStore";
-import LabsUserSettingsTab from "../settings/tabs/user/LabsUserSettingsTab";
+import LabsUserSettingsTab, { showLabsFlags } from "../settings/tabs/user/LabsUserSettingsTab";
 import AppearanceUserSettingsTab from "../settings/tabs/user/AppearanceUserSettingsTab";
 import SecurityUserSettingsTab from "../settings/tabs/user/SecurityUserSettingsTab";
 import NotificationUserSettingsTab from "../settings/tabs/user/NotificationUserSettingsTab";
 import PreferencesUserSettingsTab from "../settings/tabs/user/PreferencesUserSettingsTab";
 import VoiceUserSettingsTab from "../settings/tabs/user/VoiceUserSettingsTab";
 import HelpUserSettingsTab from "../settings/tabs/user/HelpUserSettingsTab";
-import SdkConfig from "../../../SdkConfig";
 import MjolnirUserSettingsTab from "../settings/tabs/user/MjolnirUserSettingsTab";
 import { UIFeature } from "../../../settings/UIFeature";
 import BaseDialog from "./BaseDialog";
@@ -161,10 +160,7 @@ export default class UserSettingsDialog extends React.Component<IProps, IState>
             ),
         );
         // Show the Labs tab if enabled or if there are any active betas
-        if (
-            SdkConfig.get("show_labs_settings") ||
-            SettingsStore.getFeatureSettingNames().some((k) => SettingsStore.getBetaInfo(k))
-        ) {
+        if (showLabsFlags() || SettingsStore.getFeatureSettingNames().some((k) => SettingsStore.getBetaInfo(k))) {
             tabs.push(
                 new Tab(
                     UserTab.Labs,

src/components/views/settings/tabs/user/KeyboardUserSettingsTab.tsx

@@ -18,7 +18,6 @@ limitations under the License.
 import React from "react";
 
 import { ICategory, CATEGORIES, CategoryName, KeyBindingAction } from "../../../../../accessibility/KeyboardShortcuts";
-import SdkConfig from "../../../../../SdkConfig";
 import { _t } from "../../../../../languageHandler";
 import {
     getKeyboardShortcutDisplayName,
@@ -28,6 +27,7 @@ import { KeyboardShortcut } from "../../KeyboardShortcut";
 import SettingsTab from "../SettingsTab";
 import { SettingsSection } from "../../shared/SettingsSection";
 import SettingsSubsection from "../../shared/SettingsSubsection";
+import { showLabsFlags } from "./LabsUserSettingsTab";
 
 interface IKeyboardShortcutRowProps {
     name: KeyBindingAction;
@@ -35,7 +35,7 @@ interface IKeyboardShortcutRowProps {
 
 // Filter out the labs section if labs aren't enabled.
 const visibleCategories = (Object.entries(CATEGORIES) as [CategoryName, ICategory][]).filter(
-    ([categoryName]) => categoryName !== CategoryName.LABS || SdkConfig.get("show_labs_settings"),
+    ([categoryName]) => categoryName !== CategoryName.LABS || showLabsFlags(),
 );
 
 const KeyboardShortcutRow: React.FC<IKeyboardShortcutRowProps> = ({ name }) => {

src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx

@@ -29,6 +29,10 @@ import { SettingsSection } from "../../shared/SettingsSection";
 import SettingsSubsection, { SettingsSubsectionText } from "../../shared/SettingsSubsection";
 import SettingsTab from "../SettingsTab";
 
+export const showLabsFlags = (): boolean => {
+    return SdkConfig.get("show_labs_settings") || SettingsStore.getValue("developerMode");
+};
+
 export default class LabsUserSettingsTab extends React.Component<{}> {
     private readonly labs: string[];
     private readonly betas: string[];
@@ -48,7 +52,7 @@ export default class LabsUserSettingsTab extends React.Component<{}> {
         this.labs = labs;
         this.betas = betas;
 
-        if (!SdkConfig.get("show_labs_settings")) {
+        if (!showLabsFlags()) {
             this.labs = [];
         }
     }