diff --git a/src/components/Notification/Notification.js b/src/components/Notification/Notification.js index 44dc904..266e08a 100644 --- a/src/components/Notification/Notification.js +++ b/src/components/Notification/Notification.js @@ -90,7 +90,8 @@ export default function Notification({ variant, ...props }) {
({ +export default makeStyles((theme) => ({ notificationContainer: { display: "flex", - alignItems: "center", + alignItems: "center" }, notificationContained: { borderRadius: 45, height: 45, - boxShadow: theme.customShadows.widgetDark, + boxShadow: theme.customShadows.widgetDark }, notificationContainedShadowless: { - boxShadow: "none", + boxShadow: "none" }, notificationIconContainer: { minWidth: 45, @@ -20,28 +20,31 @@ export default makeStyles(theme => ({ display: "flex", alignItems: "center", justifyContent: "center", - fontSize: 24, + fontSize: 24 }, notificationIconContainerContained: { fontSize: 18, - color: "#FFFFFF80", + color: "#FFFFFF80" }, notificationIconContainerRounded: { - marginRight: theme.spacing(2), + marginRight: theme.spacing(2) }, containedTypography: { - color: "white", + color: "white" + }, + roundedTypography: { + color: "#4A4A4A" }, messageContainer: { display: "flex", alignItems: "center", justifyContent: "space-between", - flexGrow: 1, + flexGrow: 1 }, extraButton: { color: "white", "&:hover, &:focus": { - background: "transparent", - }, - }, + background: "transparent" + } + } })); diff --git a/src/context/ToastContext.js b/src/context/ToastContext.js index 80ef189..7fa4bd5 100644 --- a/src/context/ToastContext.js +++ b/src/context/ToastContext.js @@ -33,7 +33,6 @@ export const toastDispatchActions = (dispatch) => ({ }); const ToastProvider = ({ children }) => { - // var [errorToastId, setErrorToastId] = useState(null); const [state, dispatch] = useReducer(toastReducer, toastInitialState); const dispatchActions = useMemo(() => toastDispatchActions(dispatch), [ dispatch @@ -56,8 +55,6 @@ const ToastProvider = ({ children }) => { const notify = useCallback( (message, type, extraButtonClick) => { - // if (errorToastId && type === "error") return; - let componentProps; switch (type) { @@ -79,6 +76,22 @@ const ToastProvider = ({ children }) => { extraButtonClick }; break; + case "defence": + componentProps = { + type: "defence", + message, + variant: "contained", + color: "info" + }; + break; + case "disk": + componentProps = { + type: "disc", + message, + variant: "rounded", + color: "info" + }; + break; default: componentProps = { type: "shipped", @@ -92,12 +105,9 @@ const ToastProvider = ({ children }) => { type, position: positions[state.position], progressClassName: classes.progress, - // onClose: type === "error" && (() => setErrorToastId(null)), className: classes.notification }); - // if (type === "error") setErrorToastId(toastId); - return toastId; }, [sendNotification, classes, state.position] @@ -107,6 +117,9 @@ const ToastProvider = ({ children }) => { () => ({ ...dispatchActions, info: (message) => notify(message, "info"), + error: (message) => notify(message, "error"), + success: (message) => notify(message, "success"), + defence: (message) => notify(message, "defence"), notify }), [dispatchActions, notify] diff --git a/src/pages/notifications/Notifications.js b/src/pages/notifications/Notifications.js index 496fa79..a455c04 100644 --- a/src/pages/notifications/Notifications.js +++ b/src/pages/notifications/Notifications.js @@ -146,6 +146,22 @@ export default function NotificationsPage(props) { > Success Message + +