add appointments screen

1ff53183 · Phuengton Chummuel · cc571bdc · 1ff53183 · 1ff53183 · 1ff53183
Commit 1ff53183 authored Feb 12, 2018 by Phuengton Chummuel
6 changed files
--- a/package-lock.json
+++ b/package-lock.json
@@ -2526,6 +2526,795 @@
 			"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
 			"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
 		},
+		"fsevents": {
+			"version": "1.1.3",
+			"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.3.tgz",
+			"integrity": "sha512-WIr7iDkdmdbxu/Gh6eKEZJL6KPE74/5MEsf2whTOFNxbIoIixogroLdKYqB6FDav4Wavh/lZdzzd3b2KxIXC5Q==",
+			"optional": true,
+			"requires": {
+				"nan": "2.8.0",
+				"node-pre-gyp": "0.6.39"
+			},
+			"dependencies": {
+				"abbrev": {
+					"version": "1.1.0",
+					"bundled": true,
+					"optional": true
+				},
+				"ajv": {
+					"version": "4.11.8",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"co": "4.6.0",
+						"json-stable-stringify": "1.0.1"
+					}
+				},
+				"ansi-regex": {
+					"version": "2.1.1",
+					"bundled": true
+				},
+				"aproba": {
+					"version": "1.1.1",
+					"bundled": true,
+					"optional": true
+				},
+				"are-we-there-yet": {
+					"version": "1.1.4",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"delegates": "1.0.0",
+						"readable-stream": "2.2.9"
+					}
+				},
+				"asn1": {
+					"version": "0.2.3",
+					"bundled": true,
+					"optional": true
+				},
+				"assert-plus": {
+					"version": "0.2.0",
+					"bundled": true,
+					"optional": true
+				},
+				"asynckit": {
+					"version": "0.4.0",
+					"bundled": true,
+					"optional": true
+				},
+				"aws-sign2": {
+					"version": "0.6.0",
+					"bundled": true,
+					"optional": true
+				},
+				"aws4": {
+					"version": "1.6.0",
+					"bundled": true,
+					"optional": true
+				},
+				"balanced-match": {
+					"version": "0.4.2",
+					"bundled": true
+				},
+				"bcrypt-pbkdf": {
+					"version": "1.0.1",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"tweetnacl": "0.14.5"
+					}
+				},
+				"block-stream": {
+					"version": "0.0.9",
+					"bundled": true,
+					"requires": {
+						"inherits": "2.0.3"
+					}
+				},
+				"boom": {
+					"version": "2.10.1",
+					"bundled": true,
+					"requires": {
+						"hoek": "2.16.3"
+					}
+				},
+				"brace-expansion": {
+					"version": "1.1.7",
+					"bundled": true,
+					"requires": {
+						"balanced-match": "0.4.2",
+						"concat-map": "0.0.1"
+					}
+				},
+				"buffer-shims": {
+					"version": "1.0.0",
+					"bundled": true
+				},
+				"caseless": {
+					"version": "0.12.0",
+					"bundled": true,
+					"optional": true
+				},
+				"co": {
+					"version": "4.6.0",
+					"bundled": true,
+					"optional": true
+				},
+				"code-point-at": {
+					"version": "1.1.0",
+					"bundled": true
+				},
+				"combined-stream": {
+					"version": "1.0.5",
+					"bundled": true,
+					"requires": {
+						"delayed-stream": "1.0.0"
+					}
+				},
+				"concat-map": {
+					"version": "0.0.1",
+					"bundled": true
+				},
+				"console-control-strings": {
+					"version": "1.1.0",
+					"bundled": true
+				},
+				"core-util-is": {
+					"version": "1.0.2",
+					"bundled": true
+				},
+				"cryptiles": {
+					"version": "2.0.5",
+					"bundled": true,
+					"requires": {
+						"boom": "2.10.1"
+					}
+				},
+				"dashdash": {
+					"version": "1.14.1",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"assert-plus": "1.0.0"
+					},
+					"dependencies": {
+						"assert-plus": {
+							"version": "1.0.0",
+							"bundled": true,
+							"optional": true
+						}
+					}
+				},
+				"debug": {
+					"version": "2.6.8",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"ms": "2.0.0"
+					}
+				},
+				"deep-extend": {
+					"version": "0.4.2",
+					"bundled": true,
+					"optional": true
+				},
+				"delayed-stream": {
+					"version": "1.0.0",
+					"bundled": true
+				},
+				"delegates": {
+					"version": "1.0.0",
+					"bundled": true,
+					"optional": true
+				},
+				"detect-libc": {
+					"version": "1.0.2",
+					"bundled": true,
+					"optional": true
+				},
+				"ecc-jsbn": {
+					"version": "0.1.1",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"jsbn": "0.1.1"
+					}
+				},
+				"extend": {
+					"version": "3.0.1",
+					"bundled": true,
+					"optional": true
+				},
+				"extsprintf": {
+					"version": "1.0.2",
+					"bundled": true
+				},
+				"forever-agent": {
+					"version": "0.6.1",
+					"bundled": true,
+					"optional": true
+				},
+				"form-data": {
+					"version": "2.1.4",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"asynckit": "0.4.0",
+						"combined-stream": "1.0.5",
+						"mime-types": "2.1.15"
+					}
+				},
+				"fs.realpath": {
+					"version": "1.0.0",
+					"bundled": true
+				},
+				"fstream": {
+					"version": "1.0.11",
+					"bundled": true,
+					"requires": {
+						"graceful-fs": "4.1.11",
+						"inherits": "2.0.3",
+						"mkdirp": "0.5.1",
+						"rimraf": "2.6.1"
+					}
+				},
+				"fstream-ignore": {
+					"version": "1.0.5",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"fstream": "1.0.11",
+						"inherits": "2.0.3",
+						"minimatch": "3.0.4"
+					}
+				},
+				"gauge": {
+					"version": "2.7.4",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"aproba": "1.1.1",
+						"console-control-strings": "1.1.0",
+						"has-unicode": "2.0.1",
+						"object-assign": "4.1.1",
+						"signal-exit": "3.0.2",
+						"string-width": "1.0.2",
+						"strip-ansi": "3.0.1",
+						"wide-align": "1.1.2"
+					}
+				},
+				"getpass": {
+					"version": "0.1.7",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"assert-plus": "1.0.0"
+					},
+					"dependencies": {
+						"assert-plus": {
+							"version": "1.0.0",
+							"bundled": true,
+							"optional": true
+						}
+					}
+				},
+				"glob": {
+					"version": "7.1.2",
+					"bundled": true,
+					"requires": {
+						"fs.realpath": "1.0.0",
+						"inflight": "1.0.6",
+						"inherits": "2.0.3",
+						"minimatch": "3.0.4",
+						"once": "1.4.0",
+						"path-is-absolute": "1.0.1"
+					}
+				},
+				"graceful-fs": {
+					"version": "4.1.11",
+					"bundled": true
+				},
+				"har-schema": {
+					"version": "1.0.5",
+					"bundled": true,
+					"optional": true
+				},
+				"har-validator": {
+					"version": "4.2.1",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"ajv": "4.11.8",
+						"har-schema": "1.0.5"
+					}
+				},
+				"has-unicode": {
+					"version": "2.0.1",
+					"bundled": true,
+					"optional": true
+				},
+				"hawk": {
+					"version": "3.1.3",
+					"bundled": true,
+					"requires": {
+						"boom": "2.10.1",
+						"cryptiles": "2.0.5",
+						"hoek": "2.16.3",
+						"sntp": "1.0.9"
+					}
+				},
+				"hoek": {
+					"version": "2.16.3",
+					"bundled": true
+				},
+				"http-signature": {
+					"version": "1.1.1",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"assert-plus": "0.2.0",
+						"jsprim": "1.4.0",
+						"sshpk": "1.13.0"
+					}
+				},
+				"inflight": {
+					"version": "1.0.6",
+					"bundled": true,
+					"requires": {
+						"once": "1.4.0",
+						"wrappy": "1.0.2"
+					}
+				},
+				"inherits": {
+					"version": "2.0.3",
+					"bundled": true
+				},
+				"ini": {
+					"version": "1.3.4",
+					"bundled": true,
+					"optional": true
+				},
+				"is-fullwidth-code-point": {
+					"version": "1.0.0",
+					"bundled": true,
+					"requires": {
+						"number-is-nan": "1.0.1"
+					}
+				},
+				"is-typedarray": {
+					"version": "1.0.0",
+					"bundled": true,
+					"optional": true
+				},
+				"isarray": {
+					"version": "1.0.0",
+					"bundled": true
+				},
+				"isstream": {
+					"version": "0.1.2",
+					"bundled": true,
+					"optional": true
+				},
+				"jodid25519": {
+					"version": "1.0.2",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"jsbn": "0.1.1"
+					}
+				},
+				"jsbn": {
+					"version": "0.1.1",
+					"bundled": true,
+					"optional": true
+				},
+				"json-schema": {
+					"version": "0.2.3",
+					"bundled": true,
+					"optional": true
+				},
+				"json-stable-stringify": {
+					"version": "1.0.1",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"jsonify": "0.0.0"
+					}
+				},
+				"json-stringify-safe": {
+					"version": "5.0.1",
+					"bundled": true,
+					"optional": true
+				},
+				"jsonify": {
+					"version": "0.0.0",
+					"bundled": true,
+					"optional": true
+				},
+				"jsprim": {
+					"version": "1.4.0",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"assert-plus": "1.0.0",
+						"extsprintf": "1.0.2",
+						"json-schema": "0.2.3",
+						"verror": "1.3.6"
+					},
+					"dependencies": {
+						"assert-plus": {
+							"version": "1.0.0",
+							"bundled": true,
+							"optional": true
+						}
+					}
+				},
+				"mime-db": {
+					"version": "1.27.0",
+					"bundled": true
+				},
+				"mime-types": {
+					"version": "2.1.15",
+					"bundled": true,
+					"requires": {
+						"mime-db": "1.27.0"
+					}
+				},
+				"minimatch": {
+					"version": "3.0.4",
+					"bundled": true,
+					"requires": {
+						"brace-expansion": "1.1.7"
+					}
+				},
+				"minimist": {
+					"version": "0.0.8",
+					"bundled": true
+				},
+				"mkdirp": {
+					"version": "0.5.1",
+					"bundled": true,
+					"requires": {
+						"minimist": "0.0.8"
+					}
+				},
+				"ms": {
+					"version": "2.0.0",
+					"bundled": true,
+					"optional": true
+				},
+				"node-pre-gyp": {
+					"version": "0.6.39",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"detect-libc": "1.0.2",
+						"hawk": "3.1.3",
+						"mkdirp": "0.5.1",
+						"nopt": "4.0.1",
+						"npmlog": "4.1.0",
+						"rc": "1.2.1",
+						"request": "2.81.0",
+						"rimraf": "2.6.1",
+						"semver": "5.3.0",
+						"tar": "2.2.1",
+						"tar-pack": "3.4.0"
+					}
+				},
+				"nopt": {
+					"version": "4.0.1",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"abbrev": "1.1.0",
+						"osenv": "0.1.4"
+					}
+				},
+				"npmlog": {
+					"version": "4.1.0",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"are-we-there-yet": "1.1.4",
+						"console-control-strings": "1.1.0",
+						"gauge": "2.7.4",
+						"set-blocking": "2.0.0"
+					}
+				},
+				"number-is-nan": {
+					"version": "1.0.1",
+					"bundled": true
+				},
+				"oauth-sign": {
+					"version": "0.8.2",
+					"bundled": true,
+					"optional": true
+				},
+				"object-assign": {
+					"version": "4.1.1",
+					"bundled": true,
+					"optional": true
+				},
+				"once": {
+					"version": "1.4.0",
+					"bundled": true,
+					"requires": {
+						"wrappy": "1.0.2"
+					}
+				},
+				"os-homedir": {
+					"version": "1.0.2",
+					"bundled": true,
+					"optional": true
+				},
+				"os-tmpdir": {
+					"version": "1.0.2",
+					"bundled": true,
+					"optional": true
+				},
+				"osenv": {
+					"version": "0.1.4",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"os-homedir": "1.0.2",
+						"os-tmpdir": "1.0.2"
+					}
+				},
+				"path-is-absolute": {
+					"version": "1.0.1",
+					"bundled": true
+				},
+				"performance-now": {
+					"version": "0.2.0",
+					"bundled": true,
+					"optional": true
+				},
+				"process-nextick-args": {
+					"version": "1.0.7",
+					"bundled": true
+				},
+				"punycode": {
+					"version": "1.4.1",
+					"bundled": true,
+					"optional": true
+				},
+				"qs": {
+					"version": "6.4.0",
+					"bundled": true,
+					"optional": true
+				},
+				"rc": {
+					"version": "1.2.1",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"deep-extend": "0.4.2",
+						"ini": "1.3.4",
+						"minimist": "1.2.0",
+						"strip-json-comments": "2.0.1"
+					},
+					"dependencies": {
+						"minimist": {
+							"version": "1.2.0",
+							"bundled": true,
+							"optional": true
+						}
+					}
+				},
+				"readable-stream": {
+					"version": "2.2.9",
+					"bundled": true,
+					"requires": {
+						"buffer-shims": "1.0.0",
+						"core-util-is": "1.0.2",
+						"inherits": "2.0.3",
+						"isarray": "1.0.0",
+						"process-nextick-args": "1.0.7",
+						"string_decoder": "1.0.1",
+						"util-deprecate": "1.0.2"
+					}
+				},
+				"request": {
+					"version": "2.81.0",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"aws-sign2": "0.6.0",
+						"aws4": "1.6.0",
+						"caseless": "0.12.0",
+						"combined-stream": "1.0.5",
+						"extend": "3.0.1",
+						"forever-agent": "0.6.1",
+						"form-data": "2.1.4",
+						"har-validator": "4.2.1",
+						"hawk": "3.1.3",
+						"http-signature": "1.1.1",
+						"is-typedarray": "1.0.0",
+						"isstream": "0.1.2",
+						"json-stringify-safe": "5.0.1",
+						"mime-types": "2.1.15",
+						"oauth-sign": "0.8.2",
+						"performance-now": "0.2.0",
+						"qs": "6.4.0",
+						"safe-buffer": "5.0.1",
+						"stringstream": "0.0.5",
+						"tough-cookie": "2.3.2",
+						"tunnel-agent": "0.6.0",
+						"uuid": "3.0.1"
+					}
+				},
+				"rimraf": {
+					"version": "2.6.1",
+					"bundled": true,
+					"requires": {
+						"glob": "7.1.2"
+					}
+				},
+				"safe-buffer": {
+					"version": "5.0.1",
+					"bundled": true
+				},
+				"semver": {
+					"version": "5.3.0",
+					"bundled": true,
+					"optional": true
+				},
+				"set-blocking": {
+					"version": "2.0.0",
+					"bundled": true,
+					"optional": true
+				},
+				"signal-exit": {
+					"version": "3.0.2",
+					"bundled": true,
+					"optional": true
+				},
+				"sntp": {
+					"version": "1.0.9",
+					"bundled": true,
+					"requires": {
+						"hoek": "2.16.3"
+					}
+				},
+				"sshpk": {
+					"version": "1.13.0",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"asn1": "0.2.3",
+						"assert-plus": "1.0.0",
+						"bcrypt-pbkdf": "1.0.1",
+						"dashdash": "1.14.1",
+						"ecc-jsbn": "0.1.1",
+						"getpass": "0.1.7",
+						"jodid25519": "1.0.2",
+						"jsbn": "0.1.1",
+						"tweetnacl": "0.14.5"
+					},
+					"dependencies": {
+						"assert-plus": {
+							"version": "1.0.0",
+							"bundled": true,
+							"optional": true
+						}
+					}
+				},
+				"string-width": {
+					"version": "1.0.2",
+					"bundled": true,
+					"requires": {
+						"code-point-at": "1.1.0",
+						"is-fullwidth-code-point": "1.0.0",
+						"strip-ansi": "3.0.1"
+					}
+				},
+				"string_decoder": {
+					"version": "1.0.1",
+					"bundled": true,
+					"requires": {
+						"safe-buffer": "5.0.1"
+					}
+				},
+				"stringstream": {
+					"version": "0.0.5",
+					"bundled": true,
+					"optional": true
+				},
+				"strip-ansi": {
+					"version": "3.0.1",
+					"bundled": true,
+					"requires": {
+						"ansi-regex": "2.1.1"
+					}
+				},
+				"strip-json-comments": {
+					"version": "2.0.1",
+					"bundled": true,
+					"optional": true
+				},
+				"tar": {
+					"version": "2.2.1",
+					"bundled": true,
+					"requires": {
+						"block-stream": "0.0.9",
+						"fstream": "1.0.11",
+						"inherits": "2.0.3"
+					}
+				},
+				"tar-pack": {
+					"version": "3.4.0",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"debug": "2.6.8",
+						"fstream": "1.0.11",
+						"fstream-ignore": "1.0.5",
+						"once": "1.4.0",
+						"readable-stream": "2.2.9",
+						"rimraf": "2.6.1",
+						"tar": "2.2.1",
+						"uid-number": "0.0.6"
+					}
+				},
+				"tough-cookie": {
+					"version": "2.3.2",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"punycode": "1.4.1"
+					}
+				},
+				"tunnel-agent": {
+					"version": "0.6.0",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"safe-buffer": "5.0.1"
+					}
+				},
+				"tweetnacl": {
+					"version": "0.14.5",
+					"bundled": true,
+					"optional": true
+				},
+				"uid-number": {
+					"version": "0.0.6",
+					"bundled": true,
+					"optional": true
+				},
+				"util-deprecate": {
+					"version": "1.0.2",
+					"bundled": true
+				},
+				"uuid": {
+					"version": "3.0.1",
+					"bundled": true,
+					"optional": true
+				},
+				"verror": {
+					"version": "1.3.6",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"extsprintf": "1.0.2"
+					}
+				},
+				"wide-align": {
+					"version": "1.1.2",
+					"bundled": true,
+					"optional": true,
+					"requires": {
+						"string-width": "1.0.2"
+					}
+				},
+				"wrappy": {
+					"version": "1.0.2",
+					"bundled": true
+				}
+			}
+		},
 		"fstream": {
 			"version": "1.0.11",
 			"resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -7000,6 +7789,7 @@
 				"anymatch": "1.3.2",
 				"exec-sh": "0.2.1",
 				"fb-watchman": "2.0.0",
+				"fsevents": "1.1.3",
 				"minimatch": "3.0.4",
 				"minimist": "1.2.0",
 				"walker": "1.0.7",

--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
    "react-native-datepicker": "^1.6.0",
    "react-native-firebase": "^3.1.0",
    "react-native-google-signin": "^0.12.0",
+    "react-native-material-dialog": "^0.7.4",
    "react-native-modal-datetime-picker": "^4.13.0",
    "react-native-push-notification": "^3.0.2",
    "react-native-vector-icons": "^4.4.2",

--- a/src/navigators/RootNavigator.js
+++ b/src/navigators/RootNavigator.js
 import React, { Component } from 'react';
-import { DrawerNavigator, StackNavigator, TabNavigator } from 'react-navigation';
+import { DrawerNavigator, StackNavigator } from 'react-navigation';

 import HomeScreen from './../screens/HomeScreen';
 import CameraScreen from './../screens/CameraScreen';
@@ -10,11 +10,12 @@ import SignInScreen from './../screens/SignInScreen';
 import MainScreen from './../screens/MainScreen';
 import SettingsTimePeriod from './../screens/SettingsTimePeriod'
 import ReminderDetail from './../screens/ReminderDetail'
+import AppointmentsScreen from './../screens/AppointmentsScreen'

 const RootNavigator = StackNavigator(
  {
    Home: {
-      screen: TabNavigator({
+      screen: DrawerNavigator({
        Home: {
          screen: StackNavigator({
            Home: {
@@ -42,6 +43,9 @@ const RootNavigator = StackNavigator(
        Medications: {
          screen: MedicationsScreen
        },
+        Appointments: {
+          screen: AppointmentsScreen
+        },
        Settings: {
          screen: StackNavigator({
            Settings: {
@@ -54,18 +58,6 @@ const RootNavigator = StackNavigator(
              headerMode: 'none'
            })
        }
-      }, {
-          tabBarPosition: 'bottom',
-          swipeEnabled: false,
-          tabBarOptions: {
-            labelStyle: {
-              color: 'black'
-            },
-            style: {
-              backgroundColor: 'white',
-
-            }
-          }
      })
    },
    SignIn: {

--- a/src/screens/AppointmentsScreen.js
+++ b/src/screens/AppointmentsScreen.js
+import React from 'react';
+import { DatePickerAndroid, TimePickerAndroid, Alert, Keyboard } from 'react-native';
+import {
+  Container,
+  Content,
+  View,
+  Button,
+  Icon,
+  Form,
+  Item,
+  Label,
+  Input,
+  Text
+} from 'native-base';
+import AppHeader from './../components/Header';
+import MedForm from './../components/MedForm';
+import { Grid, Col } from 'react-native-easy-grid';
+import realm from './../Database';
+import moment from 'moment';
+
+class AppointmentsScreen extends React.Component {
+
+  constructor(props) {
+    super(props)
+    this.state = {
+      doctor: "",
+      date: null,
+      time: "",
+      place: "",
+    }
+  }
+
+  render() {
+
+    const { goBack } = this.props.navigation;
+    const { btnAddNoti } = styles
+
+    return (
+      <Container>
+        <AppHeader
+          headerText={"Appointments"}
+          headerLeft={
+            <Button onPress={() => goBack()}>
+              <Icon name='arrow-back' />
+            </Button>
+          }
+        />
+
+        <Content>
+          <MedForm titleText={"Appointments Detail"}>
+            <Form>
+              <Item floatingLabel>
+                <Label>Doctor's name</Label>
+                <Input
+                  onChangeText={(text) => this.setState({ doctor: text })}
+                />
+              </Item>
+              <Item floatingLabel>
+                <Label>Date</Label>
+                <Input
+                  onFocus={() => { this._datePicker(), Keyboard.dismiss() }}
+                  value={this.state.date == null ? "" : this._formatDate(this.state.date)}
+                />
+              </Item>
+              <Item floatingLabel>
+                <Label>Time</Label>
+                <Input
+                  onFocus={() => { this._timePicker(), Keyboard.dismiss() }}
+                  value={this.state.time}
+                />
+              </Item>
+              <Item floatingLabel>
+                <Label>Place</Label>
+                <Input
+                  onChangeText={(text) => this.setState({ place: text })}
+                />
+              </Item>
+            </Form>
+          </MedForm>
+
+          <Grid>
+            <Col>
+              <Button full style={btnAddNoti}>
+                <Text style={{ color: "#1686C4" }}>Reset</Text>
+              </Button>
+            </Col>
+            <Col>
+              <Button full style={btnAddNoti}>
+                <Text style={{ color: "#1686C4" }}>Add</Text>
+              </Button>
+            </Col>
+
+          </Grid>
+        </Content>
+      </Container >
+    )
+  }
+
+  _addAppointment() {
+
+  }
+
+  _datePicker() {
+    try {
+      const { action, year, month, day } = DatePickerAndroid
+        .open({
+          // Use `new Date()` for current date.
+          // May 25 2020. Month 0 is January.
+          date: moment().toDate()
+        })
+        .then(({ action, year, month, day }) => {
+          switch (action) {
+            case "dateSetAction":
+              this.setState({ date: moment().year(year).month(month).date(day).toDate() })
+              break;
+            case "dismissedAction":
+              break;
+          }
+
+        })
+      if (action !== DatePickerAndroid.dismissedAction) {
+        // Selected year, month (0-11), day
+      }
+    } catch ({ code, message }) {
+      console.warn('Cannot open date picker', message);
+    }
+
+  }
+
+  _timePicker() {
+    try {
+      const { action, hour, minute } = TimePickerAndroid
+        .open({
+          is24Hour: true, // Will display '2 PM'
+        })
+        .then(({ action, hour, minute }) => {
+          switch (action) {
+            case "timeSetAction":
+              this.setState({ time: this._formatTime(hour, minute) })
+              break;
+            case "dismissedAction":
+              break;
+          }
+        })
+
+    } catch ({ code, message }) {
+      console.warn('Cannot open time picker', message);
+    }
+  }
+
+  _formatDate(date) {
+    return moment(date).format('DD MMM YYYY')
+  }
+
+  _formatTime(hour, minute) {
+    return moment(hour + ":" + minute, 'HH:mm').format('HH:mm').toString()
+  }
+
+}
+
+
+const styles = {
+  btnAddNoti: {
+    flex: 1,
+    backgroundColor: '#FFFFFF',
+    marginTop: 15,
+    marginBottom: 15,
+    marginLeft: 20,
+    marginRight: 20,
+  }
+}
+
+export default AppointmentsScreen;
\ No newline at end of file
--- a/src/screens/MedicationsScreen.js
+++ b/src/screens/MedicationsScreen.js
 import React, { Component } from 'react';
 import { DeviceEventEmitter, ToastAndroid, Alert } from 'react-native';
+import { formatDate, scheduleLocalNotification } from './../Utils';
+import { Grid, Col } from 'react-native-easy-grid';
+import { MaterialDialog } from 'react-native-material-dialog';
 import PushNotification from 'react-native-push-notification';
 import {
  Container,
@@ -21,10 +24,8 @@ import {
 import DatePicker from 'react-native-datepicker';
 import AppHeader from './../components/Header';
 import MedForm from '../components/MedForm';
-import { formatDate, scheduleLocalNotification } from './../Utils';
 import moment from 'moment'
 import realm from './../Database'
-import { Grid, Col } from 'react-native-easy-grid';

 PushNotification.configure({
  // (required) Called when a remote or local notification is opened or received
@@ -66,6 +67,7 @@ class MedicationsScreen extends Component {
      nightTime: "",
      beforeMeal: true,
      afterMeal: false,
+      visible: null,
    };
  }

@@ -123,7 +125,7 @@ class MedicationsScreen extends Component {
            </Form>
          </MedForm>

-          <MedForm titleText={"Reminder Time"}>
+          <MedForm titleText={"Reminder Times"}>
            <Content>
              <ListItem onPress={() => this._onReminderTimePresses(1)}>
                <Radio selected={this.state.morning} />
@@ -197,6 +199,19 @@ class MedicationsScreen extends Component {
            /> */}
          </MedForm>

+          <MedForm titleText={"Dose"}>
+            {/* <MaterialDialog
+              title="Use Google's Location Service?"
+              visible={true}
+              onOk={() => this.setState({ visible: false })}
+              onCancel={() => this.setState({ visible: false })}>
+              <Text style={styles.dialogText}>
+                Let Google help apps determine location. This means sending anonymous location data to Google, even when no apps are running.
+              </Text>
+            </MaterialDialog>; */}
+
+          </MedForm>
+
          <Grid>
            <Col>
              <Button full style={btnAddNoti} onPress={() => this._onResetPressed()}>

--- a/yarn.lock
+++ b/yarn.lock
@@ -3097,7 +3097,7 @@ minimist@~0.0.1:
  dependencies:
    minimist "0.0.8"

-moment@^2.19.0, moment@^2.20.1:
+moment@2.x.x, moment@^2.19.0, moment@^2.20.1:
  version "2.20.1"
  resolved "https://registry.yarnpkg.com/moment/-/moment-2.20.1.tgz#d6eb1a46cbcc14a2b2f9434112c1ff8907f313fd"

@@ -3698,6 +3698,12 @@ react-native-camera@^0.12.0:
  dependencies:
    prop-types "^15.5.10"

+react-native-datepicker@^1.6.0:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/react-native-datepicker/-/react-native-datepicker-1.6.0.tgz#3a40dc9b112023c49d60ba2a0789d440b7e3d97c"
+  dependencies:
+    moment "2.x.x"
+
 react-native-dismiss-keyboard@1.0.0:
  version "1.0.0"
  resolved "https://registry.yarnpkg.com/react-native-dismiss-keyboard/-/react-native-dismiss-keyboard-1.0.0.tgz#32886242b3f2317e121f3aeb9b0a585e2b879b49"
@@ -3747,6 +3753,14 @@ react-native-google-signin@^0.12.0:
    prop-types "^15.5.10"
    react-timer-mixin "^0.13.3"

+react-native-material-dialog@^0.7.4:
+  version "0.7.4"
+  resolved "https://registry.yarnpkg.com/react-native-material-dialog/-/react-native-material-dialog-0.7.4.tgz#fa70861b08331a3dc320a1b9dd39f81cc9ca6df2"
+  dependencies:
+    prop-types "^15.5.10"
+    react-native-typography "^1.0.3"
+    react-native-vector-icons "^4.2.0"
+
 react-native-modal-datetime-picker@^4.13.0:
  version "4.13.0"
  resolved "https://registry.yarnpkg.com/react-native-modal-datetime-picker/-/react-native-modal-datetime-picker-4.13.0.tgz#bcf9f62c691befb133bf6fd6e5d6189d397608ef"
@@ -3772,6 +3786,18 @@ react-native-tab-view@^0.0.70:
  dependencies:
    prop-types "^15.5.10"

+react-native-typography@^1.0.3:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/react-native-typography/-/react-native-typography-1.3.0.tgz#ae921c141ab1dfdf4335ebc2b4a146bcf7919b36"
+
+react-native-vector-icons@^4.2.0:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/react-native-vector-icons/-/react-native-vector-icons-4.5.0.tgz#6b95619e64f62f05f579f74a01fe5640df95158b"
+  dependencies:
+    lodash "^4.0.0"
+    prop-types "^15.5.10"
+    yargs "^8.0.2"
+
 react-native-vector-icons@^4.4.2, react-native-vector-icons@~4.4.2:
  version "4.4.2"
  resolved "https://registry.yarnpkg.com/react-native-vector-icons/-/react-native-vector-icons-4.4.2.tgz#090f42ee0396c4cc4eae0ddaa518028ba8df40c7"