Storing data

Author: Infinite-Null

Assets/mic.png

@@ -8,8 +8,8 @@ export const EachFeaturesCard = ({image,navigation,name,navigate}) => {
         <TouchableOpacity onPress={()=>{
             navigation.navigate(navigate)
         }} style={{
-            height:200,
-            width:190,
+            height:160,
+            width:200,
             backgroundColor:"black",
             margin:10,
             borderRadius:10,

Components/Homepage/EachFeaturesCard.js

@@ -1,5 +1,6 @@
 import Context from "./Context";
 import {useEffect, useState} from "react";
+import AsyncStorage from "@react-native-async-storage/async-storage";
 
 
 
@@ -35,10 +36,63 @@ const ContextState=(props)=>{
         }
     }, [darkMode]);
     const [History,setHistory] = useState([])
+    async function SaveDarkMode(value){
+        try {
+            await AsyncStorage.setItem('dark', value);
+        } catch (e) {
+            // saving error
+        }
+    }
+    const GetDarkMode = async () => {
+        try {
+            const jsonValue = await AsyncStorage.getItem('dark');
+            if (jsonValue===null){
+                setDarkmode(false)
+            }else{
+                if(jsonValue==='D'){
+                    setDarkmode(true)
+                }else{
+                    setDarkmode(false)
+                }
+
+            }
+        } catch (e) {
+            // error reading value
+        }
+    };
+    async function SaveData(){
+        try {
+            const jsonValue = JSON.stringify(History);
+            await AsyncStorage.setItem('history', jsonValue);
+        } catch (e) {
+            // saving error
+        }
+    }
+    const getData = async () => {
+        try {
+            const jsonValue = await AsyncStorage.getItem('history');
+            jsonValue != null ? JSON.parse(jsonValue) : null;
+            if (jsonValue===null){
+                setHistory([])
+            }else{
+                setHistory(JSON.parse(jsonValue))
+            }
+        } catch (e) {
+            // error reading value
+        }
+    };
     useEffect(()=>{
-        // console.log(History)
+        if(History.length!==0){
+             SaveData()
+        }
+        // const History1=History
+        // setHistory(JSON.parse(History1))
     },[History])
-    return <Context.Provider value={{Style1,darkMode,setDarkmode,History,setHistory}}>
+    useEffect( () => {
+        getData()
+        GetDarkMode()
+    }, []);
+    return <Context.Provider value={{Style1,darkMode,setDarkmode,History,setHistory,SaveData,getData,SaveDarkMode,GetDarkMode}}>
         {props.children}
     </Context.Provider>
 }

Context/ContextState.js

@@ -10,7 +10,7 @@ import {AiThinking} from "../Components/ChatPage/AiThinking";
 import Voice from '@react-native-community/voice';
 
 export const ChatPage = ({navigation}) => {
-    const  {History,setHistory} = useContext(Context)
+    const  {History,setHistory,SaveData} = useContext(Context)
     const {Style1}=useContext(Context)
     const [scrollEnabled, setScrollEnabled] = useState(true)
     const Toast = useToast()
@@ -102,12 +102,14 @@ export const ChatPage = ({navigation}) => {
             Prev.push([])
             Prev[Prev.length-1]=[...chat]
             setHistory(Prev)
+            SaveData()
             // console.log(Prev)
         }
         if(chat.length>2){
             const Prev=[...History]
             Prev[Prev.length-1]=[...chat]
             setHistory(Prev)
+            SaveData()
         }
     }, [chat]);
     const onSpeechStartHandler = (e) => {

Screens/ChatPage.js

@@ -10,7 +10,7 @@ import {AiThinking} from "../Components/ChatPage/AiThinking";
 import Voice from '@react-native-community/voice';
 
 export const HistoryChatPage = ({navigation,route}) => {
-    const  {History,setHistory} = useContext(Context)
+    const  {History,setHistory,SaveData} = useContext(Context)
     const {Style1}=useContext(Context)
     const [scrollEnabled, setScrollEnabled] = useState(true)
     const Toast = useToast()
@@ -111,6 +111,7 @@ export const HistoryChatPage = ({navigation,route}) => {
         const Prev=[...History]
         Prev[route.params.index]=[...chat]
         setHistory(Prev)
+        SaveData()
     }, [chat]);
     const onSpeechStartHandler = (e) => {
         console.log("start handler==>>>", e)

Screens/HistoryChatPage.js

@@ -8,7 +8,7 @@ import {EachHistory} from "../Components/Homepage/EachHistory";
 import ToggleSwitch from "toggle-switch-react-native";
 
 export const HomePage = ({navigation}) => {
-    const {Style1,setDarkmode,darkMode,History}=useContext(Context)
+    const {Style1,setDarkmode,darkMode,History,SaveDarkMode}=useContext(Context)
     return (
             <ImageBackground source={require("../Assets/artem-bryzgalov-r2CAjGQ0gSI-unsplash.jpg")} style={{flex:1,height:"100%",width:"100"}}>
                 <View style={{
@@ -28,7 +28,14 @@ export const HomePage = ({navigation}) => {
                             label={"Dark Mode"}
                             labelStyle={{ color: "white", fontWeight: "500" }}
                             size="medium"
-                            onToggle={isOn => setDarkmode(isOn)}
+                            onToggle={isOn => {
+                                if(isOn===false){
+                                    SaveDarkMode('L')
+                                }else {
+                                    SaveDarkMode("D")
+                                }
+                                setDarkmode(isOn)
+                            }}
                         />
                     </View>
 
@@ -48,7 +55,7 @@ export const HomePage = ({navigation}) => {
                             <EachFeaturesCard navigation={navigation} image={require("../Assets/christopher-gower-m_HRfLhgABo-unsplash.jpg")} name={"Generate Code"} navigate={"CodePage"}/>
                         </ScrollView>
                         <Heading title={"Chat history"}/>
-                        {History.map((e,i)=>{
+                        {History!=undefined&&History?.map((e,i)=>{
                             return <EachHistory text={e[1].message} key={i} data={e} navigation={navigation} index={i}/>
                         })}
                     </ScrollView>

Screens/HomePage.js

@@ -15,6 +15,7 @@
     "@fortawesome/free-regular-svg-icons": "^6.4.2",
     "@fortawesome/free-solid-svg-icons": "^6.4.2",
     "@fortawesome/react-native-fontawesome": "^0.3.0",
+    "@react-native-async-storage/async-storage": "^1.19.3",
     "@react-native-community/voice": "^1.1.9",
     "@react-navigation/native": "^6.1.9",
     "@react-navigation/native-stack": "^6.9.16",