Merge pull request #3901 from BlueWallet/priv

OPS: Toggle Blur

App.js

@@ -34,6 +34,7 @@ import Biometric from './class/biometrics';
 import WidgetCommunication from './blue_modules/WidgetCommunication';
 import changeNavigationBarColor from 'react-native-navigation-bar-color';
 import ActionSheet from './screen/ActionSheet';
+import Privacy from './blue_modules/Privacy';
 const A = require('./blue_modules/analytics');
 const currency = require('./blue_modules/currency');
 
@@ -329,6 +330,7 @@ const App = () => {
       <DeviceQuickActions />
       <Biometric />
       <WidgetCommunication />
+      <Privacy />
     </SafeAreaProvider>
   );
 };

blue_modules/Privacy.android.js

@@ -1,10 +1,21 @@
+import { useContext, useEffect } from 'react';
 import Obscure from 'react-native-obscure';
-export default class Privacy {
-  static enableBlur() {
-    Obscure.activateObscure();
-  }
+import { BlueStorageContext } from './storage-context';
+const Privacy = () => {
+  const { isPrivacyBlurEnabled } = useContext(BlueStorageContext);
 
-  static disableBlur() {
+  useEffect(() => {
+    Privacy.disableBlur();
+  }, [isPrivacyBlurEnabled]);
+
+  Privacy.enableBlur = () => {
+    if (!isPrivacyBlurEnabled) return;
+    Obscure.activateObscure();
+  };
+
+  Privacy.disableBlur = () => {
     Obscure.deactivateObscure();
-  }
-}
+  };
+  return null;
+};
+export default Privacy;

blue_modules/Privacy.ios.js

@@ -1,10 +1,22 @@
+import { useContext, useEffect } from 'react';
 import { enabled } from 'react-native-privacy-snapshot';
-export default class Privacy {
-  static enableBlur() {
-    enabled(true);
-  }
+import { BlueStorageContext } from './storage-context';
+const Privacy = () => {
+  const { isPrivacyBlurEnabled } = useContext(BlueStorageContext);
 
-  static disableBlur() {
+  useEffect(() => {
+    Privacy.disableBlur();
+  }, [isPrivacyBlurEnabled]);
+
+  Privacy.enableBlur = () => {
+    if (!isPrivacyBlurEnabled) return;
+    enabled(true);
+  };
+
+  Privacy.disableBlur = () => {
     enabled(false);
-  }
-}
+  };
+  return null;
+};
+
+export default Privacy;

blue_modules/storage-context.js

@@ -29,12 +29,17 @@ export const BlueStorageProvider = ({ children }) => {
   const [isHandOffUseEnabled, setIsHandOffUseEnabled] = useState(false);
   const [isElectrumDisabled, setIsElectrumDisabled] = useState(true);
   const [isTorDisabled, setIsTorDisabled] = useState(false);
+  const [isPrivacyBlurEnabled, setIsPrivacyBlurEnabled] = useState(true);
 
   useEffect(() => {
     BlueElectrum.isDisabled().then(setIsElectrumDisabled);
     isTorDaemonDisabled().then(setIsTorDisabled);
   }, []);
 
+  useEffect(() => {
+    console.log(`Privacy blur: ${isPrivacyBlurEnabled}`);
+  }, [isPrivacyBlurEnabled]);
+
   useEffect(() => {
     setIsTorDaemonDisabled(isTorDisabled);
   }, [isTorDisabled]);
@@ -266,6 +271,8 @@ export const BlueStorageProvider = ({ children }) => {
         setIsElectrumDisabled,
         isTorDisabled,
         setIsTorDisabled,
+        isPrivacyBlurEnabled,
+        setIsPrivacyBlurEnabled,
       }}
     >
       {children}

screen/settings/SettingsPrivacy.js

@@ -1,5 +1,5 @@
 import React, { useContext, useEffect, useState } from 'react';
-import { ScrollView, TouchableWithoutFeedback, StyleSheet, Linking, Platform } from 'react-native';
+import { ScrollView, TouchableWithoutFeedback, StyleSheet, Linking, Platform, Pressable } from 'react-native';
 import { useTheme } from '@react-navigation/native';
 
 import navigationStyle from '../../components/navigationStyle';
@@ -14,7 +14,7 @@ const A = require('../../blue_modules/analytics');
 
 const SettingsPrivacy = () => {
   const { colors } = useTheme();
-  const { isStorageEncrypted, setDoNotTrack, isDoNotTrackEnabled } = useContext(BlueStorageContext);
+  const { isStorageEncrypted, setDoNotTrack, isDoNotTrackEnabled, setIsPrivacyBlurEnabled } = useContext(BlueStorageContext);
   const sections = Object.freeze({ ALL: 0, CLIPBOARDREAD: 1, QUICKACTION: 2, WIDGETS: 3 });
   const [isLoading, setIsLoading] = useState(sections.ALL);
   const [isReadClipboardAllowed, setIsReadClipboardAllowed] = useState(false);
@@ -23,6 +23,7 @@ const SettingsPrivacy = () => {
   const [isDisplayWidgetBalanceAllowed, setIsDisplayWidgetBalanceAllowed] = useState(false);
   const [isQuickActionsEnabled, setIsQuickActionsEnabled] = useState(false);
   const [storageIsEncrypted, setStorageIsEncrypted] = useState(true);
+  const [isPrivacyBlurEnabledTapped, setIsPrivacyBlurEnabledTapped] = useState(0);
 
   useEffect(() => {
     (async () => {
@@ -95,9 +96,16 @@ const SettingsPrivacy = () => {
     Linking.openSettings();
   };
 
+  const onDisablePrivacyTapped = () => {
+    setIsPrivacyBlurEnabled(!(isPrivacyBlurEnabledTapped >= 10));
+    setIsPrivacyBlurEnabledTapped(prev => prev + 1);
+  };
+
   return (
     <ScrollView style={[styles.root, stylesWithThemeHook.root]}>
+      <Pressable onPress={onDisablePrivacyTapped}>
         <BlueHeaderDefaultSub leftText={loc.settings.general} rightComponent={null} />
+      </Pressable>
       <BlueListItem
         hideChevron
         title={loc.settings.privacy_read_clipboard}