first easy-peasy attempt

pwa/package-lock.json

@@ -4556,6 +4556,11 @@
       "integrity": "sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==",
       "dev": true
     },
+    "debounce": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/debounce/-/debounce-1.2.0.tgz",
+      "integrity": "sha512-mYtLl1xfZLi1m4RtQYlZgJUNQjl4ZxVnHzIR8nLLgi4q1YT8o/WM+MK/f8yfcc9s5Ir5zRaPZyZU6xs1Syoocg=="
+    },
     "debug": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
@@ -4935,6 +4940,37 @@
         }
       }
     },
+    "easy-peasy": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/easy-peasy/-/easy-peasy-3.3.0.tgz",
+      "integrity": "sha512-wkTDAG+nRy+4g8Z3/k1vuTyrhxet19oY5MCmuRgOObm8dtZ2m+g5Mk/sdf3UWPuyx/sKIYH5Fy/HXab8iNKjTQ==",
+      "requires": {
+        "debounce": "^1.2.0",
+        "immer-peasy": "3.1.3",
+        "is-plain-object": "^3.0.0",
+        "memoizerific": "^1.11.3",
+        "prop-types": "^15.6.2",
+        "redux": "^4.0.5",
+        "redux-thunk": "^2.3.0",
+        "symbol-observable": "^1.2.0",
+        "ts-toolbelt": "^6.1.6"
+      },
+      "dependencies": {
+        "is-plain-object": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-3.0.0.tgz",
+          "integrity": "sha512-tZIpofR+P05k8Aocp7UI/2UTa9lTJSebCXpFFoR9aibpokDj/uXBsJ8luUu0tTVYKkMU6URDUuOfJZ7koewXvg==",
+          "requires": {
+            "isobject": "^4.0.0"
+          }
+        },
+        "isobject": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-4.0.0.tgz",
+          "integrity": "sha512-S/2fF5wH8SJA/kmwr6HYhK/RI/OkhD84k8ntalo0iJjZikgq1XFvR5M8NPT1x5F7fBwCG3qHfnzeP/Vh/ZxCUA=="
+        }
+      }
+    },
     "ecc-jsbn": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.2.tgz",
@@ -7125,6 +7161,11 @@
       "resolved": "https://registry.npmjs.org/immer/-/immer-1.10.0.tgz",
       "integrity": "sha512-O3sR1/opvCDGLEVcvrGTMtLac8GJ5IwZC4puPrLuRj3l7ICKvkmA0vGuU9OW8mV9WIBRnaxp5GJh9IEAaNOoYg=="
     },
+    "immer-peasy": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/immer-peasy/-/immer-peasy-3.1.3.tgz",
+      "integrity": "sha512-WzoZ96A93jOmcDOLNChMWAqy+ZU8vEYQx2DcKjgo7P5SToiJs+GL+5yQbWzH8X02Lhvv6xrGgVNa1xbki66Eow=="
+    },
     "import-cwd": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz",
@@ -9390,6 +9431,11 @@
       "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz",
       "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0="
     },
+    "map-or-similar": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/map-or-similar/-/map-or-similar-1.5.0.tgz",
+      "integrity": "sha1-beJlMXSt+12e3DPGnT6Sobdvrwg="
+    },
     "map-visit": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/map-visit/-/map-visit-1.0.0.tgz",
@@ -9428,6 +9474,14 @@
         "p-is-promise": "^2.0.0"
       }
     },
+    "memoizerific": {
+      "version": "1.11.3",
+      "resolved": "https://registry.npmjs.org/memoizerific/-/memoizerific-1.11.3.tgz",
+      "integrity": "sha1-fIekZGREwy11Q4VwkF8tvRsagFo=",
+      "requires": {
+        "map-or-similar": "^1.5.0"
+      }
+    },
     "memory-fs": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
@@ -12875,6 +12929,20 @@
         "strip-indent": "^3.0.0"
       }
     },
+    "redux": {
+      "version": "4.0.5",
+      "resolved": "https://registry.npmjs.org/redux/-/redux-4.0.5.tgz",
+      "integrity": "sha512-VSz1uMAH24DM6MF72vcojpYPtrTUu3ByVWfPL1nPfVRb5mZVTve5GnNCUV53QM/BZ66xfWrm0CTWoM+Xlz8V1w==",
+      "requires": {
+        "loose-envify": "^1.4.0",
+        "symbol-observable": "^1.2.0"
+      }
+    },
+    "redux-thunk": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.3.0.tgz",
+      "integrity": "sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw=="
+    },
     "regenerate": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.0.tgz",
@@ -14807,8 +14875,7 @@
     "symbol-observable": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.2.0.tgz",
-      "integrity": "sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ==",
-      "dev": true
+      "integrity": "sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ=="
     },
     "symbol-tree": {
       "version": "3.2.4",
@@ -15228,6 +15295,11 @@
       "resolved": "https://registry.npmjs.org/ts-pnp/-/ts-pnp-1.1.5.tgz",
       "integrity": "sha512-ti7OGMOUOzo66wLF3liskw6YQIaSsBgc4GOAlWRnIEj8htCxJUxskanMUoJOD6MDCRAXo36goXJZch+nOS0VMA=="
     },
+    "ts-toolbelt": {
+      "version": "6.5.1",
+      "resolved": "https://registry.npmjs.org/ts-toolbelt/-/ts-toolbelt-6.5.1.tgz",
+      "integrity": "sha512-zjnZ/vy1eUA0li3H0JXecl0R3jiP42snpLimsrppt9V3LLbM4NM4jMgjXQ4S67hvehq+r9CxpX4Wj6RnFRzReA=="
+    },
     "tslib": {
       "version": "1.10.0",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.10.0.tgz",

pwa/package.json

@@ -13,6 +13,7 @@
         "@types/react-dom": "^16.9.5",
         "@types/react-router-dom": "^5.1.4",
         "antd-mobile": "^2.3.1",
+        "easy-peasy": "^3.3.0",
         "node-sass": "^4.13.1",
         "react": "^16.12.0",
         "react-dom": "^16.12.0",

pwa/src/App.tsx

@@ -1,6 +1,9 @@
 import React from 'react'
 import { BrowserRouter as Router, Switch, Route } from 'react-router-dom'
 
+import { StoreProvider } from 'easy-peasy'
+import store from './state/store'
+
 import Login from './components/Login'
 import LandingPage from './components/LandingPage'
 import PatientInfoPlaceholder from './components/PatientInfoPlaceholder'
@@ -11,28 +14,30 @@ import './antd-mobile.css'
 
 const App: React.FunctionComponent = () => {
     return (
-        <Router>
-            <Switch>
-                <Route path="/login">
-                    <Login />
-                </Route>
-                <Route path="/landing">
-                    <LandingPage />
-                </Route>
-                <Route path="/patientinfo">
-                    <Wrapper
-                        navTitle="Patient Information"
-                        leftArrowText="Home"
-                        leftArrowRoute="/"
-                    >
-                        <PatientInfoPlaceholder />
-                    </Wrapper>
-                </Route>
-                <Route path="/">
-                    <Login />
-                </Route>
-            </Switch>
-        </Router>
+        <StoreProvider store={store}>
+            <Router>
+                <Switch>
+                    <Route path="/login">
+                        <Login />
+                    </Route>
+                    <Route path="/landing">
+                        <LandingPage />
+                    </Route>
+                    <Route path="/patientinfo">
+                        <Wrapper
+                            navTitle="Patient Information"
+                            leftArrowText="Home"
+                            leftArrowRoute="/"
+                        >
+                            <PatientInfoPlaceholder />
+                        </Wrapper>
+                    </Route>
+                    <Route path="/">
+                        <Login />
+                    </Route>
+                </Switch>
+            </Router>
+        </StoreProvider>
     )
 }
 

pwa/src/state/enums.ts

@@ -0,0 +1,11 @@
+export enum SEX {
+    male = 'male',
+    female = 'female',
+}
+
+export enum Y_N {
+    YES = 1,
+    NO = 0,
+}
+
+export default {}

pwa/src/state/models/newPatientFormModels.ts

@@ -0,0 +1,40 @@
+import { Action, action } from 'easy-peasy'
+import { SEX, Y_N } from '../enums'
+
+interface PatientInfoFormFields {
+    firstName?: string
+    lastName?: string
+    nickname?: string
+    sex?: SEX
+    birthDate?: Date
+    age?: number
+    phone?: string
+    town?: string
+    firstVisit?: Y_N
+    weight?: number
+    height?: number
+    bloodPressure?: string
+    temperature?: number
+    pulse?: number
+    zScore?: number
+    albendazole?: Y_N
+    alergies?: string
+    medicines?: string
+    chiefComplaint?: string[]
+    history?: string
+    exam?: string
+}
+
+export interface PatientInfoFormModel {
+    fields: PatientInfoFormFields
+    updateFields: Action<PatientInfoFormModel, PatientInfoFormFields>
+}
+
+const patientInfoFormModel: PatientInfoFormModel = {
+    fields: {},
+    updateFields: action((state, payload) => {
+        state.fields = payload
+    }),
+}
+
+export default patientInfoFormModel

pwa/src/state/store.ts

@@ -0,0 +1,6 @@
+import { createStore } from 'easy-peasy'
+import storeIndex from './storeIndex'
+
+const store = createStore(storeIndex)
+
+export default store

pwa/src/state/storeIndex.ts

@@ -0,0 +1,16 @@
+import { createTypedHooks } from 'easy-peasy'
+
+import patientInfoFormModel from './models/newPatientFormModels'
+
+export const storeModels = {
+    patientInfoFormModel,
+}
+
+export const {
+    useStore,
+    useStoreState,
+    useStoreActions,
+    useStoreDispatch,
+} = createTypedHooks<typeof storeModels>()
+
+export default storeModels