How to show a Toast?

[Zhelyazko]

How can I show a toast? I tried:

import {toast} from "@repo/design-system/hooks/use-toast";
...
toast({
        title: "Test title",
        description: "Your test succeeded",
      })

but the toast is not showing up. I also tried importing {toast} from "@repo/design-system/components/ui/use-toast" but still nothing is showing up. What am I missing?

[haydenbleasel]

Hey @Zhelyazko, next-forge is setup with shadcn's Sonner implementation by default (not toast).

So, I believe you need to use Sonner's toast directly — https://ui.shadcn.com/docs/components/sonner

[Zhelyazko]

Thanks. I tried doing that, but as soner wasn't available as a dependency for the app project, I thought that there's some wrapper around it in the design-system package because of this part of the docs:

https://docs.next-forge.com/packages/design-system/provider

The design system package also exports a DesignSystemProvider component which implements a number of contextual, functional and higher order components, including those for Tooltips, Toasts, Analytics, Dark Mode and more.

Adding soner as dependency in app project solved it.

[haydenbleasel]

Ah great point, I can probably clarify that in the docs. Thanks for the callout!