mirror of https://github.com/buster-so/buster.git
update the toaster
This commit is contained in:
parent
97d8dc8c46
commit
b4706b40ff
|
@ -3,7 +3,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { useTheme } from 'next-themes';
|
import { useTheme } from 'next-themes';
|
||||||
import { Toaster as ToasterSonner } from 'sonner';
|
import { Toaster as ToasterSonner } from 'sonner';
|
||||||
import { CircleCheck, CircleXmark, CircleWarning } from '@/components/ui/icons/NucleoIconOutlined';
|
import { CircleCheck, CircleXmark, CircleWarning } from '@/components/ui/icons/NucleoIconFilled';
|
||||||
|
|
||||||
type ToasterProps = React.ComponentProps<typeof ToasterSonner>;
|
type ToasterProps = React.ComponentProps<typeof ToasterSonner>;
|
||||||
|
|
||||||
|
@ -12,9 +12,10 @@ const Toaster = ({ ...props }: ToasterProps) => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ToasterSonner
|
<ToasterSonner
|
||||||
position="top-center"
|
position="bottom-right"
|
||||||
expand={true}
|
expand={false}
|
||||||
visibleToasts={5}
|
visibleToasts={5}
|
||||||
|
duration={3000}
|
||||||
icons={{
|
icons={{
|
||||||
success: <CircleCheck />,
|
success: <CircleCheck />,
|
||||||
error: <CircleXmark />,
|
error: <CircleXmark />,
|
||||||
|
@ -29,7 +30,8 @@ const Toaster = ({ ...props }: ToasterProps) => {
|
||||||
'group toast group-[.toaster]:bg-background! border !p-3 group-[.toaster]:text-foreground! group-[.toaster]:border-border! group-[.toaster]:shadow!',
|
'group toast group-[.toaster]:bg-background! border !p-3 group-[.toaster]:text-foreground! group-[.toaster]:border-border! group-[.toaster]:shadow!',
|
||||||
description: 'group-[.toast]:text-muted-foreground',
|
description: 'group-[.toast]:text-muted-foreground',
|
||||||
actionButton: 'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',
|
actionButton: 'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',
|
||||||
cancelButton: 'group-[.toast]:bg-border group-[.toast]:text-foreground'
|
cancelButton: 'group-[.toast]:bg-border group-[.toast]:text-foreground',
|
||||||
|
icon: 'mx-0! !flex !justify-center'
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
{...props}
|
{...props}
|
||||||
|
|
|
@ -27,8 +27,7 @@ const openNotification = (props: NotificationProps) => {
|
||||||
|
|
||||||
const toastOptions: ExternalToast = {
|
const toastOptions: ExternalToast = {
|
||||||
...props,
|
...props,
|
||||||
description: !hasTitle && message ? message : message,
|
description: !hasTitle && message ? message : message
|
||||||
position: 'top-center'
|
|
||||||
};
|
};
|
||||||
|
|
||||||
switch (type) {
|
switch (type) {
|
||||||
|
|
Loading…
Reference in New Issue