save readSession

frontend/android/gradle.properties

@@ -26,3 +26,6 @@ android.enableJetifier=true
 
 # Version of flipper SDK to use with React Native
 FLIPPER_VERSION=0.99.0
+
+#AsyncStorage 
+AsyncStorage_db_size_in_MB=10
\ No newline at end of file

frontend/package-lock.json

@@ -8,6 +8,7 @@
       "name": "firstapp",
       "version": "0.0.1",
       "dependencies": {
+        "@react-native-async-storage/async-storage": "^1.17.3",
         "@react-native-community/netinfo": "^7.1.7",
         "@react-native-voice/voice": "^3.2.3",
         "@react-navigation/drawer": "^6.1.8",
@@ -2820,6 +2821,17 @@
         "react": "^16.8.0 || ^17.0.0-rc.1"
       }
     },
+    "node_modules/@react-native-async-storage/async-storage": {
+      "version": "1.17.3",
+      "resolved": "https://registry.npmjs.org/@react-native-async-storage/async-storage/-/async-storage-1.17.3.tgz",
+      "integrity": "sha512-2dxdlGwBjBP2qYu6F72U7cRRFshISYiNEWCaQNOJtxUERCMaYRWcniYqhL248KSbGUMpRhFCEtliztsiGoYYMA==",
+      "dependencies": {
+        "merge-options": "^3.0.4"
+      },
+      "peerDependencies": {
+        "react-native": "^0.0.0-0 || 0.60 - 0.68 || 1000.0.0"
+      }
+    },
     "node_modules/@react-native-community/cli": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/@react-native-community/cli/-/cli-6.1.0.tgz",
@@ -8428,6 +8440,14 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/is-plain-obj": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-2.1.0.tgz",
+      "integrity": "sha512-YWnfyRwxL/+SsrWYfOpUtz5b3YD+nyfkHvjbcanzk8zgyO4ASD67uVMRt8k5bM4lLMDnXfriRhOpemw+NfT1eA==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/is-plain-object": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
@@ -10808,6 +10828,17 @@
       "integrity": "sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==",
       "peer": true
     },
+    "node_modules/merge-options": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/merge-options/-/merge-options-3.0.4.tgz",
+      "integrity": "sha512-2Sug1+knBjkaMsMgf1ctR1Ujx+Ayku4EdJN4Z+C2+JzoeF7A3OZ9KM2GY0CpQS51NR61LTurMJrRKPhSs3ZRTQ==",
+      "dependencies": {
+        "is-plain-obj": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/merge-stream": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
@@ -17601,6 +17632,14 @@
         "clsx": "^1.1.1"
       }
     },
+    "@react-native-async-storage/async-storage": {
+      "version": "1.17.3",
+      "resolved": "https://registry.npmjs.org/@react-native-async-storage/async-storage/-/async-storage-1.17.3.tgz",
+      "integrity": "sha512-2dxdlGwBjBP2qYu6F72U7cRRFshISYiNEWCaQNOJtxUERCMaYRWcniYqhL248KSbGUMpRhFCEtliztsiGoYYMA==",
+      "requires": {
+        "merge-options": "^3.0.4"
+      }
+    },
     "@react-native-community/cli": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/@react-native-community/cli/-/cli-6.1.0.tgz",
@@ -21898,6 +21937,11 @@
         "has-tostringtag": "^1.0.0"
       }
     },
+    "is-plain-obj": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-2.1.0.tgz",
+      "integrity": "sha512-YWnfyRwxL/+SsrWYfOpUtz5b3YD+nyfkHvjbcanzk8zgyO4ASD67uVMRt8k5bM4lLMDnXfriRhOpemw+NfT1eA=="
+    },
     "is-plain-object": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
@@ -23719,6 +23763,14 @@
       "integrity": "sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==",
       "peer": true
     },
+    "merge-options": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/merge-options/-/merge-options-3.0.4.tgz",
+      "integrity": "sha512-2Sug1+knBjkaMsMgf1ctR1Ujx+Ayku4EdJN4Z+C2+JzoeF7A3OZ9KM2GY0CpQS51NR61LTurMJrRKPhSs3ZRTQ==",
+      "requires": {
+        "is-plain-obj": "^2.1.0"
+      }
+    },
     "merge-stream": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",

frontend/package.json

@@ -10,6 +10,7 @@
     "lint": "eslint ."
   },
   "dependencies": {
+    "@react-native-async-storage/async-storage": "^1.17.3",
     "@react-native-community/netinfo": "^7.1.7",
     "@react-native-voice/voice": "^3.2.3",
     "@react-navigation/drawer": "^6.1.8",

frontend/src/component/reading/ReadCategory.js

@@ -8,21 +8,59 @@ import {
   TouchableNativeFeedback,
   Platform,
 } from 'react-native';
+import {useNavigation} from '@react-navigation/native';
+import Client from '../../screen/client/Client';
+import AsyncStorage from '@react-native-async-storage/async-storage';
 
 const ReadCategory = props => {
-  const {title, image, id, color, onSelectGame, path} = props;
+  const {title, image, id, color, path} = props;
+
+  const navigation = useNavigation();
+
+  const getReadingSession = () => {
+    const data = {
+      userId: 1,
+    };
+    Client.post('readingSession', JSON.stringify(data), {
+      headers: {
+        Accept: 'application/json',
+        'Content-Type': 'application/json',
+      },
+    })
+      .then(res => {
+        console.log(res.data);
+        if (res.status == 200) {
+          console.log(res.data);
+          const token = res.data.token;
+          try {
+            AsyncStorage.setItem('token', token);
+          } catch (error) {
+            console.log(error);
+          }
+
+          navigation.navigate(path);
+        }
+      })
+      .catch(error => {
+        console.log(error);
+      });
+  };
+
   return (
     <View style={styles.gameItem}>
-      <TouchableOpacity onPress={onSelectGame}>
+      <TouchableOpacity
+        onPress={() => {
+          getReadingSession();
+        }}>
         <View>
           {/* <View style={{...styles.gameItemRow, ...styles.gameItemHeader}}> */}
-            <ImageBackground style={styles.bgImage} source={image}>
-              <View style={styles.titleContainer}>
-                <Text style={styles.title} numberOfLines={1}>
-                  {title}
-                </Text>
-              </View>
-            </ImageBackground>
+          <ImageBackground style={styles.bgImage} source={image}>
+            <View style={styles.titleContainer}>
+              <Text style={styles.title} numberOfLines={1}>
+                {title}
+              </Text>
+            </View>
+          </ImageBackground>
           {/* </View> */}
         </View>
       </TouchableOpacity>
@@ -32,7 +70,6 @@ const ReadCategory = props => {
 
 const styles = StyleSheet.create({
   gameItem: {
-    
     height: 300,
     width: '100%',
     backgroundColor: '#ccc',
@@ -55,7 +92,6 @@ const styles = StyleSheet.create({
     alignItems: 'center',
   },
   bgImage: {
-    
     height: '100%',
     width: '100%',
     justifyContent: 'flex-end',

frontend/src/screen/Read.js

@@ -22,25 +22,12 @@ import ButtonView from '../component/buttonView';
 import ReadCategory from '../component/reading/ReadCategory';
 import {ImagePaths} from '../assets/read/data/ReadData';
 
-const webUrel = 'http://127.0.0.1:5000/reading';
-
 export default function Read() {
   const [activity, setActivity] = useState([]);
 
   const navigation = useNavigation();
 
-  function getColorActivities() {
-    axios
-      .get(webUrel)
-      .then(response => {
-        setActivity(response.data);
-        console.log('response.data');
-      })
-      .catch(err => {});
-  }
-
   React.useEffect(() => {
-    getColorActivities();
     const unsubscribe = navigation.addListener('focus', () => {
       // The screen is focused
       // Call any action
@@ -67,25 +54,19 @@ export default function Read() {
             id={1}
             title={'Basic'}
             image={ImagePaths.roundOne}
-            onSelectGame={() => {
-              navigation.navigate('ReadActivity');
-            }}
+            path={'ReadActivity'}
           />
           <ReadCategory
             id={1}
             title={'Advanced'}
             image={ImagePaths.roundTwo}
-            onSelectGame={() => {
-              navigation.navigate('ReadActivityBird');
-            }}
+            path={'ReadActivityBird'}
           />
           <ReadCategory
             id={1}
             title={'Result & Summery'}
             image={ImagePaths.summery}
-            onSelectGame={() => {
-              navigation.navigate('ReadActivity');
-            }}
+            path={'ReadActivity'}
           />
         </TouchableOpacity>
       </ScrollView>

frontend/src/screen/auth/Login.js

@@ -12,7 +12,7 @@ import {
   TouchableOpacity,
   Image,
 } from 'react-native';
-
+import AsyncStorage from '@react-native-async-storage/async-storage';
 import client from '../client/Client';
 
 const isValidObjectField = obj => {
@@ -97,6 +97,8 @@ const Login = () => {
           return updateError('Please register our system', setError);
         }
         if (response.data.status == 200) {
+          const sessionToken = res.data.token;
+          AsyncStorage.setItem('token', token);
           return navigation.navigate('Start');
         }
       })

frontend/src/screen/client/Client.js

@@ -2,6 +2,6 @@ import axios from 'axios';
 
 // export default axios.create({ baseURL: 'http://192.168.8.102:5000/', timeout: 15000, });
 export default axios.create({
-  baseURL: 'http://192.168.1.101:5000/',
+  baseURL: 'http://192.168.1.100:5000/',
   timeout: 15000,
 });

frontend/src/screen/reading/advanced/ReadActivityBird.js

@@ -17,6 +17,7 @@ import Voice from '@react-native-voice/voice';
 import {DummyReadResult} from '../../../assets/read/data/ReadData';
 import AudioRecord from 'react-native-audio-record';
 import Client from '../../client/Client';
+import AsyncStorage from '@react-native-async-storage/async-storage';
 
 export default function ReadActivityBird() {
   const [pitch, setPitch] = useState('');
@@ -25,6 +26,7 @@ export default function ReadActivityBird() {
   const [started, setStarted] = useState('');
   const [results, setResults] = useState([]);
   const [partialResults, setPartialResults] = useState([]);
+  const readToken = localStorage.getItem('readingSession');
 
   useEffect(() => {
     Voice.onSpeechStart = onSpeechStartHandler;
@@ -37,6 +39,16 @@ export default function ReadActivityBird() {
     };
   }, []);
 
+  useEffect(() => {
+    AsyncStorage.getItem('token')
+      .then(value => {
+        console.log(value);
+      })
+      .catch(error => {
+        console.log(error);
+      });
+  }, []);
+
   const onSpeechStartHandler = e => {
     console.log('start handler =>> ', e);
   };
@@ -56,10 +68,13 @@ export default function ReadActivityBird() {
     const data = {
       word: 'bird',
       userId: 1,
+      token: readToken,
+      level: 1,
+      triedCount: 1,
     };
     if (result.includes('hello')) {
       setReadingData(data);
-      console.log(data);
+      console.log(localStorage.getItem('readingSession'));
       sendRedingData(data);
     }
   };