aboutsummaryrefslogtreecommitdiff
path: root/src/components/ModalScreen
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/ModalScreen')
-rw-r--r--src/components/ModalScreen/ModalScreen.tsx19
1 files changed, 12 insertions, 7 deletions
diff --git a/src/components/ModalScreen/ModalScreen.tsx b/src/components/ModalScreen/ModalScreen.tsx
index 7090980..6c514cd 100644
--- a/src/components/ModalScreen/ModalScreen.tsx
+++ b/src/components/ModalScreen/ModalScreen.tsx
@@ -17,7 +17,9 @@ import CloseIcon from '@material-ui/icons/Close';
interface PropTypes {
title: string;
- rightIcon?: JSX.Element;
+ actionIcon?: JSX.Element;
+ handleAction?: () => void;
+ isActionDisabled?: boolean;
}
const useStyles = makeStyles(theme => ({
@@ -38,7 +40,7 @@ const Transition = React.forwardRef((
ref: React.Ref<unknown>
) => <Slide direction="left" ref={ref} {...props} />);
-const ModalScreen: React.FC<PropTypes> = ({ title, rightIcon, children }) => {
+const ModalScreen: React.FC<PropTypes> = ({ title, actionIcon, handleAction, isActionDisabled, children }) => {
const [isOpen, setIsOpen] = useState<boolean>(true);
const classes = useStyles();
const theme = useTheme();
@@ -48,6 +50,11 @@ const ModalScreen: React.FC<PropTypes> = ({ title, rightIcon, children }) => {
const handleClose = useCallback(() => setIsOpen(false), [setIsOpen]);
const onExited = useCallback(() => history.goBack(), [history]);
+ const handleClickAction = useCallback(async () => {
+ if (handleAction) await handleAction();
+ return handleClose();
+ }, [handleAction, handleClose]);
+
return (
<Dialog
open={isOpen}
@@ -66,11 +73,9 @@ const ModalScreen: React.FC<PropTypes> = ({ title, rightIcon, children }) => {
<Typography variant="h6">
{ title }
</Typography>
- { rightIcon || (
- <IconButton style={{ visibility: 'hidden' }}>
- <CloseIcon />
- </IconButton>
- )}
+ <IconButton onClick={handleClickAction} disabled={isActionDisabled}>
+ { actionIcon }
+ </IconButton>
</Toolbar>
</AppBar>
<Divider />