Merge branch 'main' into avm99963-monorail
Merged commit 4137ed7879acadbf891e8c471108acb874dae886.
GitOrigin-RevId: b6100ffc5b1da355a35f37b13fcaaf746ee8b307
diff --git a/static_src/react/issue-wizard/ConfirmBackModal.tsx b/static_src/react/issue-wizard/ConfirmBackModal.tsx
new file mode 100644
index 0000000..0d07b83
--- /dev/null
+++ b/static_src/react/issue-wizard/ConfirmBackModal.tsx
@@ -0,0 +1,51 @@
+// Copyright 2022 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import * as React from 'react';
+import {makeStyles} from '@material-ui/styles';
+import Dialog from '@material-ui/core/Dialog';
+import DialogTitle from '@material-ui/core/DialogTitle';
+import DialogContent from '@material-ui/core/DialogContent';
+import DialogContentText from '@material-ui/core/DialogContentText';
+import DialogActions from '@material-ui/core/DialogActions';
+import Button from '@material-ui/core/Button';
+
+const userStyles = makeStyles({
+ actionsButtons: {
+ paddingTop: '0',
+ },
+ primaryButton: {
+ backgroundColor: 'rgb(25, 118, 210)',
+ color: 'white',
+ }
+});
+
+type Props = {
+ enable: boolean,
+ setEnable: Function,
+ confirmBack: Function,
+}
+
+export function ConfirmBackModal(props: Props): React.ReactElement {
+ const {enable, setEnable, confirmBack} = props;
+ const classes = userStyles();
+
+ return (
+ <Dialog open={enable}>
+ <DialogTitle>Warning!</DialogTitle>
+ <DialogContent>
+ <DialogContentText>
+ Changes you made on this page won't be saved.
+ </DialogContentText>
+ </DialogContent>
+ <DialogActions className={classes.actionsButtons}>
+ <Button onClick={() => setEnable(false)}>Cancel</Button>
+ <Button onClick={() => {
+ confirmBack();
+ setEnable(false);
+ }} className={classes.primaryButton}>Ok</Button>
+ </DialogActions>
+ </Dialog>
+ )
+}