Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add link to reports from detection submit modal #379

Merged
merged 11 commits into from
Apr 1, 2024
Merged

Add link to reports from detection submit modal #379

Changes from all commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
c550fe2
added new accent color, teal
mrose15 Mar 16, 2024
650de6b
added “Thank you for reporting” text, expanded ternary to include dif…
mrose15 Mar 16, 2024
c7688ac
removed accent 5 from primary palette, changed modal title to primary…
mrose15 Mar 21, 2024
f7844d0
Merge branch 'main' into feature/thank-you-modal-361
mrose15 Mar 21, 2024
7edacb4
added markup/styles for updated thank you modal
mrose15 Mar 27, 2024
22c5a62
Merge branch 'main' into feature/thank-you-modal-361
mrose15 Mar 27, 2024
2f2dee3
Merge branch 'main' into feature/thank-you-modal-361
mrose15 Mar 27, 2024
cd0af0c
made link relative
mrose15 Mar 28, 2024
3848367
removed font weight
mrose15 Mar 31, 2024
e18c4cb
removed isDesktop ternary operator
mrose15 Mar 31, 2024
096ac65
Merge branch 'main' into feature/thank-you-modal-361
paulcretu Apr 1, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
69 changes: 61 additions & 8 deletions ui/src/components/Player/DetectionDialog.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,17 @@
import CloseIcon from "@mui/icons-material/Close";
import {
Box,
Button,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
IconButton,
Paper,
TextField,
ToggleButton,
ToggleButtonGroup,
Typography,
useMediaQuery,
} from "@mui/material";
import { useTheme } from "@mui/material/styles";
mrose15 marked this conversation as resolved.
Show resolved Hide resolved
Expand Down Expand Up @@ -126,9 +129,43 @@ export default function DetectionDialog({
onClose={handleClose}
aria-labelledby="form-dialog-title"
>
<DialogTitle id="form-dialog-title">
{!submitted ? "Report what you heard" : "Thanks for submitting!"}
</DialogTitle>
<IconButton
aria-label="close"
onClick={handleClose}
sx={{
position: "absolute",
right: 8,
top: 8,
color: (theme) => theme.palette.grey[500],
mrose15 marked this conversation as resolved.
Show resolved Hide resolved
}}
>
<CloseIcon />
</IconButton>

{!submitted ? (
<DialogTitle id="form-dialog-title">
Report what you heard
</DialogTitle>
) : (
<>
<DialogTitle
id="form-dialog-title"
variant="h4"
mt={8}
align="center"
sx={{
color: (theme) => theme.palette.primary.main,
mrose15 marked this conversation as resolved.
Show resolved Hide resolved
}}
>
Thank you for reporting
</DialogTitle>
<Typography variant="body1" mb={2} mx={8} align="center">
Check out our reports to see how your support contributed to our
mission for marine conservation.
</Typography>
</>
)}

{!submitted && (
<DialogContent>
<ToggleButtonGroup
Expand Down Expand Up @@ -200,11 +237,27 @@ export default function DetectionDialog({
</Button>
</DialogActions>
) : (
<DialogActions>
<Button onClick={handleClose} color="primary">
CLOSE
</Button>
</DialogActions>
<>
<DialogActions sx={{ justifyContent: "center", mb: 10 }}>
<Button
onClick={handleClose}
color="primary"
variant="outlined"
sx={{ py: 2, px: [3, 6], mx: 2 }}
>
BACK
</Button>
<Button
href="/reports"
target="_blank"
color="primary"
variant="contained"
sx={{ py: 2, px: [3, 6], mx: 2 }}
>
SEE REPORTS
</Button>
</DialogActions>
</>
)}
</Dialog>
</>
Expand Down
Loading