32 lines
673 B
JavaScript
32 lines
673 B
JavaScript
|
import React from "react";
|
||
|
|
import { Box, Text } from "theme-ui";
|
||
|
|
import { ToastProvider as DefaultToastProvider } from "react-toast-notifications";
|
||
|
|
|
||
|
|
function CustomToast({ children }) {
|
||
|
|
return (
|
||
|
|
<Box
|
||
|
|
m={2}
|
||
|
|
mb={0}
|
||
|
|
bg="overlay"
|
||
|
|
sx={{ borderRadius: "4px", padding: "12px 16px" }}
|
||
|
|
>
|
||
|
|
<Text as="p" variant="body2">
|
||
|
|
{children}
|
||
|
|
</Text>
|
||
|
|
</Box>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
export function ToastProvider({ children }) {
|
||
|
|
return (
|
||
|
|
<DefaultToastProvider
|
||
|
|
components={{ Toast: CustomToast }}
|
||
|
|
autoDismiss={true}
|
||
|
|
autoDismissTimeout={2000}
|
||
|
|
placement="bottom-center"
|
||
|
|
>
|
||
|
|
{children}
|
||
|
|
</DefaultToastProvider>
|
||
|
|
);
|
||
|
|
}
|