Sonner - Shadcn component

Add npx shadcn@latest add sonner

Enable in global

// src/app/layout.tsx
import { Toaster } from "@/components/ui/sonner";
...
<body
  className={`${geistSans.variable} ${geistMono.variable} antialiased`}
>
  <Providers>
    <Toaster />
    <Modals />
    {children}
  </Providers>
</body>
...

Use in component

import { toast } from "sonner";
... 
const handleSubmit = () => {
  ...
  toast.success("Workspace created");
  toast.error("Something went wrong");
};