Skip to content

Commit ce061d4

Browse files
RChandler234RChandler234
authored
Merge pull request #1747 from Northeastern-Electric-Racing/#1639-activation-page-different-design
#1639 activation page different design
2 parents 88aa4ae + ad25b5c commit ce061d4

4 files changed

Lines changed: 42 additions & 61 deletions

File tree

‎src/frontend/src/pages/ChangeRequestDetailPage/ActivationDetails.tsx‎

Lines changed: 16 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -4,45 +4,34 @@
44
*/
55

66
import { ActivationChangeRequest } from 'shared';
7-
import { booleanPipe, datePipe, fullNamePipe } from '../../utils/pipes';
8-
import PageBlock from '../../layouts/PageBlock';
7+
import { datePipe, fullNamePipe } from '../../utils/pipes';
98
import Grid from '@mui/material/Grid';
109
import Typography from '@mui/material/Typography';
10+
import InfoBlock from '../../components/InfoBlock';
1111

1212
interface ActivationDetailsProps {
1313
cr: ActivationChangeRequest;
1414
}
1515

1616
const ActivationDetails: React.FC<ActivationDetailsProps> = ({ cr }) => {
1717
return (
18-
<PageBlock title={'Activation Change Request Details'}>
19-
<Grid container>
20-
<Grid item xs={6} md={2}>
21-
<Typography sx={{ fontWeight: 'bold' }}>Project Lead </Typography>
22-
</Grid>
23-
<Grid item xs={6} md={2}>
18+
<Grid container>
19+
<Grid item xs={6} md={2}>
20+
<InfoBlock title={'Project Lead'}>
2421
<Typography>{fullNamePipe(cr.projectLead)}</Typography>
25-
</Grid>
26-
<Grid item xs={6} md={2}>
27-
<Typography sx={{ fontWeight: 'bold' }}>Start Date </Typography>
28-
</Grid>
29-
<Grid item xs={6} md={6}>
30-
<Typography>{datePipe(cr.startDate)}</Typography>
31-
</Grid>
32-
<Grid item xs={6} md={2}>
33-
<Typography sx={{ fontWeight: 'bold' }}>Project Manager </Typography>
34-
</Grid>
35-
<Grid item xs={6} md={2}>
22+
</InfoBlock>
23+
</Grid>
24+
<Grid item xs={6} md={2}>
25+
<InfoBlock title={'Project Manager'}>
3626
<Typography>{fullNamePipe(cr.projectManager)}</Typography>
37-
</Grid>
38-
<Grid item xs={6} md={2}>
39-
<Typography sx={{ fontWeight: 'bold' }}>Confirm WP Details </Typography>
40-
</Grid>
41-
<Grid item xs={6} md={6}>
42-
<Typography>{booleanPipe(cr.confirmDetails)}</Typography>
43-
</Grid>
27+
</InfoBlock>
28+
</Grid>
29+
<Grid item xs={6} md={2}>
30+
<InfoBlock title={'Start Date'}>
31+
<Typography>{datePipe(cr.startDate)}</Typography>
32+
</InfoBlock>
4433
</Grid>
45-
</PageBlock>
34+
</Grid>
4635
);
4736
};
4837

‎src/frontend/src/pages/ChangeRequestDetailPage/ChangeRequestDetailsView.tsx‎

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@ import StageGateDetails from './StageGateDetails';
2020
import ImplementedChangesList from './ImplementedChangesList';
2121
import StandardDetails from './StandardDetails';
2222
import ReviewChangeRequest from './ReviewChangeRequest';
23-
import PageBlock from '../../layouts/PageBlock';
2423
import ReviewNotes from './ReviewNotes';
2524
import ProposedSolutionsList from './ProposedSolutionsList';
2625
import { Grid, Typography, Link } from '@mui/material';
@@ -46,13 +45,11 @@ const buildDetails = (cr: ChangeRequest): ReactElement => {
4645
const buildProposedSolutions = (cr: ChangeRequest): ReactElement => {
4746
if (cr.type !== ChangeRequestType.Activation && cr.type !== ChangeRequestType.StageGate) {
4847
return (
49-
<PageBlock title={'Proposed Solutions'}>
50-
<ProposedSolutionsList
51-
proposedSolutions={(cr as StandardChangeRequest).proposedSolutions}
52-
crReviewed={cr.accepted}
53-
crId={cr.crId}
54-
/>
55-
</PageBlock>
48+
<ProposedSolutionsList
49+
proposedSolutions={(cr as StandardChangeRequest).proposedSolutions}
50+
crReviewed={cr.accepted}
51+
crId={cr.crId}
52+
/>
5653
);
5754
} else {
5855
return <></>;

‎src/frontend/src/pages/ChangeRequestDetailPage/StandardDetails.tsx‎

Lines changed: 21 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import Typography from '@mui/material/Typography';
88
import React from 'react';
99

1010
import { ChangeRequestExplanation, StandardChangeRequest } from 'shared';
11-
import PageBlock from '../../layouts/PageBlock';
1211

1312
interface StandardDetailsProps {
1413
cr: StandardChangeRequest;
@@ -19,30 +18,28 @@ const style = {
1918
};
2019
const StandardDetails: React.FC<StandardDetailsProps> = ({ cr }: StandardDetailsProps) => {
2120
return (
22-
<PageBlock title={'Standard Change Request Details'}>
23-
<Grid container spacing={1}>
24-
<Grid item xs={2}>
25-
<Typography sx={style}>What</Typography>
26-
</Grid>
27-
<Grid item xs={10}>
28-
<Typography>{cr.what}</Typography>
29-
</Grid>
30-
<Grid item xs={2}>
31-
<Typography sx={style}>Why</Typography>
32-
</Grid>
33-
{cr.why.map((ele: ChangeRequestExplanation, idx: number) => (
34-
<React.Fragment key={'CRExplanation' + idx}>
35-
{idx !== 0 ? <Grid item xs={2}></Grid> : <></>}
36-
<Grid item xs={2}>
37-
<Typography sx={style}>{ele.type}</Typography>
38-
</Grid>
39-
<Grid item xs={8}>
40-
<Typography>{ele.explain}</Typography>
41-
</Grid>
42-
</React.Fragment>
43-
))}
21+
<Grid container spacing={1}>
22+
<Grid item xs={2}>
23+
<Typography sx={style}>What</Typography>
4424
</Grid>
45-
</PageBlock>
25+
<Grid item xs={10}>
26+
<Typography>{cr.what}</Typography>
27+
</Grid>
28+
<Grid item xs={2}>
29+
<Typography sx={style}>Why</Typography>
30+
</Grid>
31+
{cr.why.map((ele: ChangeRequestExplanation, idx: number) => (
32+
<React.Fragment key={'CRExplanation' + idx}>
33+
{idx !== 0 ? <Grid item xs={2}></Grid> : <></>}
34+
<Grid item xs={2}>
35+
<Typography sx={style}>{ele.type}</Typography>
36+
</Grid>
37+
<Grid item xs={8}>
38+
<Typography>{ele.explain}</Typography>
39+
</Grid>
40+
</React.Fragment>
41+
))}
42+
</Grid>
4643
);
4744
};
4845

‎src/frontend/src/tests/pages/ChangeRequestDetailPage/ActivationDetails.test.tsx‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,5 @@ describe('Change request details activation cr display element tests', () => {
2727
expect(screen.getByText(`${cr.projectManager.firstName} ${cr.projectManager.lastName}`)).toBeInTheDocument();
2828
expect(screen.getByText(`Start Date`)).toBeInTheDocument();
2929
expect(screen.getByText(`${datePipe(cr.startDate)}`)).toBeInTheDocument();
30-
expect(screen.getByText(`Confirm WP Details`)).toBeInTheDocument();
31-
expect(screen.getByText(`${cr.confirmDetails ? 'YES' : 'NO'}`)).toBeInTheDocument();
3230
});
3331
});

0 commit comments

Comments
 (0)