Add one switch to enable multiple flags at once (#1803)

* Add one switch to enable multiple flags at once

* changesets

* reword

* Fix rendering text outside of <Text/> component in InstallSetOfApps

* changeset

* Remove window.alert, just add some additional text in the div

.changeset/pink-monkeys-heal.md

@@ -0,0 +1,5 @@
+---
+"ledger-live-desktop": patch
+---
+
+Add a way to activate multiple Feature Flags at once

.changeset/popular-eagles-camp.md

@@ -0,0 +1,5 @@
+---
+"live-mobile": patch
+---
+
+Fix crash at the install apps step of the synchronous onboarding

.changeset/pretty-rivers-hear.md

@@ -0,0 +1,5 @@
+---
+"live-mobile": patch
+---
+
+Add a way to activate multiple Feature Flags at once

apps/ledger-live-desktop/src/renderer/screens/settings/sections/Developer/FeatureFlagsSettings/index.tsx

@@ -1,7 +1,7 @@
-import React, { useState, useMemo, useCallback } from "react";
+import React, { useState, useMemo, useCallback, useRef } from "react";
 import ButtonV2 from "~/renderer/components/Button";
 import { useTranslation } from "react-i18next";
-import { defaultFeatures } from "@ledgerhq/live-common/featureFlags/index";
+import { defaultFeatures, useFeatureFlags } from "@ledgerhq/live-common/featureFlags/index";
 import { SettingsSectionRow as Row } from "../../../SettingsSection";
 import { Input, Icons, Flex, SearchInput, Alert } from "@ledgerhq/react-ui";
 import { FeatureId } from "@ledgerhq/types-live";
@@ -46,6 +46,37 @@ export const FeatureFlagContent = withV3StyleProvider((props: { visible?: boolea
       .filter(name => !searchInput || includes(lowerCase(name), lowerCase(searchInput)));
   }, [featureFlags, searchInput]);
 
+  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const pressCount = useRef(0);
+
+  const { getFeature, overrideFeature } = useFeatureFlags();
+
+  const [cheatActivated, setCheatActivated] = useState(false);
+  const ruleThemAll = useCallback(() => {
+    (["customImage", "deviceInitialApps", "syncOnboarding"] as FeatureId[]).forEach(featureId =>
+      overrideFeature(featureId, { ...getFeature(featureId), enabled: true }),
+    );
+    setCheatActivated(true);
+  }, [overrideFeature, getFeature]);
+
+  const onDescriptionClick = useCallback(() => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+    }
+    pressCount.current += 1;
+    const timeout = setTimeout(() => {
+      pressCount.current = 0;
+    }, 300);
+    if (pressCount.current > 6) {
+      ruleThemAll();
+      pressCount.current = 0;
+    }
+    timeoutRef.current = timeout;
+    return () => {
+      clearTimeout(timeout);
+    };
+  }, [ruleThemAll]);
+
   const content = useMemo(
     () =>
       filteredFlags.map(flagName => (
@@ -61,7 +92,10 @@ export const FeatureFlagContent = withV3StyleProvider((props: { visible?: boolea
 
   return (
     <Flex flexDirection="column" pt={2} rowGap={2} alignSelf="stretch">
-      {t("settings.developer.featureFlagsDesc")}
+      <div onClick={onDescriptionClick}>
+        {t("settings.developer.featureFlagsDesc")}
+        {cheatActivated ? " With great power comes great responsibility." : null}
+      </div>
       {!props.visible ? null : (
         <>
           <SearchInput

apps/ledger-live-mobile/src/components/DeviceAction/InstallSetOfApps/index.tsx

@@ -96,19 +96,20 @@ const InstallSetOfApps = ({
               <Trans i18nKey="installSetOfApps.ongoing.loading" />
             )}
           </Text>
-          {itemProgress &&
-            dependencies?.map((appName, i) => (
-              <Item
-                key={appName}
-                i={i}
-                appName={appName}
-                isActive={currentAppOp?.name === appName}
-                installed={
-                  progress ? !installQueue?.includes(appName) : undefined
-                }
-                itemProgress={itemProgress}
-              />
-            ))}
+          {itemProgress !== undefined
+            ? dependencies?.map((appName, i) => (
+                <Item
+                  key={appName}
+                  i={i}
+                  appName={appName}
+                  isActive={currentAppOp?.name === appName}
+                  installed={
+                    progress ? !installQueue?.includes(appName) : undefined
+                  }
+                  itemProgress={itemProgress}
+                />
+              ))
+            : null}
         </Flex>
       </Flex>
       <Text textAlign="center" color="neutral.c70">

apps/ledger-live-mobile/src/screens/Settings/Debug/index.tsx

@@ -1,8 +1,11 @@
-import React from "react";
+import React, { useCallback, useRef } from "react";
 import { useNavigation } from "@react-navigation/native";
 import config from "react-native-config";
 import { Box, Text } from "@ledgerhq/native-ui";
 import { Device } from "@ledgerhq/live-common/hw/actions/types";
+import { Alert, TouchableWithoutFeedback, View } from "react-native";
+import { useFeatureFlags } from "@ledgerhq/live-common/featureFlags/provider";
+import { FeatureId } from "@ledgerhq/types-live";
 import { TrackScreen } from "../../../analytics";
 import SettingsRow from "../../../components/SettingsRow";
 import SelectDevice from "../../../components/SelectDevice";
@@ -39,6 +42,7 @@ import {
   StackNavigatorProps,
 } from "../../../components/RootNavigator/types/helpers";
 import { SettingsNavigatorStackParamList } from "../../../components/RootNavigator/types/SettingsNavigator";
+import PoweredByLedger from "../PoweredByLedger";
 import OpenStoryly from "./OpenDebugStoryly";
 
 export function DebugMocks() {
@@ -110,6 +114,45 @@ export default function DebugSettings({
   SettingsNavigatorStackParamList,
   ScreenName.DebugSettings
 >) {
+  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const pressCount = useRef(0);
+
+  const { getFeature, overrideFeature } = useFeatureFlags();
+
+  const ruleThemAll = useCallback(() => {
+    (
+      [
+        "customImage",
+        "deviceInitialApps",
+        "syncOnboarding",
+        "llmNewDeviceSelection",
+      ] as FeatureId[]
+    ).forEach(featureId =>
+      overrideFeature(featureId, { ...getFeature(featureId), enabled: true }),
+    );
+    Alert.alert(
+      "I can only show you the door, you're the one that has to walk through it.",
+    );
+  }, [overrideFeature, getFeature]);
+
+  const onDebugHiddenPress = useCallback(() => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+    }
+    pressCount.current += 1;
+    const timeout = setTimeout(() => {
+      pressCount.current = 0;
+    }, 300);
+    if (pressCount.current > 6) {
+      ruleThemAll();
+      pressCount.current = 0;
+    }
+    timeoutRef.current = timeout;
+    return () => {
+      clearTimeout(timeout);
+    };
+  }, [ruleThemAll]);
+
   return (
     <SettingsNavigationScrollView>
       <TrackScreen category="Settings" name="Debug" />
@@ -134,6 +177,11 @@ export default function DebugSettings({
           {global.HermesInternal ? "Hermes" : "Jsc"}
         </Text>
       </SettingsRow>
+      <TouchableWithoutFeedback onPress={onDebugHiddenPress}>
+        <View>
+          <PoweredByLedger />
+        </View>
+      </TouchableWithoutFeedback>
     </SettingsNavigationScrollView>
   );
 }