Async storage

Author: theboi

App.tsx

@@ -19,6 +19,7 @@ import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
 import {ApplicationProvider, Layout, Text} from '@ui-kitten/components';
 import {mapping, light as lightTheme, dark as darkTheme} from '@eva-design/eva';
 import {SafeAreaView} from 'react-native';
+import AsyncStorage from '@react-native-community/async-storage';
 
 import {K} from './src/store/constants';
 
@@ -40,12 +41,27 @@ const SettingsPageNest = () => {
   );
 };
 
-Appearance.addChangeListener(({ colorScheme }) => {
-  store.dispatch({type: 'SET_THEME_NATIVE', theme: colorScheme})
+Appearance.addChangeListener(({colorScheme}) => {
+  store.dispatch({type: 'SET_THEME_NATIVE', theme: colorScheme});
 });
 
 const App = (props: any) => {
+  // const getSaved = async () => {
+  //   let raw;
+  //   try {
+  //     raw = await AsyncStorage.multiGet(['themeMode']); //add on to the array for more
+  //   } catch (error) {
+  //     console.log(error);
+  //   }
 
+  //   let retrivedObject = {};
+  //   raw.map(value => {
+  //     retrivedObject[value[0]] = value[1];
+  //   });
+  //   console.log(retrivedObject);
+  //   return retrivedObject;
+  // };
+  // console.log(getSaved().retrivedObject);
   const themeColor = props.theme === 'dark' ? K.color.dark : K.color.light;
   return (
     <AppearanceProvider>
@@ -121,7 +137,8 @@ const mapStateToProps = (state: any) => {
 
 const mapDispatchToProps = (dispatch: any) => {
   return {
-    setThemeNative: (theme: string) => dispatch({type: 'SET_THEME_NATIVE', theme: theme}),
+    setThemeNative: (theme: string) =>
+      dispatch({type: 'SET_THEME_NATIVE', theme: theme}),
   };
 };
 

ios/Podfile.lock

@@ -221,6 +221,8 @@ PODS:
     - React-cxxreact (= 0.61.5)
     - React-jsi (= 0.61.5)
     - ReactCommon/jscallinvoker (= 0.61.5)
+  - RNCAsyncStorage (1.8.1):
+    - React
   - RNCMaskedView (0.1.7):
     - React
   - RNGestureHandler (1.6.0):
@@ -265,6 +267,7 @@ DEPENDENCIES:
   - React-RCTVibration (from `../node_modules/react-native/Libraries/Vibration`)
   - ReactCommon/jscallinvoker (from `../node_modules/react-native/ReactCommon`)
   - ReactCommon/turbomodule/core (from `../node_modules/react-native/ReactCommon`)
+  - "RNCAsyncStorage (from `../node_modules/@react-native-community/async-storage`)"
   - "RNCMaskedView (from `../node_modules/@react-native-community/masked-view`)"
   - RNGestureHandler (from `../node_modules/react-native-gesture-handler`)
   - RNReanimated (from `../node_modules/react-native-reanimated`)
@@ -330,6 +333,8 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native/Libraries/Vibration"
   ReactCommon:
     :path: "../node_modules/react-native/ReactCommon"
+  RNCAsyncStorage:
+    :path: "../node_modules/@react-native-community/async-storage"
   RNCMaskedView:
     :path: "../node_modules/@react-native-community/masked-view"
   RNGestureHandler:
@@ -373,6 +378,7 @@ SPEC CHECKSUMS:
   React-RCTText: 9ccc88273e9a3aacff5094d2175a605efa854dbe
   React-RCTVibration: a49a1f42bf8f5acf1c3e297097517c6b3af377ad
   ReactCommon: 198c7c8d3591f975e5431bec1b0b3b581aa1c5dd
+  RNCAsyncStorage: 00bdf63f7f1e0f11d3323533dba4f222e58bf092
   RNCMaskedView: 90dd32f5b786bd562e876e1421ea77c700cbf71e
   RNGestureHandler: dde546180bf24af0b5f737c8ad04b6f3fa51609a
   RNReanimated: 031fe8d9ea93c2bd689a40f05320ef9d96f74d7f

package.json

@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@eva-design/eva": "^1.4.0",
+    "@react-native-community/async-storage": "^1.8.1",
     "@react-native-community/masked-view": "^0.1.7",
     "@react-navigation/bottom-tabs": "^5.1.1",
     "@react-navigation/native": "^5.0.9",

src/pages/Settings/index.tsx

@@ -26,7 +26,7 @@ const SettingsPageC = (props: any) => {
     {
       title: 'Privacy',
       onPress: () => {
-        props.toggleSettingsModal(true, ['Privacy', <Text>Hi</Text>]);
+        props.toggleSettingsModal(true, ['Privacy Notice', <Text style={{color: themeColor.primaryText}}>Privacy</Text>]);
       },
     },
   ];
@@ -102,13 +102,13 @@ const SettingsPageC = (props: any) => {
     {
       title: 'Tell A Friend',
       onPress: () => {
-        props.toggleSettingsModal(true, ['Share', <Text>Hi</Text>]);
+        props.toggleSettingsModal(true, ['Share', <Text style={{color: themeColor.primaryText}}>Share</Text>]);
       },
     },
     {
       title: 'Report A Bug',
       onPress: () => {
-        props.toggleSettingsModal(true, ['Bug Report', <Text>Hi</Text>]);
+        props.toggleSettingsModal(true, ['Bug Report', <Text style={{color: themeColor.primaryText}}>Report</Text>]);
       },
     },
   ];
@@ -162,7 +162,7 @@ const SettingsPageC = (props: any) => {
         }
         modalTitle={
           <ModalTitle
-            title={props.settingsModalContent?.[0] ?? 'Blank'}
+            title={props.settingsModalContent?.[0] ?? ''}
             style={{
               backgroundColor: themeColor.secondaryBG,
               borderBottomColor: themeColor.primaryBG,

src/store/reducer.js

@@ -1,30 +1,17 @@
 import React from 'react';
-import {Text, AsyncStorage} from 'react-native';
+import { Text } from 'react-native';
 import { Appearance } from 'react-native-appearance';
 
-_retrieveData = async () => {
-  try {
-    const value = await AsyncStorage.getItem('TASKS');
-    if (value !== null) {
-      // We have data!!
-      console.log(value);
-    }
-  } catch (error) {
-    // Error retrieving data
-  }
-};
-
 const initialState = {
   orientation: 'portrait', //portrait/landscape
-  theme: 'light', //dark/light
-  themeMode: 'auto', //need to save in device
+  themeMode: 'auto',
   themeNative: Appearance.getColorScheme(), // device's native theme
+  theme: Appearance.getColorScheme(), //dark/light
   settingsModalIsOpen: false,
   settingsModalContent: ['Blank', (<Text></Text>)]
 }
 
 export const reducer = (state = initialState, action) => {
-
   switch (action.type) {
     case 'TOGGLE_THEME':
       return {