🐛fix(lld) : opt-in prompt and export account tx row setting (#7731)

* 🐛fix(lld): fix scroll inside opt in prompt * 🐛fix(lld): fix export to csv when LS activated
LedgerHQ · Sep 3, 2024 · e1d6d7d · e1d6d7d
1 parent 32b33b6
commit e1d6d7d
Show file tree

Hide file tree

Showing 10 changed files with 48 additions and 28 deletions.
diff --git a/.changeset/polite-donuts-peel.md b/.changeset/polite-donuts-peel.md
@@ -0,0 +1,5 @@
+---
+"ledger-live-desktop": patch
+---
+
+Add vertical scroll inside optin prompt and correct variable name. Fix export account row from settings that was hidden when LS enabled
diff --git a/apps/ledger-live-desktop/src/newArch/features/AnalyticsOptInPrompt/hooks/useCommonLogic.tsx b/apps/ledger-live-desktop/src/newArch/features/AnalyticsOptInPrompt/hooks/useCommonLogic.tsx
@@ -30,7 +30,7 @@ export const useAnalyticsOptInPrompt = ({ entryPoint }: Props) => {
 
   const dispatch = useDispatch();
 
-  const [isAnalitycsOptInPromptOpened, setIsAnalitycsOptInPromptOpened] = useState<boolean>(false);
+  const [isAnalyticsOptInPromptOpened, setIsAnalyticsOptInPromptOpened] = useState<boolean>(false);
 
   const [nextStep, setNextStep] = useState<(() => void) | null>(null);
   const flow = trackingKeysByFlow?.[entryPoint];
@@ -45,12 +45,12 @@ export const useAnalyticsOptInPrompt = ({ entryPoint }: Props) => {
     [ABTestingVariants.variantB]: privacyPolicyUrl,
   };
 
-  const openAnalitycsOptInPrompt = useCallback(
+  const openAnalyticsOptInPrompt = useCallback(
     (routePath: string, callBack: () => void) => {
-      setIsAnalitycsOptInPromptOpened(true);
+      setIsAnalyticsOptInPromptOpened(true);
       setNextStep(() => callBack);
     },
-    [setIsAnalitycsOptInPromptOpened],
+    [setIsAnalyticsOptInPromptOpened],
   );
 
   const isEntryPointIncludedInFlagParams = lldAnalyticsOptInPromptFlag?.params?.entryPoints
@@ -71,7 +71,7 @@ export const useAnalyticsOptInPrompt = ({ entryPoint }: Props) => {
   );
 
   const onSubmit = () => {
-    setIsAnalitycsOptInPromptOpened(false);
+    setIsAnalyticsOptInPromptOpened(false);
     dispatch(setHasSeenAnalyticsOptInPrompt(true));
     if (entryPoint === EntryPoint.onboarding) {
       nextStep?.();
@@ -80,8 +80,8 @@ export const useAnalyticsOptInPrompt = ({ entryPoint }: Props) => {
   };
 
   const analyticsOptInPromptProps = {
-    onClose: () => setIsAnalitycsOptInPromptOpened(false),
-    isOpened: isAnalitycsOptInPromptOpened,
+    onClose: () => setIsAnalyticsOptInPromptOpened(false),
+    isOpened: isAnalyticsOptInPromptOpened,
     entryPoint: entryPoint,
     variant,
   };
@@ -101,8 +101,8 @@ export const useAnalyticsOptInPrompt = ({ entryPoint }: Props) => {
   };
 
   return {
-    openAnalitycsOptInPrompt,
-    setIsAnalitycsOptInPromptOpened,
+    openAnalyticsOptInPrompt,
+    setIsAnalyticsOptInPromptOpened,
     onSubmit,
     analyticsOptInPromptProps,
     isFeatureFlagsAnalyticsPrefDisplayed: isFlagEnabled,

diff --git a/...er-live-desktop/src/newArch/features/AnalyticsOptInPrompt/hooks/useDisplayOnPortfolio.tsx b/...er-live-desktop/src/newArch/features/AnalyticsOptInPrompt/hooks/useDisplayOnPortfolio.tsx
@@ -5,7 +5,7 @@ import { EntryPoint } from "../types/AnalyticsOptInPromptNavigator";
 export const useDisplayOnPortfolioAnalytics = () => {
   const {
     analyticsOptInPromptProps,
-    setIsAnalitycsOptInPromptOpened,
+    setIsAnalyticsOptInPromptOpened,
     isFeatureFlagsAnalyticsPrefDisplayed,
     onSubmit,
   } = useAnalyticsOptInPrompt({ entryPoint: EntryPoint.portfolio });
@@ -16,8 +16,8 @@ export const useDisplayOnPortfolioAnalytics = () => {
   };
 
   useEffect(() => {
-    if (isFeatureFlagsAnalyticsPrefDisplayed) setIsAnalitycsOptInPromptOpened(true);
-  }, [isFeatureFlagsAnalyticsPrefDisplayed, setIsAnalitycsOptInPromptOpened]);
+    if (isFeatureFlagsAnalyticsPrefDisplayed) setIsAnalyticsOptInPromptOpened(true);
+  }, [isFeatureFlagsAnalyticsPrefDisplayed, setIsAnalyticsOptInPromptOpened]);
 
   return {
     analyticsOptInPromptProps: extendedAnalyticsOptInPromptProps,

diff --git a/...er-live-desktop/src/newArch/features/AnalyticsOptInPrompt/screens/VariantA/Main/index.tsx b/...er-live-desktop/src/newArch/features/AnalyticsOptInPrompt/screens/VariantA/Main/index.tsx
@@ -19,7 +19,14 @@ const Main = ({ shouldWeTrack, handleOpenPrivacyPolicy }: MainProps) => {
   return (
     <>
       <Track onMount mandatory={shouldWeTrack} event={page} page={page} />
-      <Flex flexDirection={"column"} rowGap={"32px"} mx={"40px"} height={"100%"} pt={paddingTop}>
+      <Flex
+        flexDirection={"column"}
+        rowGap={"32px"}
+        mx={"40px"}
+        height={"100%"}
+        pt={paddingTop}
+        overflowY="scroll"
+      >
         <HeaderTitle title={"analyticsOptInPrompt.common.title"} />
         <MainBody handleOpenPrivacyPolicy={() => handleOpenPrivacyPolicy(page)} />
       </Flex>

diff --git a/...ve-desktop/src/newArch/features/AnalyticsOptInPrompt/screens/VariantB/Analytics/index.tsx b/...ve-desktop/src/newArch/features/AnalyticsOptInPrompt/screens/VariantB/Analytics/index.tsx
@@ -39,7 +39,13 @@ const AnalyticsScreen = ({
   return (
     <>
       <Track onMount mandatory={shouldWeTrack} event={page} page={page} />
-      <Flex flexDirection={"column"} height={"100%"} rowGap={32} pt={paddingTop}>
+      <Flex
+        flexDirection={"column"}
+        height={"100%"}
+        rowGap={32}
+        pt={paddingTop}
+        overflowY={"scroll"}
+      >
         <Header currentTheme={currentTheme} />
         <Body {...bodyProps} handleOpenPrivacyPolicy={() => handleOpenPrivacyPolicy(page)} />
       </Flex>

diff --git a/.../newArch/features/AnalyticsOptInPrompt/screens/VariantB/PersonalRecommendations/index.tsx b/.../newArch/features/AnalyticsOptInPrompt/screens/VariantB/PersonalRecommendations/index.tsx
@@ -33,7 +33,7 @@ const RecommandationsScreen = ({
   return (
     <>
       <Track onMount mandatory={shouldWeTrack} event={page} page={page} />
-      <Flex flexDirection={"column"} height={"100%"} rowGap={32}>
+      <Flex flexDirection={"column"} height={"100%"} rowGap={32} overflowY={"scroll"}>
         <Header currentTheme={currentTheme} />
         <Body {...bodyProps} handleOpenPrivacyPolicy={() => handleOpenPrivacyPolicy(page)} />
       </Flex>

diff --git a/.../ledger-live-desktop/src/newArch/features/AnalyticsOptInPrompt/screens/VariantB/index.tsx b/.../ledger-live-desktop/src/newArch/features/AnalyticsOptInPrompt/screens/VariantB/index.tsx
@@ -22,7 +22,7 @@ const VariantB = ({ entryPoint, onSubmit, step, setStep }: VariantBProps) => {
   });
   return (
     <>
-      <Flex flexDirection={"column"} mx={"40px"} height={"100%"} pt={"40"}>
+      <Flex flexDirection={"column"} mx={"40px"} height={"100%"} pt={"40"} overflowY={"scroll"}>
         {step === 0 ? (
           <AnalyticsScreen
             handleOpenPrivacyPolicy={handleOpenPrivacyPolicy}

diff --git a/apps/ledger-live-desktop/src/renderer/components/Onboarding/Screens/Welcome/index.tsx b/apps/ledger-live-desktop/src/renderer/components/Onboarding/Screens/Welcome/index.tsx
@@ -146,7 +146,7 @@ export function Welcome() {
   const {
     analyticsOptInPromptProps,
     isFeatureFlagsAnalyticsPrefDisplayed,
-    openAnalitycsOptInPrompt,
+    openAnalyticsOptInPrompt,
     onSubmit,
   } = useAnalyticsOptInPrompt({
     entryPoint: EntryPoint.onboarding,
@@ -182,7 +182,7 @@ export function Welcome() {
             variant="main"
             onClick={_ => {
               isFeatureFlagsAnalyticsPrefDisplayed
-                ? openAnalitycsOptInPrompt("Onboarding", handleAcceptTermsAndGetStarted)
+                ? openAnalyticsOptInPrompt("Onboarding", handleAcceptTermsAndGetStarted)
                 : handleAcceptTermsAndGetStarted();
             }}
             mb="5"
@@ -194,7 +194,7 @@ export function Welcome() {
             variant="main"
             onClick={_ => {
               isFeatureFlagsAnalyticsPrefDisplayed
-                ? openAnalitycsOptInPrompt("Onboarding", buyNanoX)
+                ? openAnalyticsOptInPrompt("Onboarding", buyNanoX)
                 : buyNanoX();
             }}
             outline={true}

diff --git a/apps/ledger-live-desktop/src/renderer/screens/settings/sections/Accounts/Export.tsx b/apps/ledger-live-desktop/src/renderer/screens/settings/sections/Accounts/Export.tsx
@@ -5,9 +5,12 @@ import { openModal } from "~/renderer/actions/modals";
 import Button from "~/renderer/components/Button";
 import ExportOperationsBtn from "~/renderer/components/ExportOperationsBtn";
 import { SettingsSectionRow as Row } from "../../SettingsSection";
+import { useFeature } from "@ledgerhq/live-common/featureFlags/index";
 const SectionExport = () => {
   const dispatch = useDispatch();
   const { t } = useTranslation();
+  const ledgerSyncFF = useFeature("lldWalletSync");
+
   const onModalOpen = useCallback(
     (e: SyntheticEvent<HTMLButtonElement>) => {
       e.preventDefault();
@@ -17,11 +20,13 @@ const SectionExport = () => {
   );
   return (
     <>
-      <Row title={t("settings.export.accounts.title")} desc={t("settings.export.accounts.desc")}>
-        <Button small event="Export accounts" onClick={onModalOpen} primary>
-          {t("settings.export.accounts.button")}
-        </Button>
-      </Row>
+      {!ledgerSyncFF?.enabled && (
+        <Row title={t("settings.export.accounts.title")} desc={t("settings.export.accounts.desc")}>
+          <Button small event="Export accounts" onClick={onModalOpen} primary>
+            {t("settings.export.accounts.button")}
+          </Button>
+        </Row>
+      )}
       <Row
         title={t("settings.export.operations.title")}
         desc={t("settings.export.operations.desc")}

diff --git a/apps/ledger-live-desktop/src/renderer/screens/settings/sections/Accounts/index.tsx b/apps/ledger-live-desktop/src/renderer/screens/settings/sections/Accounts/index.tsx
@@ -8,16 +8,13 @@ import SectionExport from "./Export";
 import Currencies from "./Currencies";
 import BlacklistedTokens from "./BlacklistedTokens";
 import HiddenNftCollections from "./HiddenNFTCollections";
-import { useFeature } from "@ledgerhq/live-common/featureFlags/index";
 export default function SectionAccounts() {
   const { t } = useTranslation();
 
-  const ledgerSyncFF = useFeature("lldWalletSync");
-
   return (
     <Body>
       <TrackPage category="Settings" name="Accounts" />
-      {!ledgerSyncFF?.enabled && <SectionExport />}
+      <SectionExport />
 
       <Row
         title={t("settings.accounts.hideEmptyTokens.title")}