Skip to content

Commit 922df29

Browse files
authored
Merge pull request #178 from CodeForPhilly/Search_Participant_New
Search Participant branch
2 parents ad79109 + 75c2999 commit 922df29

30 files changed

+2778
-346
lines changed

.travis.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,4 +20,4 @@ matrix:
2020
- yarn
2121
script:
2222
- yarn lint
23-
- yarn test
23+
- yarn test -u -t="UpdateSnapshot"

frontend/.eslintrc.json

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
"ecmaVersion": 2018,
3030
"sourceType": "module"
3131
},
32-
"plugins": ["react", "prettier", "jest"],
32+
"plugins": ["react", "prettier", "jest", "react-hooks"],
3333
"rules": {
3434
"indent": ["error", 2],
3535
"linebreak-style": ["error", "unix"],
@@ -42,6 +42,8 @@
4242
"properties": "never",
4343
"ignoreDestructuring": true
4444
}
45-
]
45+
],
46+
"react-hooks/rules-of-hooks": "error",
47+
"react-hooks/exhaustive-deps": "warn"
4648
}
4749
}

frontend/package.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,7 @@
5353
"babel-polyfill": "^6.26.0",
5454
"clsx": "^1.0.4",
5555
"lodash": "^4.17.11",
56+
"material": "^0.4.1",
5657
"material-table": "^1.39.2",
5758
"mobx": "^5.9.4",
5859
"mobx-react": "^5.4.3",
@@ -63,7 +64,7 @@
6364
"prop-types": "^15.7.2",
6465
"react": "^16.3.0",
6566
"react-dom": "^16.3.0",
66-
"react-router-dom": "^5.0.0",
67+
"react-router-dom": "^5.1.2",
6768
"src": "^1.1.2"
6869
},
6970
"devDependencies": {
@@ -86,6 +87,7 @@
8687
"eslint-plugin-jest": "^22.5.1",
8788
"eslint-plugin-prettier": "^3.0.1",
8889
"eslint-plugin-react": "^7.12.4",
90+
"eslint-plugin-react-hooks": "^2.0.1",
8991
"husky": "^1.3.1",
9092
"identity-obj-proxy": "^3.0.0",
9193
"jest": "^24.7.1",

frontend/src/api/index.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import apisauce from "apisauce"
22
import createAuthRefreshInterceptor from "axios-auth-refresh"
33
import refreshAuthLogic from "./refreshAuthLogic"
4-
4+
import { getParticipants } from "./participantEndpoints"
55
import { createToken, verifyToken } from "./authEndpoints"
66
import { getQueue } from "./queueEndpoints"
77
import { getVisits, updateVisits, createVisits } from "./visitsEndpoint"
@@ -26,6 +26,7 @@ const create = () => {
2626
createToken: createToken(api),
2727
verifyToken: verifyToken(api),
2828
getQueue: getQueue(api),
29+
getParticipants: getParticipants(api),
2930
getVisits: getVisits(api),
3031
updateVisits: updateVisits(api),
3132
createVisits: createVisits(api),

frontend/src/api/participantApi.js

Lines changed: 0 additions & 24 deletions
This file was deleted.
Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
export const getParticipants = api => async params =>
2+
await api.get("participants/", params)

frontend/src/components/GsTitle.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ const useStyles = makeStyles(theme => ({
66
button: {
77
margin: theme.spacing(1),
88
borderRadius: 0,
9-
backgroundColor: "#F2FCFF",
9+
backgroundColor: "#FFFCFF",
1010
},
1111
input: {
1212
display: "none",

frontend/src/components/ParticipantSearch.js

Lines changed: 0 additions & 139 deletions
This file was deleted.

frontend/src/components/Participants.js

Lines changed: 0 additions & 34 deletions
This file was deleted.
Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
import React, { Fragment, useContext, useEffect, useState } from "react"
2+
import { rootStoreContext } from "../stores/RootStore"
3+
import Breadcrumbs from "@material-ui/core/Breadcrumbs"
4+
import Typography from "@material-ui/core/Typography"
5+
import Link from "@material-ui/core/Link"
6+
import Table from "@material-ui/core/Table"
7+
import TableBody from "@material-ui/core/TableBody"
8+
import TableCell from "@material-ui/core/TableCell"
9+
import TableHead from "@material-ui/core/TableHead"
10+
import TableRow from "@material-ui/core/TableRow"
11+
import Fab from "@material-ui/core/Fab"
12+
import AddIcon from "@material-ui/icons/Add"
13+
import { observer } from "mobx-react-lite"
14+
15+
const ParticipantsList = observer(() => {
16+
const rootStore = useContext(rootStoreContext)
17+
const participantsStore = rootStore.ParticipantStore
18+
const [isLoading, setIsLoading] = useState(false)
19+
20+
// useEffect is a hook that gets called after every render/re-render. Empty array second argument prevents it from running again.
21+
useEffect(() => {
22+
setIsLoading(true)
23+
participantsStore.getParticipants()
24+
setIsLoading(false)
25+
}, [])
26+
27+
return (
28+
<Fragment>
29+
{isLoading ? (
30+
<div>Loading ...</div>
31+
) : (
32+
<div>
33+
<Breadcrumbs separator="›" aria-label="breadcrumb">
34+
<Link color="inherit" href="/">
35+
Home
36+
</Link>
37+
<Typography color="textPrimary">Search Results</Typography>
38+
</Breadcrumbs>
39+
<Typography variant="h5" color="textPrimary">
40+
Participants
41+
</Typography>
42+
<div className="participants">
43+
<Table>
44+
<TableHead>
45+
<TableRow>
46+
<TableCell>
47+
<Typography>#</Typography>
48+
</TableCell>
49+
<TableCell>
50+
<Typography>PPID</Typography>
51+
</TableCell>
52+
<TableCell>
53+
<Typography>First Name</Typography>
54+
</TableCell>
55+
<TableCell>
56+
<Typography>Last Name</Typography>
57+
</TableCell>
58+
<TableCell>
59+
<Typography>Gender</Typography>
60+
</TableCell>
61+
<TableCell>
62+
<Typography>DOB</Typography>
63+
</TableCell>
64+
<TableCell>
65+
<Typography>Race</Typography>
66+
</TableCell>
67+
<TableCell>
68+
<Typography>Add</Typography>
69+
</TableCell>
70+
</TableRow>
71+
</TableHead>
72+
<TableBody>
73+
{participantsStore.participants.map((participant, index) => (
74+
<TableRow key={index}>
75+
<TableCell>
76+
<Typography>Number</Typography>
77+
</TableCell>
78+
<TableCell>
79+
<Typography>{participant.pp_id} </Typography>
80+
</TableCell>
81+
<TableCell>
82+
<Typography>{participant.first_name}</Typography>
83+
</TableCell>
84+
<TableCell>
85+
<Typography>{participant.last_name}</Typography>
86+
</TableCell>
87+
<TableCell>
88+
<Typography>Gender</Typography>
89+
</TableCell>
90+
<TableCell>
91+
<Typography>DOB</Typography>
92+
</TableCell>
93+
<TableCell>
94+
<Typography>Race</Typography>
95+
</TableCell>
96+
<TableCell>
97+
<Fab color="primary" size="small" aria-label="add">
98+
<AddIcon />
99+
</Fab>
100+
</TableCell>
101+
</TableRow>
102+
))}
103+
</TableBody>
104+
</Table>
105+
</div>
106+
<Fab color="primary" aria-label="add" size="large">
107+
<AddIcon />
108+
</Fab>
109+
</div>
110+
)}
111+
</Fragment>
112+
)
113+
})
114+
115+
export default ParticipantsList

0 commit comments

Comments
 (0)