update notification component
This commit is contained in:
parent
d445153679
commit
8444ffe49e
|
@ -1,5 +1,6 @@
|
||||||
import CloseIcon from '@mui/icons-material/Close';
|
import CloseIcon from '@mui/icons-material/Close';
|
||||||
import {
|
import {
|
||||||
|
Box,
|
||||||
Button,
|
Button,
|
||||||
ButtonProps,
|
ButtonProps,
|
||||||
IconButton,
|
IconButton,
|
||||||
|
@ -30,7 +31,7 @@ export default function Notification({ open, onClose, attributes }: Iprops) {
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleClick = () => {
|
const handleClick = () => {
|
||||||
attributes?.onClick();
|
attributes.onClick();
|
||||||
onClose();
|
onClose();
|
||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
|
@ -55,7 +56,9 @@ export default function Notification({ open, onClose, attributes }: Iprops) {
|
||||||
spacing={2}
|
spacing={2}
|
||||||
direction="row"
|
direction="row"
|
||||||
alignItems={'center'}>
|
alignItems={'center'}>
|
||||||
{attributes?.startIcon ?? <InfoIcon />}
|
<Box sx={{ svg: { fontSize: '36px' } }}>
|
||||||
|
{attributes.startIcon ?? <InfoIcon />}
|
||||||
|
</Box>
|
||||||
|
|
||||||
<Stack
|
<Stack
|
||||||
direction={'column'}
|
direction={'column'}
|
||||||
|
@ -74,8 +77,10 @@ export default function Notification({ open, onClose, attributes }: Iprops) {
|
||||||
)}
|
)}
|
||||||
</Stack>
|
</Stack>
|
||||||
|
|
||||||
{attributes?.endIcon ? (
|
{attributes.endIcon ? (
|
||||||
<IconButton onClick={attributes.onClick}>
|
<IconButton
|
||||||
|
onClick={attributes.onClick}
|
||||||
|
sx={{ fontSize: '36px' }}>
|
||||||
{attributes?.endIcon}
|
{attributes?.endIcon}
|
||||||
</IconButton>
|
</IconButton>
|
||||||
) : (
|
) : (
|
||||||
|
|
|
@ -463,13 +463,14 @@ export default function Uploader(props: Props) {
|
||||||
subtext: constants.STORAGE_QUOTA_EXCEEDED,
|
subtext: constants.STORAGE_QUOTA_EXCEEDED,
|
||||||
message: constants.UPGRADE_NOW,
|
message: constants.UPGRADE_NOW,
|
||||||
onClick: () => galleryContext.showPlanSelectorModal(),
|
onClick: () => galleryContext.showPlanSelectorModal(),
|
||||||
startIcon: <DiscFullIcon fontSize="large" />,
|
startIcon: <DiscFullIcon />,
|
||||||
};
|
};
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
notification = {
|
notification = {
|
||||||
variant: 'danger',
|
variant: 'danger',
|
||||||
message: constants.UNKNOWN_ERROR,
|
message: constants.UNKNOWN_ERROR,
|
||||||
|
onClick: () => null,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
appContext.setNotificationAttributes(notification);
|
appContext.setNotificationAttributes(notification);
|
||||||
|
|
|
@ -666,7 +666,6 @@ export default function Gallery() {
|
||||||
sidebarView={sidebarView}
|
sidebarView={sidebarView}
|
||||||
closeSidebar={closeSidebar}
|
closeSidebar={closeSidebar}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<PhotoFrame
|
<PhotoFrame
|
||||||
files={files}
|
files={files}
|
||||||
syncWithRemote={syncWithRemote}
|
syncWithRemote={syncWithRemote}
|
||||||
|
|
|
@ -6,7 +6,7 @@ export interface NotificationAttributes {
|
||||||
variant: ButtonProps['color'];
|
variant: ButtonProps['color'];
|
||||||
message: JSX.Element | string;
|
message: JSX.Element | string;
|
||||||
subtext?: JSX.Element | string;
|
subtext?: JSX.Element | string;
|
||||||
onClick?: () => void;
|
onClick: () => void;
|
||||||
endIcon?: ReactNode;
|
endIcon?: ReactNode;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue