Skip to content

Commit

Permalink
[BHBC-899] Funding Source Dialog UI Update
Browse files Browse the repository at this point in the history
  • Loading branch information
@jeznorth
jeznorth committed Mar 25, 2021
1 parent d067c88 commit 0731f30
Show file tree
Hide file tree
Showing 6 changed files with 289 additions and 240 deletions.
2 changes: 1 addition & 1 deletion app/src/features/projects/CreateProjectPage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -495,7 +495,7 @@ const CreateProjectPage: React.FC = () => {
<Typography variant="h2" className={classes.stepTitle}>
{stepForms[index].stepTitle}
</Typography>
<Typography variant="subtitle2">{stepForms[index].stepSubTitle}</Typography>
<Typography variant="subtitle1">{stepForms[index].stepSubTitle}</Typography>
</Box>
</StepLabel>
<StepContent>
Expand Down
22 changes: 11 additions & 11 deletions app/src/features/projects/__snapshots__/CreateProjectPage.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,7 @@ exports[`CreateProjectPage removes the extra project steps if all permits are ma
Project Coordinator
</h2>
<h6
class="MuiTypography-root MuiTypography-subtitle2"
class="MuiTypography-root MuiTypography-subtitle1"
>
Enter contact details for the project coordinator
</h6>
Expand Down Expand Up @@ -172,7 +172,7 @@ exports[`CreateProjectPage removes the extra project steps if all permits are ma
Permits
</h2>
<h6
class="MuiTypography-root MuiTypography-subtitle2"
class="MuiTypography-root MuiTypography-subtitle1"
>
Enter permits associated with this project
</h6>
Expand Down Expand Up @@ -572,7 +572,7 @@ exports[`CreateProjectPage renders the initial default page correctly 1`] = `
Project Coordinator
</h2>
<h6
class="MuiTypography-root MuiTypography-subtitle2"
class="MuiTypography-root MuiTypography-subtitle1"
>
Enter contact details for the project coordinator
</h6>
Expand Down Expand Up @@ -1076,7 +1076,7 @@ exports[`CreateProjectPage renders the initial default page correctly 1`] = `
Permits
</h2>
<h6
class="MuiTypography-root MuiTypography-subtitle2"
class="MuiTypography-root MuiTypography-subtitle1"
>
Enter permits associated with this project
</h6>
Expand Down Expand Up @@ -1142,7 +1142,7 @@ exports[`CreateProjectPage renders the initial default page correctly 1`] = `
General Information
</h2>
<h6
class="MuiTypography-root MuiTypography-subtitle2"
class="MuiTypography-root MuiTypography-subtitle1"
>
General information and details about this project
</h6>
Expand Down Expand Up @@ -1208,7 +1208,7 @@ exports[`CreateProjectPage renders the initial default page correctly 1`] = `
Objectives
</h2>
<h6
class="MuiTypography-root MuiTypography-subtitle2"
class="MuiTypography-root MuiTypography-subtitle1"
>
Enter the objectives and potential caveats for this project
</h6>
Expand Down Expand Up @@ -1274,7 +1274,7 @@ exports[`CreateProjectPage renders the initial default page correctly 1`] = `
Location
</h2>
<h6
class="MuiTypography-root MuiTypography-subtitle2"
class="MuiTypography-root MuiTypography-subtitle1"
>
Specify project regions and boundary information
</h6>
Expand Down Expand Up @@ -1340,7 +1340,7 @@ exports[`CreateProjectPage renders the initial default page correctly 1`] = `
Species
</h2>
<h6
class="MuiTypography-root MuiTypography-subtitle2"
class="MuiTypography-root MuiTypography-subtitle1"
>
Information about species this project is inventorying or monitoring
</h6>
Expand Down Expand Up @@ -1406,7 +1406,7 @@ exports[`CreateProjectPage renders the initial default page correctly 1`] = `
IUCN Classification
</h2>
<h6
class="MuiTypography-root MuiTypography-subtitle2"
class="MuiTypography-root MuiTypography-subtitle1"
>
Lorem ipsum dolor sit amet, consectur whatever whatever
</h6>
Expand Down Expand Up @@ -1472,7 +1472,7 @@ exports[`CreateProjectPage renders the initial default page correctly 1`] = `
Funding
</h2>
<h6
class="MuiTypography-root MuiTypography-subtitle2"
class="MuiTypography-root MuiTypography-subtitle1"
>
Specify funding sources for the project
</h6>
Expand Down Expand Up @@ -1538,7 +1538,7 @@ exports[`CreateProjectPage renders the initial default page correctly 1`] = `
Partnerships
</h2>
<h6
class="MuiTypography-root MuiTypography-subtitle2"
class="MuiTypography-root MuiTypography-subtitle1"
>
Specify partnerships for the project
</h6>
Expand Down
47 changes: 27 additions & 20 deletions app/src/features/projects/components/ProjectFundingItemForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,17 +4,17 @@ import {
Dialog,
DialogActions,
DialogContent,
DialogContentText,
DialogTitle,
Divider,
FormControl,
FormHelperText,
FormLabel,
Grid,
InputAdornment,
InputLabel,
MenuItem,
Select,
TextField,
Typography
TextField
} from '@material-ui/core';
import { IMultiAutocompleteFieldOption } from 'components/fields/MultiAutocompleteFieldVariableSize';
import StartEndDateFields from 'components/fields/StartEndDateFields';
Expand Down Expand Up @@ -105,14 +105,13 @@ const ProjectFundingItemForm: React.FC<IProjectFundingItemFormProps> = (props) =
aria-describedby="alert-dialog-description">
<DialogTitle id="alert-dialog-title">Add Funding Source</DialogTitle>
<DialogContent>
<DialogContentText id="alert-dialog-description">Enter Funding Source Details</DialogContentText>
<Box py={2}>
<Box component="fieldset">
<FormLabel id="agency_details" component="legend">
Agency Details
</FormLabel>
<Grid container spacing={3}>
<Grid item xs={12}>
<Typography variant="h3">Agency Details</Typography>
</Grid>
<Grid item xs={12}>
<FormControl fullWidth variant="outlined" required={true} style={{ width: '100%' }}>
<FormControl variant="outlined" required={true} style={{ width: '100%' }}>
<InputLabel id="agency_id-label">Agency Name</InputLabel>
<Select
id="agency_id"
Expand Down Expand Up @@ -193,9 +192,11 @@ const ProjectFundingItemForm: React.FC<IProjectFundingItemFormProps> = (props) =
helperText={errors.agency_project_id}
/>
</Grid>
<Grid item xs={12}>
<Typography variant="h3">Funding Details</Typography>
</Grid>
</Grid>
</Box>
<Box component="fieldset" mt={5}>
<FormLabel component="legend">Funding Details</FormLabel>
<Grid container spacing={3}>
<Grid item xs={12}>
<TextField
fullWidth
Expand All @@ -218,24 +219,30 @@ const ProjectFundingItemForm: React.FC<IProjectFundingItemFormProps> = (props) =
<StartEndDateFields formikProps={formikProps} startRequired={true} endRequired={true} />
</Grid>
</Box>
<Box mt={4}>
<Divider />
</Box>
</DialogContent>
<DialogActions>
<Button
variant="contained"
color="primary"
onClick={async () => {
handleSubmit();
}}
autoFocus
aria-label="Add Funding Source">
Add
</Button>
<Button
variant="outlined"
onClick={() => {
props.onCancel();
resetForm();
}}
color="primary">
Cancel
</Button>
<Button
onClick={async () => {
handleSubmit();
}}
color="primary"
autoFocus>
Add
</Button>
</DialogActions>
</Dialog>
</>
Expand Down
Loading

0 comments on commit 0731f30

Please sign in to comment.