TW-1588: Referral links improvements (#1232)

* form ux changes

* add redux state migration

* update version

* sync background script constant

* cancel migration if advertising checkbox is enabled

* fix audit

package.json

@@ -217,6 +217,7 @@
     "source-map": "^0.7.4"
   },
   "resolutions": {
+    "npm-run-all/cross-spawn": "^7.0.6",
     "tslib": "^2.4.0",
     "@types/react": "18.0.15",
     "@types/react-dev-utils/@types/webpack-dev-server": "^4",

public/_locales/en/messages.json

@@ -3160,11 +3160,11 @@
   "selectedAccountCannotSignTx": { "message": "Selected account cannot sign transactions" },
   "attributes": { "message": "Attributes" },
   "properties": { "message": "Properties" },
-  "earnRewardsWithAds": {
-    "message": "Earn Rewards with Ads"
+  "earnTkeyRewards": {
+    "message": "Earn TKEY Rewards"
   },
-  "earnRewardsWithAdsDescription": {
-    "message": "I agree to share my wallet address and IP to receive ads and rewards in TKEY token."
+  "earnTkeyRewardsDescription": {
+    "message": "I agree to share my wallet address and IP to receive ads, referral links and rewards in TKEY token."
   },
   "dropdownNoItems": {
     "message": "No items"

src/app/hooks/use-user-analytics-and-ads-settings.hook.ts

@@ -1,24 +1,27 @@
 import { useEffect, useRef } from 'react';
 
 import { useShouldShowPartnersPromoSelector } from 'app/store/partners-promotion/selectors';
-import { useAnalyticsEnabledSelector } from 'app/store/settings/selectors';
+import { useReferralLinksEnabledSelector } from 'app/store/settings/selectors';
 import { useAnalytics } from 'lib/analytics';
-import { WEBSITES_ANALYTICS_ENABLED } from 'lib/constants';
+import { REPLACE_REFERRALS_ENABLED, WEBSITES_ANALYTICS_ENABLED } from 'lib/constants';
 import { AnalyticsEventCategory } from 'lib/temple/analytics-types';
 import { useAccountPkh } from 'lib/temple/front';
 import { usePassiveStorage } from 'lib/temple/front/storage';
 
 export const useUserAnalyticsAndAdsSettings = () => {
   const { trackEvent } = useAnalytics();
-  const isAnalyticsEnabled = useAnalyticsEnabledSelector();
   const isAdsEnabled = useShouldShowPartnersPromoSelector();
+  const isReferralLinksEnabled = useReferralLinksEnabledSelector();
 
   const [, setIsWebsitesAnalyticsEnabled] = usePassiveStorage(WEBSITES_ANALYTICS_ENABLED);
+  const [, setIsReplaceReferralsEnabled] = usePassiveStorage(REPLACE_REFERRALS_ENABLED);
+
   const prevAdsEnabledRef = useRef(isAdsEnabled);
   const accountPkh = useAccountPkh();
 
   useEffect(() => {
     setIsWebsitesAnalyticsEnabled(isAdsEnabled);
+    setIsReplaceReferralsEnabled(isReferralLinksEnabled);
 
     // It happens when the wallet is not ready although `registerWallet` promise has been resolved
     if (typeof accountPkh !== 'string') {
@@ -30,5 +33,12 @@ export const useUserAnalyticsAndAdsSettings = () => {
     }
 
     prevAdsEnabledRef.current = isAdsEnabled;
-  }, [isAdsEnabled, setIsWebsitesAnalyticsEnabled, trackEvent, accountPkh, isAnalyticsEnabled]);
+  }, [
+    isAdsEnabled,
+    isReferralLinksEnabled,
+    setIsWebsitesAnalyticsEnabled,
+    setIsReplaceReferralsEnabled,
+    trackEvent,
+    accountPkh
+  ]);
 };

src/app/pages/NewWallet/setWalletPassword/SetWalletPassword.tsx

@@ -50,8 +50,8 @@ interface FormData extends TestIDProps {
   password?: string;
   repeatPassword?: string;
   termsAccepted: boolean;
-  analytics?: boolean;
-  earnRewardsWithAds: boolean;
+  analytics: boolean;
+  earnTkeyRewards: boolean;
   testID?: string;
 }
 
@@ -102,7 +102,7 @@ export const SetWalletPassword: FC<SetWalletPasswordProps> = ({
     defaultValues: {
       shouldUseKeystorePassword: !isKeystorePasswordWeak,
       analytics: true,
-      earnRewardsWithAds: true
+      earnTkeyRewards: true
     },
     mode: 'onChange'
   });
@@ -140,20 +140,21 @@ export const SetWalletPassword: FC<SetWalletPasswordProps> = ({
           : data.password
         : data.password;
       try {
-        const shouldEnableAnalytics = Boolean(data.analytics);
-        const adsViewEnabled = data.earnRewardsWithAds;
+        const analyticsEnabled = data.analytics;
+        const adsViewEnabled = data.earnTkeyRewards;
+
+        setAnalyticsEnabled(analyticsEnabled);
         setAdsViewEnabled(adsViewEnabled);
-        setAnalyticsEnabled(shouldEnableAnalytics);
-        setReferralLinksEnabled(true);
+        setReferralLinksEnabled(adsViewEnabled);
         setTermsAccepted();
 
         await setOnboardingCompleted(true);
 
         const accountPkh = await registerWallet(password!, formatMnemonic(seedPhrase));
         // registerWallet function clears async storages
-        await putToStorage(REPLACE_REFERRALS_ENABLED, true);
+        await putToStorage(REPLACE_REFERRALS_ENABLED, adsViewEnabled);
         await putToStorage(WEBSITES_ANALYTICS_ENABLED, adsViewEnabled);
-        trackEvent('AnalyticsEnabled', AnalyticsEventCategory.General, { accountPkh }, shouldEnableAnalytics);
+        trackEvent('AnalyticsEnabled', AnalyticsEventCategory.General, { accountPkh }, analyticsEnabled);
         trackEvent('AdsEnabled', AnalyticsEventCategory.General, { accountPkh }, adsViewEnabled);
 
         navigate('/loading');
@@ -287,10 +288,10 @@ export const SetWalletPassword: FC<SetWalletPasswordProps> = ({
         <Controller
           basic
           control={control}
-          name="earnRewardsWithAds"
+          name="earnTkeyRewards"
           as={FormCheckbox}
-          label={t('earnRewardsWithAds')}
-          labelDescription={<T id="earnRewardsWithAdsDescription" />}
+          label={t('earnTkeyRewards')}
+          labelDescription={<T id="earnTkeyRewardsDescription" />}
           testID={setWalletPasswordSelectors.viewAdsCheckBox}
         />
       </FormCheckboxGroup>

src/app/store/index.ts

@@ -24,7 +24,7 @@ const persistConfigBlacklist: (keyof RootState)[] = SLICES_BLACKLIST;
 const persistedReducer = persistReducer<RootState>(
   {
     key: 'temple-root',
-    version: 4,
+    version: 5,
     ...storageConfig,
     stateReconciler: autoMergeLevel2,
     blacklist: persistConfigBlacklist,

src/app/store/migrations.ts

@@ -2,6 +2,7 @@ import { cloneDeep } from 'lodash';
 import type { MigrationManifest, PersistedState } from 'redux-persist';
 
 import { toTokenSlug } from 'lib/assets';
+import { IS_MISES_BROWSER } from 'lib/env';
 import { isCollectible } from 'lib/metadata';
 
 import { collectiblesMetadataInitialState } from './collectibles-metadata/state';
@@ -99,6 +100,24 @@ export const MIGRATIONS: MigrationManifest = {
       }
     };
 
+    return newState;
+  },
+
+  '5': (persistedState: PersistedState) => {
+    if (!persistedState || IS_MISES_BROWSER) return persistedState;
+
+    const typedPersistedState = persistedState as TypedPersistedRootState;
+
+    if (typedPersistedState.partnersPromotion.shouldShowPromotion) return persistedState;
+
+    const newState: TypedPersistedRootState = {
+      ...typedPersistedState,
+      settings: {
+        ...typedPersistedState.settings,
+        referralLinksEnabled: false
+      }
+    };
+
     return newState;
   }
 };

src/app/templates/AdvancedFeatures/referral-links-settings.tsx

@@ -7,12 +7,10 @@ import { useAcceptedTermsVersionSelector, useReferralLinksEnabledSelector } from
 import {
   PRIVACY_POLICY_URL,
   RECENT_TERMS_VERSION,
-  REPLACE_REFERRALS_ENABLED,
   TERMS_OF_USE_URL,
   TERMS_WITH_REFERRALS_VERSION
 } from 'lib/constants';
 import { t, T } from 'lib/i18n';
-import { putToStorage } from 'lib/storage';
 import { useConfirm } from 'lib/ui/dialog';
 
 import { EnablingSetting } from '../EnablingSetting';
@@ -65,7 +63,6 @@ export const ReferralLinksSettings = memo(() => {
 
       dispatch(setAcceptedTermsVersionAction(RECENT_TERMS_VERSION));
       dispatch(setReferralLinksEnabledAction(toChecked));
-      putToStorage(REPLACE_REFERRALS_ENABLED, toChecked);
     },
     [acceptedTermsVersion, confirm, dispatch]
   );

yarn.lock

@@ -6605,21 +6605,10 @@ cross-fetch@^3.0.4, cross-fetch@^3.1.5:
   dependencies:
     node-fetch "^2.6.12"
 
-cross-spawn@^6.0.5:
-  version "6.0.5"
-  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-6.0.5.tgz#4a5ec7c64dfae22c3a14124dbacdee846d80cbc4"
-  integrity sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==
-  dependencies:
-    nice-try "^1.0.4"
-    path-key "^2.0.1"
-    semver "^5.5.0"
-    shebang-command "^1.2.0"
-    which "^1.2.9"
-
-cross-spawn@^7.0.1, cross-spawn@^7.0.2, cross-spawn@^7.0.3:
-  version "7.0.3"
-  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"
-  integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==
+cross-spawn@^6.0.5, cross-spawn@^7.0.1, cross-spawn@^7.0.2, cross-spawn@^7.0.3, cross-spawn@^7.0.6:
+  version "7.0.6"
+  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.6.tgz#8a58fe78f00dcd70c370451759dfbfaf03e8ee9f"
+  integrity sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==
   dependencies:
     path-key "^3.1.0"
     shebang-command "^2.0.0"
@@ -10738,11 +10727,6 @@ next-tick@1, next-tick@^1.1.0:
   resolved "https://registry.yarnpkg.com/next-tick/-/next-tick-1.1.0.tgz#1836ee30ad56d67ef281b22bd199f709449b35eb"
   integrity sha512-CXdUiJembsNjuToQvxayPZF9Vqht7hewsvy2sOWafLvi2awflj9mOC6bHIg50orX8IJvWKY9wYQ/zB2kogPslQ==
 
-nice-try@^1.0.4:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/nice-try/-/nice-try-1.0.5.tgz#a3378a7696ce7d223e88fc9b764bd7ef1089e366"
-  integrity sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==
-
 no-case@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/no-case/-/no-case-3.0.4.tgz#d361fd5c9800f558551a8369fc0dcd4662b6124d"
@@ -11215,11 +11199,6 @@ path-is-inside@^1.0.2:
   resolved "https://registry.yarnpkg.com/path-is-inside/-/path-is-inside-1.0.2.tgz#365417dede44430d1c11af61027facf074bdfc53"
   integrity sha1-NlQX3t5EQw0cEa9hAn+s8HS9/FM=
 
-path-key@^2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/path-key/-/path-key-2.0.1.tgz#411cadb574c5a140d3a4b1910d40d80cc9f40b40"
-  integrity sha512-fEHGKCSmUSDPv4uoj8AlD+joPlq3peND+HRYyxFz4KPw4z926S/b8rIuFs2FYJg3BwsxJf6A9/3eIdLaYC+9Dw==
-
 path-key@^3.0.0, path-key@^3.1.0:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/path-key/-/path-key-3.1.1.tgz#581f6ade658cbba65a0d3380de7753295054f375"
@@ -12863,7 +12842,7 @@ selfsigned@^2.4.1:
     "@types/node-forge" "^1.3.0"
     node-forge "^1"
 
-"semver@2 || 3 || 4 || 5", semver@^5.5.0:
+"semver@2 || 3 || 4 || 5":
   version "5.7.2"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.2.tgz#48d55db737c3287cd4835e17fa13feace1c41ef8"
   integrity sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==
@@ -13003,25 +12982,13 @@ shallow-clone@^3.0.0:
   dependencies:
     kind-of "^6.0.2"
 
-shebang-command@^1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-1.2.0.tgz#44aac65b695b03398968c39f363fee5deafdf1ea"
-  integrity sha512-EV3L1+UQWGor21OmnvojK36mhg+TyIKDh3iFBKBohr5xeXIhNBcx8oWdgkTEEQ+BEFFYdLRuqMfd5L84N1V5Vg==
-  dependencies:
-    shebang-regex "^1.0.0"
-
 shebang-command@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-2.0.0.tgz#ccd0af4f8835fbdc265b82461aaf0c36663f34ea"
   integrity sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==
   dependencies:
     shebang-regex "^3.0.0"
 
-shebang-regex@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/shebang-regex/-/shebang-regex-1.0.0.tgz#da42f49740c0b42db2ca9728571cb190c98efea3"
-  integrity sha512-wpoSFAxys6b2a2wHZ1XpDSgD7N9iVjg29Ph9uV/uaP9Ex/KXlkTZTeddxDPSYQpgvzKLGJke2UU0AzoGCjNIvQ==
-
 shebang-regex@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/shebang-regex/-/shebang-regex-3.0.0.tgz#ae16f1644d873ecad843b0307b143362d4c42172"
@@ -14579,7 +14546,7 @@ which-typed-array@^1.1.13, which-typed-array@^1.1.9:
     gopd "^1.0.1"
     has-tostringtag "^1.0.0"
 
-which@^1.2.9, which@^1.3.1:
+which@^1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/which/-/which-1.3.1.tgz#a45043d54f5805316da8d62f9f50918d3da70b0a"
   integrity sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==