.......

screens/logbook.js

@@ -23,19 +23,19 @@ class LogBook extends React.PureComponent {
     };
   }
   displayData = async () => {
+
     try {
     const value = await AsyncStorage.getItem('@storage_key');
+   // console.log(JSON.parse(value));
     if (value !== null) {
         // We have data!!
-       // console.log(JSON.parse(value));
-         this.setState({ logbook: JSON.parse(value) });
-           console.log(this.state.logbook.length);
-
+     // console.log(JSON.parse(value));
+         this.setState({ logbook: JSON.parse(value)});
+         console.log(this.state.logbook);
     }
 } catch (error) {
     // Error retrieving data
-}
-console.log(this.state.logbook);
+  }
   };
 
   componentDidMount() {
@@ -58,30 +58,33 @@ console.log(this.state.logbook);
               style={{
                 marginTop: 50,
               }}>
+                {this.state.logbook && this.state.logbook.map((item, id) => (
                 <View
+                  key ={id}
                   style={{
                     flexDirection: 'row',
                     padding: 10,
                     backgroundColor: 'white',
                     borderBottomWidth:1,
                   }}>
-                  <View style={{alignItems: 'center', paddingLeft:15, paddingRight:15}}>
-                  <View style={{marginRight:5, marginBottom:5}}>
-                  <Text style={{color:'black', fontSize: 40}}>{(this.state.logbook.date !== undefined) ? this.state.logbook.date.split(' ')[0].trim() : ''}</Text>
-                  <Text style={{color:'black', fontSize: 15}}>{(this.state.logbook.date !== undefined) ? this.state.logbook.date.split(' ')[1].trim() : ''}</Text>
+                  <View style={{alignItems: 'center'}}>
+                  <View style={{marginRight:10, marginBottom:10}}>
+                  <Text style={{color:'black', fontSize: 40}}>{(item.date !== undefined) ? item.date.split(' ')[0].trim() : ''}</Text>
+                  <Text style={{color:'black', fontSize: 15, marginLeft:11}}>{(item.date !== undefined) ? item.date.split(' ')[1].trim() : ''}</Text>
                  </View>
                   <View style={{marginRight:5}}>
-                  <Text style={{color:'black', fontSize: 15}}>{this.state.logbook.day}</Text>
+                  <Text style={{color:'black', fontSize: 15}}>{item.day}</Text>
                  </View>
                  </View>
                  <View style={{borderWidth:1, borderColor : 'blue'}}/>
                  <View style={{flexDirection: 'column',marginLeft:5,marginTop:5}}>
-                  <Text style={{color:'green', fontSize: 15}}>Correct : {this.state.logbook.correct}</Text>
-                  <Text style={{color:'red', fontSize: 15}}>Wrong : {this.state.logbook.wrong}</Text>
-                  <Text style={{color:'black', fontSize: 15}}>Timer : {this.state.logbook.timer}</Text>
-                  <Text style={{color:'black', fontSize: 15}}>Time : {this.state.logbook.time}</Text>
+                  <Text style={{color:'green', fontSize: 15}}>Correct : {item.correct}</Text>
+                  <Text style={{color:'red', fontSize: 15}}>Wrong : {item.wrong}</Text>
+                  <Text style={{color:'black', fontSize: 15}}>Timer : {item.timer}</Text>
+                  <Text style={{color:'black', fontSize: 15}}>Time : {item.time}</Text>
                  </View>
                 </View>
+              )).reverse()}
             </ScrollView>
           </SafeAreaView>
         </ImageBackground>

screens/saveRecords.js

 /* eslint-disable prettier/prettier */
-/*This is an Example of Calling Other Class Function in React Native*/
 import { Component } from 'react';
 import moment from 'moment';
 import AsyncStorage from '@react-native-async-storage/async-storage';
 const date = moment().utcOffset('+08:00').format('D MMM');
 const time = moment().utcOffset('+08:00').format('h:mm a');
 const day = moment().utcOffset('+08:00').format('ddd');
-var records = [];
+//var records = [];
 
 class OtherClass extends Component {
   saveRecord = async (correct, wrong, stime) => {
@@ -19,38 +18,19 @@ class OtherClass extends Component {
       day : day,
     };
 
- try {
+       try {
     const value = await AsyncStorage.getItem('@storage_key');
     if (value !== null) {
         // We have data!!
-    console.log(JSON.parse(value));
-    records.push(JSON.parse(value));
-    records.push(JSON.parse(obj));
-    //console.log(records);
-    AsyncStorage.setItem('@storage_key', JSON.stringify(records), (err)=> {
-          if (err){
-              console.log('an error');
-              throw err;
-          }
-        // console.log('success');
-      }).catch((err)=> {
-          console.log('error is: ' + err);
-      });
-    }
-    else {
-        AsyncStorage.setItem('@storage_key', JSON.stringify(obj), (err)=> {
-          if (err){
-              console.log('an error');
-              throw err;
-          }
-        // console.log('success');
-      }).catch((err)=> {
-          console.log('error is: ' + err);
-      });
+       // console.log(JSON.parse(value));
+         this.setState({ logbook: JSON.parse(value) });
+           console.log(this.state.logbook.length);
+
     }
 } catch (error) {
     // Error retrieving data
 }
+
   };
 }
 

screens/settings.js

@@ -17,8 +17,9 @@ import Orientation from 'react-native-orientation';
 import Notes from './data';
 import * as RNFS from 'react-native-fs';
 import NumericInput from 'react-native-numeric-input';
+import AsyncStorage from '@react-native-async-storage/async-storage';
 
-var path = RNFS.DocumentDirectoryPath + '/settings.txt';
+//var path = RNFS.DocumentDirectoryPath + '/settings.txt';
 var path1 = RNFS.DocumentDirectoryPath + '/counter.txt';
 
 
@@ -76,31 +77,56 @@ export default class Settings extends React.Component {
          list.push(keyword);
     }
     this.setState({listN: list});
-    this.saveData(this.state.listN);
-    this.displayData();
+    if (this.state.listN !== null){
+       this.setState({listN: list});
+         this.saveData(this.state.listN);
+    }
+    else {
+          this.setState({listN: notes});
+         this.saveData2(this.state.listN);
+    }
+
+    this._retrieveData();
    // console.log(notes);
   };
 
     saveData = async () => {
-      RNFS.writeFile(path,JSON.stringify(this.state.listN),'utf8',)
-        .then((success) => {
-        console.log(JSON.stringify(this.state.listN));
-        })
-        .catch((err) => {
-          console.log(err.message);
-        });
+    AsyncStorage.setItem('@notes_key', JSON.stringify(this.state.listN), (err)=> {
+          if (err){
+              console.log('an error');
+              throw err;
+          }
+      console.log('success');  //console.log(JSON.stringify(this.state.listN));
+      }).catch((err)=> {
+          console.log('error is: ' + err);
+      });
   };
 
-    displayData = async () => {
-    RNFS.readFile(path, 'ascii')
-      .then((res) => {
-       // console.log(JSON.stringify(res));
-      })
-      .catch((err) => {
-        console.log(err.message, err.code);
+   saveData = async () => {
+    AsyncStorage.setItem('@notes_key', JSON.stringify(this.state.listN), (err)=> {
+          if (err){
+              console.log('an error');
+              throw err;
+          }
+      console.log('success');  //console.log(JSON.stringify(this.state.listN));
+      }).catch((err)=> {
+          console.log('error is: ' + err);
       });
   };
 
+  _retrieveData = async () => {
+  try {
+    const value = await AsyncStorage.getItem('@notes_key');
+    if (value !== null) {
+      // We have data!!
+      console.log(value);
+    }
+  } catch (error) {
+    // Error retrieving data
+  }
+};
+
+
       saveData1 = async () => {
       RNFS.writeFile(path1,JSON.stringify(counter),'utf8',)
         .then((success) => {
@@ -127,13 +153,6 @@ export default class Settings extends React.Component {
     Orientation.lockToPortrait();
    // console.log(notes.length);
     counter = 0;
-    RNFS.unlink(path).then(res => {
-    console.log('delete');
-    RNFS.scanFile(path);
-})
-.catch(err => {
-    console.log(err.message, err.code);
-});
     RNFS.unlink(path1).then(res => {
     console.log('delete');
     RNFS.scanFile(path1);