Skip to content

Commit 7ff9a80

Browse files
AnidionAnidion
authored
Merge pull request #81 from techstartucalgary/RecruiterApplicants
Recruiter applicants
2 parents 5a62838 + a1eb94b commit 7ff9a80

File tree

9 files changed

+1024
-167
lines changed

9 files changed

+1024
-167
lines changed

‎frontend/package-lock.json‎

Lines changed: 147 additions & 125 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎frontend/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
"@emotion/react": "^11.10.5",
88
"@emotion/styled": "^11.10.5",
99
"@mui/icons-material": "^5.11.11",
10-
"@mui/material": "^5.10.16",
10+
"@mui/material": "^5.12.2",
1111
"@testing-library/jest-dom": "^5.16.5",
1212
"@testing-library/react": "^13.4.0",
1313
"@testing-library/user-event": "^13.5.0",

‎frontend/src/components/RecruiterApplicantsComponents.jsx‎

Lines changed: 211 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,211 @@
1+
import React from "react";
2+
import PropTypes from "prop-types";
3+
import {
4+
Box,
5+
Checkbox,
6+
TableRow,
7+
TableCell,
8+
TableHead,
9+
TableSortLabel,
10+
Toolbar,
11+
Typography,
12+
OutlinedInput,
13+
InputAdornment,
14+
} from "@mui/material";
15+
16+
// Label Component
17+
const Label = ({ color, children }) => {
18+
const backgroundColors = {
19+
success: "success.main",
20+
error: "error.main",
21+
warning: "warning.main",
22+
info: "info.main",
23+
primary: "primary.main",
24+
secondary: "secondary.main",
25+
offerSent: "#4CAF50",
26+
};
27+
28+
return (
29+
<Box
30+
sx={{
31+
display: "inline-flex",
32+
alignItems: "center",
33+
justifyContent: "center",
34+
borderRadius: "8px",
35+
minWidth: 72,
36+
minHeight: 32,
37+
px: 1,
38+
color: "white",
39+
fontSize: "0.55rem",
40+
fontWeight: "bold",
41+
padding: "4px",
42+
backgroundColor: backgroundColors[color] || "error.main",
43+
}}
44+
>
45+
{children}
46+
</Box>
47+
);
48+
};
49+
50+
Label.propTypes = {
51+
color: PropTypes.string.isRequired,
52+
children: PropTypes.node,
53+
};
54+
55+
// Iconify Component
56+
const Iconify = ({ icon, width = 20, sx, ...other }) => (
57+
<Box
58+
component="span"
59+
sx={{
60+
display: "inline-flex",
61+
alignItems: "center",
62+
justifyContent: "center",
63+
width,
64+
height: width,
65+
...sx,
66+
}}
67+
{...other}
68+
>
69+
<i className={icon} />
70+
</Box>
71+
);
72+
73+
Iconify.propTypes = {
74+
sx: PropTypes.object,
75+
width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
76+
icon: PropTypes.string.isRequired,
77+
};
78+
79+
// Scrollbar Component
80+
const Scrollbar = ({ children, sx, ...other }) => {
81+
return (
82+
<Box sx={{ overflowX: "auto", ...sx }} {...other}>
83+
{children}
84+
</Box>
85+
);
86+
};
87+
88+
Scrollbar.propTypes = {
89+
sx: PropTypes.object,
90+
children: PropTypes.node,
91+
};
92+
93+
const UserListHead = ({
94+
order,
95+
orderBy,
96+
rowCount,
97+
headLabel,
98+
numSelected,
99+
onRequestSort,
100+
onSelectAllClick,
101+
}) => {
102+
const createSortHandler = (property) => (event) => {
103+
onRequestSort(event, property);
104+
};
105+
106+
return (
107+
<TableHead
108+
sx={{
109+
bgcolor: "grey.200",
110+
}}
111+
>
112+
<TableRow>
113+
<TableCell padding="checkbox">
114+
<Checkbox
115+
indeterminate={numSelected > 0 && numSelected < rowCount}
116+
checked={rowCount > 0 && numSelected === rowCount}
117+
onChange={onSelectAllClick}
118+
/>
119+
</TableCell>
120+
{headLabel.map((headCell) => (
121+
<TableCell
122+
key={headCell.id}
123+
align={headCell.alignRight ? "right" : "left"}
124+
sortDirection={orderBy === headCell.id ? order : false}
125+
>
126+
<TableSortLabel
127+
hideSortIcon
128+
active={orderBy === headCell.id}
129+
direction={orderBy === headCell.id ? order : "asc"}
130+
onClick={createSortHandler(headCell.id)}
131+
>
132+
{headCell.label}
133+
</TableSortLabel>
134+
</TableCell>
135+
))}
136+
</TableRow>
137+
</TableHead>
138+
);
139+
};
140+
141+
UserListHead.propTypes = {
142+
order: PropTypes.oneOf(["asc", "desc"]),
143+
orderBy: PropTypes.string,
144+
rowCount: PropTypes.number,
145+
headLabel: PropTypes.array,
146+
numSelected: PropTypes.number,
147+
onRequestSort: PropTypes.func,
148+
onSelectAllClick: PropTypes.func,
149+
};
150+
const UserListToolbar = ({
151+
numSelected,
152+
filterName,
153+
onFilterName,
154+
backgroundColor,
155+
}) => {
156+
return (
157+
<Toolbar
158+
sx={{
159+
height: 96,
160+
display: "flex",
161+
justifyContent: "space-between",
162+
padding: 1,
163+
backgroundColor: "background.paper",
164+
...(numSelected > 0 && {
165+
color: "primary.main",
166+
bgcolor: "primary.lighter",
167+
}),
168+
}}
169+
>
170+
{numSelected > 0 ? (
171+
<Typography component="div" variant="subtitle1">
172+
{numSelected} selected
173+
</Typography>
174+
) : (
175+
<OutlinedInput
176+
value={filterName}
177+
onChange={onFilterName}
178+
placeholder="Search applicant..."
179+
startAdornment={
180+
<InputAdornment position="start">
181+
<Iconify
182+
icon="eva:search-fill"
183+
sx={{ color: "text.disabled", width: 20, height: 20 }}
184+
/>
185+
</InputAdornment>
186+
}
187+
sx={{
188+
width: 240,
189+
transition: "all 0.3s",
190+
"&.Mui-focused": {
191+
width: 320,
192+
boxShadow: 8,
193+
},
194+
"& fieldset": {
195+
borderWidth: `1px !important`,
196+
borderColor: "rgba(0, 0, 0, 0.23) !important",
197+
},
198+
}}
199+
/>
200+
)}
201+
</Toolbar>
202+
);
203+
};
204+
205+
UserListToolbar.propTypes = {
206+
numSelected: PropTypes.number,
207+
filterName: PropTypes.string,
208+
onFilterName: PropTypes.func,
209+
};
210+
211+
export { Label, Iconify, Scrollbar, UserListHead, UserListToolbar };

‎frontend/src/img/defaultProfile.jpg‎

8.43 KB
Loading

‎frontend/src/index.jsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import LoginPage from "./components/SignIn";
1414
import CreateProfile from "./pages/createProfile";
1515
import SkillsSelector from "./pages/skills";
1616
import EditProfile from "./pages/editProfile";
17+
import RecruiterApplicantsPage from "./pages/RecruiterApplicants";
1718

1819
const root = ReactDOM.createRoot(document.getElementById("root"));
1920

@@ -31,6 +32,7 @@ root.render(
3132
<Route path="/createProfile" element={<CreateProfile />} />
3233
<Route path="/editProfile" element={<EditProfile />} />
3334
<Route path="/skills" element={<SkillsSelector />} />
35+
<Route path="/recruiterApplicant" element={<RecruiterApplicantsPage />} />
3436
<Route path="*" element={<NotFound />} />
3537
</Routes>
3638
</HashRouter>,

0 commit comments

Comments
 (0)