refactor code to use redux

src/screens/AppointmentListScreen.js

@@ -13,9 +13,11 @@ import {
   Left,
 } from 'native-base';
 import AppHeader from './../components/Header';
+import appointmentList from './../components/AppointmentList'
 import realm from './../Database/';
 import moment from 'moment';
 import { cancleNotification } from './../Utils';
+import AppointmentList from './../components/AppointmentList';
 
 class AppointmentListScreen extends Component {
 
@@ -51,7 +53,8 @@ class AppointmentListScreen extends Component {
           }
         />
         <Content>
-          <View style={{ flex: 1, backgroundColor: 'white', height: 60 }}>
+          <AppointmentList />
+          {/* <View style={{ flex: 1, backgroundColor: 'white', height: 60 }}>
             <Text style={headerStyle}>Appointment List</Text>
           </View>
           <View>
@@ -71,7 +74,7 @@ class AppointmentListScreen extends Component {
                 </ListItem>
               }>
             </List>
-          </View>
+          </View> */}
         </Content>
       </Container>
     )

src/screens/AppointmentsScreen.js

@@ -12,10 +12,12 @@ import {
   Input,
   Text
 } from 'native-base';
+import { connect } from 'react-redux';
 import AppHeader from './../components/Header';
 import MedForm from './../components/MedForm';
 import { Grid, Col } from 'react-native-easy-grid';
-import { appointmentNotification } from './../Utils';
+import { appointmentNotification, generateID } from './../Utils';
+import { appointmentCreate } from './../actions'
 import realm from './../Database';
 import moment from 'moment';
 
@@ -31,6 +33,20 @@ class AppointmentsScreen extends React.Component {
     }
   }
 
+  _addAppointment() {
+    let id = generateID();
+    let time = this.state.time.split(':')
+    let appointment = {
+      id: id,
+      doctorName: this.state.doctor,
+      date: moment(this.state.date).hour(time[0]).minute(time[1]).second(0).toDate(),
+      place: this.state.place,
+      time: moment().date()
+    };
+    this.props.appointmentCreate(appointment)
+    this.props.navigation.goBack(null)
+  }
+
   render() {
 
     const { goBack } = this.props.navigation;
@@ -105,54 +121,7 @@ class AppointmentsScreen extends React.Component {
     // ToastAndroid.show("reset", ToastAndroid.SHORT)
   }
 
-  _addAppointment() {
-
-    if (this.state.doctor && this.state.date && this.state.time) {
-      Alert.alert(
-        'Confirm',
-        'Are you sure to add this appointment?',
-        [
-          // { text: 'CANCLE', onPress: () => ToastAndroid.show("Cancled", ToastAndroid.SHORT) },
-          { text: 'CANCLE', onPress: () => { } },
-          {
-            text: 'OK', onPress: () => {
-              var id = Math.random() * 10000
-              var time = this.state.time.split(':')
-              var appointmentDate = moment(this.state.date).hour(time[0]).minute(time[1]).second(0).toDate()
-              var msg = "แจ้งเตือนการนัดพบแพทย์\n" + "แพทย์: " + this.state.doctor + "เวลา: " + this.state.time
-              appointmentNotification(msg, appointmentDate, id)
 
-              realm.write(() => {
-                realm.create('Appointments', {
-                  id: id,
-                  doctorName: this.state.doctor,
-                  date: appointmentDate,
-                  place: this.state.place,
-                  timeStamp: moment().toDate()
-                })
-              })
-
-              this.props.navigation.goBack(null)
-            }
-          },
-        ],
-        { cancelable: false }
-      )
-
-    } else {
-      Alert.alert(
-        'Please enter Doctor name / Select appointment date and time',
-        '',
-        [
-          // { text: 'OK', onPress: () => ToastAndroid.show("Please enter medine name / Select reminder time", ToastAndroid.SHORT) },
-          { text: 'OK', onPress: () => { } },
-        ],
-        { cancelable: false }
-      )
-    }
-
-
-  }
 
   _datePicker() {
     try {
@@ -224,4 +193,4 @@ const styles = {
   }
 }
 
-export default AppointmentsScreen;
\ No newline at end of file
+export default connect(null, { appointmentCreate })(AppointmentsScreen);
\ No newline at end of file