Skip to content

Commit 5aa1140

Browse files
ocielliottcocielliottc
committed
Merge branch 'develop' into bugfix-2535/links-relying-on-admin
2 parents d661f2f + be19169 commit 5aa1140

File tree

14 files changed

+491
-776
lines changed

14 files changed

+491
-776
lines changed

‎web-ui/src/components/certifications/EarnedCertificationsTable.css‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
#earned-certifications-table {
2-
display: flex;
3-
justify-content: center;
42

53
.MuiCardHeader-root {
64
padding-bottom: 0;
@@ -13,6 +11,7 @@
1311

1412
table {
1513
margin: 0 auto;
14+
width: 100%;
1615
border-collapse: collapse;
1716

1817
img {
@@ -43,6 +42,10 @@
4342
tr:nth-child(odd) {
4443
background-color: var(--checkins-palette-background-default);
4544
}
45+
46+
.actions-th {
47+
width: 6rem;
48+
}
4649
}
4750

4851
.earned-certifications-dialog {

‎web-ui/src/components/certifications/EarnedCertificationsTable.jsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import {
1010
} from '@mui/icons-material';
1111
import {
1212
Autocomplete,
13+
Avatar,
1314
Button,
1415
Card,
1516
CardContent,
@@ -370,7 +371,7 @@ const EarnedCertificationsTable = ({
370371
() => (
371372
<Card>
372373
<CardHeader
373-
avatar={<EmojiEvents />}
374+
avatar={<Avatar sx={{ mr: 1 }}><EmojiEvents /></Avatar>}
374375
title="Earned Certifications"
375376
titleTypographyProps={{ variant: 'h5', component: 'h2' }}
376377
/>
@@ -389,7 +390,7 @@ const EarnedCertificationsTable = ({
389390
{sortIndicator(column)}
390391
</th>
391392
))}
392-
<th key="Actions">Actions</th>
393+
<th className="actions-th" key="Actions">Actions</th>
393394
</tr>
394395
</thead>
395396
<tbody>{earnedCertifications.map(earnedCertificationRow)}</tbody>

‎web-ui/src/components/dialogs/OrganizationDialog.jsx‎

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,24 +2,33 @@ import React from 'react';
22
import { Dialog, DialogTitle, DialogContent, DialogActions, Button, TextField } from '@mui/material';
33
import PropTypes from 'prop-types';
44

5-
const OrganizationDialog = ({ open, onClose, onSave, organization, setOrganization }) => {
5+
const OrganizationDialog = ({
6+
open,
7+
onClose,
8+
onSave,
9+
organization,
10+
setOrganization
11+
}) => {
612
return (
713
<Dialog open={open} onClose={onClose}>
814
<DialogTitle>Create New Organization</DialogTitle>
915
<DialogContent>
16+
{/* This section no longer includes the option to select an existing organization */}
1017
<TextField
11-
label="Name"
18+
label="Organization Name"
1219
fullWidth
1320
margin="dense"
1421
value={organization.name}
1522
onChange={e => setOrganization({ ...organization, name: e.target.value })}
23+
required
1624
/>
1725
<TextField
1826
label="Description"
1927
fullWidth
2028
margin="dense"
2129
value={organization.description}
2230
onChange={e => setOrganization({ ...organization, description: e.target.value })}
31+
required
2332
/>
2433
<TextField
2534
label="Website"
@@ -31,7 +40,7 @@ const OrganizationDialog = ({ open, onClose, onSave, organization, setOrganizati
3140
</DialogContent>
3241
<DialogActions>
3342
<Button onClick={onClose}>Cancel</Button>
34-
<Button onClick={onSave}>Save</Button>
43+
<Button onClick={onSave} disabled={!organization.name || !organization.description}>Save</Button>
3544
</DialogActions>
3645
</Dialog>
3746
);

‎web-ui/src/components/profile/Profile.jsx‎

Lines changed: 20 additions & 121 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
import React, { useContext, useEffect, useState } from 'react';
22
import { styled } from '@mui/material/styles';
3-
import { Avatar, Typography, Button, Dialog, DialogTitle, DialogContent, DialogActions, TextField } from '@mui/material';
3+
import { Avatar, Typography } from '@mui/material';
44
import { AppContext } from '../../context/AppContext';
55
import { selectProfileMap } from '../../context/selectors';
66
import { getAvatarURL } from '../../api/api.js';
77
import { getMember } from '../../api/member';
8-
import { saveNewOrganization, saveNewEvent } from '../../api/volunteer'; // Importing the functions from volunteer.js
98

109
const PREFIX = 'Profile';
1110

@@ -53,30 +52,28 @@ const Root = styled('div')(() => ({
5352
}
5453
}));
5554

56-
const Profile = ({ memberId, pdlId, checkinPdlId, showButtons = true }) => { // Add showButtons prop with default as true
55+
const Profile = ({ memberId, pdlId, checkinPdlId }) => {
5756
const { state } = useContext(AppContext);
5857
const { csrf } = state;
5958
const userProfile = selectProfileMap(state)[memberId];
6059

61-
const { workEmail, name, title, location, supervisorid } = userProfile ? userProfile : {};
60+
const { workEmail, name, title, location, supervisorid } = userProfile
61+
? userProfile
62+
: {};
6263

6364
const [pdl, setPDL] = useState('');
6465
const [checkinPdl, setCheckinPdl] = useState('');
6566
const [supervisor, setSupervisor] = useState('');
6667

67-
const [organizationDialogOpen, setOrganizationDialogOpen] = useState(false);
68-
const [eventDialogOpen, setEventDialogOpen] = useState(false);
69-
const [newOrganization, setNewOrganization] = useState({ name: '', description: '', website: '' });
70-
const [newEvent, setNewEvent] = useState({ relationshipId: '', eventDate: '', hours: 0, notes: '' });
71-
7268
const areSamePdls = checkinPdl && pdl && checkinPdl === pdl;
7369

7470
// Get PDL's name
7571
useEffect(() => {
7672
async function getPDLName() {
7773
if (pdlId) {
7874
let res = await getMember(pdlId, csrf);
79-
let pdlProfile = res.payload.data && !res.error ? res.payload.data : undefined;
75+
let pdlProfile =
76+
res.payload.data && !res.error ? res.payload.data : undefined;
8077
setPDL(pdlProfile ? pdlProfile.name : '');
8178
}
8279
}
@@ -90,7 +87,8 @@ const Profile = ({ memberId, pdlId, checkinPdlId, showButtons = true }) => { //
9087
async function getCheckinPDLName() {
9188
if (checkinPdlId) {
9289
let res = await getMember(checkinPdlId, csrf);
93-
let checkinPdlProfile = res.payload.data && !res.error ? res.payload.data : undefined;
90+
let checkinPdlProfile =
91+
res.payload.data && !res.error ? res.payload.data : undefined;
9492
setCheckinPdl(checkinPdlProfile ? checkinPdlProfile.name : '');
9593
}
9694
}
@@ -104,7 +102,8 @@ const Profile = ({ memberId, pdlId, checkinPdlId, showButtons = true }) => { //
104102
async function getSupervisorName() {
105103
if (supervisorid) {
106104
let res = await getMember(supervisorid, csrf);
107-
let supervisorProfile = res.payload.data && !res.error ? res.payload.data : undefined;
105+
let supervisorProfile =
106+
res.payload.data && !res.error ? res.payload.data : undefined;
108107
setSupervisor(supervisorProfile ? supervisorProfile.name : '');
109108
}
110109
}
@@ -113,24 +112,6 @@ const Profile = ({ memberId, pdlId, checkinPdlId, showButtons = true }) => { //
113112
}
114113
}, [csrf, supervisorid]);
115114

116-
const handleSaveNewOrganization = async () => {
117-
const result = await saveNewOrganization(csrf, newOrganization); // Use the imported API call
118-
if (result.error) {
119-
// Handle error
120-
return;
121-
}
122-
setOrganizationDialogOpen(false);
123-
};
124-
125-
const handleSaveNewEvent = async () => {
126-
const result = await saveNewEvent(csrf, newEvent); // Use the imported API call
127-
if (result.error) {
128-
// Handle error
129-
return;
130-
}
131-
setEventDialogOpen(false);
132-
};
133-
134115
return (
135116
<Root className={classes.flexRow}>
136117
<Avatar
@@ -157,7 +138,11 @@ const Profile = ({ memberId, pdlId, checkinPdlId, showButtons = true }) => { //
157138
</div>
158139
</div>
159140
<Typography variant="body2" color="textSecondary" component="p">
160-
<a href={`mailto:${workEmail}`} target="_blank" rel="noopener noreferrer">
141+
<a
142+
href={`mailto:${workEmail}`}
143+
target="_blank"
144+
rel="noopener noreferrer"
145+
>
161146
{workEmail}
162147
</a>
163148
<br />
@@ -167,100 +152,14 @@ const Profile = ({ memberId, pdlId, checkinPdlId, showButtons = true }) => { //
167152
<br />
168153
Current PDL: {pdl}
169154
<br />
170-
{checkinPdl && !areSamePdls && `PDL @ Time of Check-In: ${checkinPdl}`}
155+
{checkinPdl &&
156+
!areSamePdls &&
157+
`PDL @ Time of Check-In: ${checkinPdl}`}
171158
</Typography>
172-
173-
{/* Conditionally render the buttons based on showButtons prop */}
174-
{showButtons && (
175-
<>
176-
<Button
177-
variant="contained"
178-
onClick={() => setOrganizationDialogOpen(true)}
179-
style={{ marginTop: '20px' }}
180-
aria-label="Add New Organization"
181-
>
182-
Add New Organization
183-
</Button>
184-
185-
<Button
186-
variant="contained"
187-
onClick={() => setEventDialogOpen(true)}
188-
style={{ marginTop: '20px', marginLeft: '10px' }}
189-
aria-label="Add New Event"
190-
>
191-
Add New Event
192-
</Button>
193-
</>
194-
)}
195159
</div>
196160
</div>
197-
198-
{/* Organization Creation Dialog */}
199-
<Dialog open={organizationDialogOpen} onClose={() => setOrganizationDialogOpen(false)}>
200-
<DialogTitle>Create New Organization</DialogTitle>
201-
<DialogContent>
202-
<TextField
203-
label="Name"
204-
fullWidth
205-
margin="dense"
206-
value={newOrganization.name}
207-
onChange={e => setNewOrganization({ ...newOrganization, name: e.target.value })}
208-
/>
209-
<TextField
210-
label="Description"
211-
fullWidth
212-
margin="dense"
213-
value={newOrganization.description}
214-
onChange={e => setNewOrganization({ ...newOrganization, description: e.target.value })}
215-
/>
216-
<TextField
217-
label="Website URL"
218-
fullWidth
219-
margin="dense"
220-
value={newOrganization.website}
221-
onChange={e => setNewOrganization({ ...newOrganization, website: e.target.value })}
222-
/>
223-
</DialogContent>
224-
<DialogActions>
225-
<Button onClick={() => setOrganizationDialogOpen(false)}>Cancel</Button>
226-
<Button onClick={handleSaveNewOrganization}>Save</Button>
227-
</DialogActions>
228-
</Dialog>
229-
230-
{/* Event Creation Dialog */}
231-
<Dialog open={eventDialogOpen} onClose={() => setEventDialogOpen(false)}>
232-
<DialogTitle>Create New Event</DialogTitle>
233-
<DialogContent>
234-
<TextField
235-
label="Event Date"
236-
fullWidth
237-
margin="dense"
238-
value={newEvent.eventDate}
239-
onChange={e => setNewEvent({ ...newEvent, eventDate: e.target.value })}
240-
/>
241-
<TextField
242-
label="Hours"
243-
fullWidth
244-
margin="dense"
245-
type="number"
246-
value={newEvent.hours}
247-
onChange={e => setNewEvent({ ...newEvent, hours: e.target.value })}
248-
/>
249-
<TextField
250-
label="Notes"
251-
fullWidth
252-
margin="dense"
253-
value={newEvent.notes}
254-
onChange={e => setNewEvent({ ...newEvent, notes: e.target.value })}
255-
/>
256-
</DialogContent>
257-
<DialogActions>
258-
<Button onClick={() => setEventDialogOpen(false)}>Cancel</Button>
259-
<Button onClick={handleSaveNewEvent}>Save</Button>
260-
</DialogActions>
261-
</Dialog>
262161
</Root>
263162
);
264163
};
265164

266-
export default Profile;
165+
export default Profile;

‎web-ui/src/components/profile/__snapshots__/Profile.test.jsx.snap‎

Lines changed: 0 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -56,30 +56,6 @@ exports[`renders correctly 1`] = `
5656
Current PDL:
5757
<br />
5858
</p>
59-
<button
60-
aria-label="Add New Organization"
61-
class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary css-sghohy-MuiButtonBase-root-MuiButton-root"
62-
style="margin-top: 20px;"
63-
tabindex="0"
64-
type="button"
65-
>
66-
Add New Organization
67-
<span
68-
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
69-
/>
70-
</button>
71-
<button
72-
aria-label="Add New Event"
73-
class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary css-sghohy-MuiButtonBase-root-MuiButton-root"
74-
style="margin-top: 20px; margin-left: 10px;"
75-
tabindex="0"
76-
type="button"
77-
>
78-
Add New Event
79-
<span
80-
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
81-
/>
82-
</button>
8359
</div>
8460
</div>
8561
</div>

‎web-ui/src/components/skills/SkillSection.css‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,6 @@
7979
flex-direction: row;
8080
flex-wrap: wrap;
8181
align-items: flex-end;
82-
padding: 0 16px 16px 16px;
8382
justify-content: space-between;
8483
}
8584

‎web-ui/src/components/skills/SkillSection.jsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,9 +23,11 @@ import { getSkill, createSkill } from '../../api/skill.js';
2323
import SkillSlider from './SkillSlider';
2424

2525
import {
26+
Avatar,
2627
Button,
2728
Card,
2829
CardActions,
30+
CardContent,
2931
Dialog,
3032
DialogActions,
3133
DialogContent,
@@ -280,9 +282,10 @@ const SkillSection = ({ userId }) => {
280282
</Modal>
281283
<Root>
282284
<Card>
285+
<CardContent>
283286
<div className="skill-card-header">
284287
<div className="skill-card-header-title">
285-
<BuildIcon style={{ marginRight: '16px' }} />
288+
<Avatar sx={{ mr: 1 }}><BuildIcon/></Avatar>
286289
<Typography variant="h5" component="h2">
287290
Skills
288291
</Typography>
@@ -315,6 +318,7 @@ const SkillSection = ({ userId }) => {
315318
);
316319
})}
317320
</List>
321+
</CardContent>
318322
<CardActions>
319323
<div>
320324
<Dialog

0 commit comments

Comments
 (0)