Refine•4y ago

Toast notification recommendation?

Hey Guys, would anyone like to recommend their favorite toast notification to use with Refine?

Omer•10/31/22, 5:12 AM

Hi @ben_g.

,
Which UI framework are you using?

unique-blueOP•10/31/22, 5:18 AM

hey @Omer ant d

unique-blueOP•10/31/22, 5:18 AM

i was thinking to just use theirs

unique-blueOP•10/31/22, 5:18 AM

but wondered if there were ay other recommendations?

Omer•10/31/22, 5:19 AM

Maybe you can use Message notifications?
https://ant.design/components/message/

unique-blueOP•10/31/22, 5:23 AM

I think im going to thanks @Omer
i tried using https://react-hot-toast.com/ but didnt work out that well.

Add beautiful notifications to your React app with react-hot-toast. Lightweight. Smoking hot by default.

unique-blueOP•10/31/22, 7:09 AM

Hey @Omer in your example here
https://github.com/refinedev/refine/blob/next/examples/reactToastify/src/App.tsx
you add the <toastcontainer /> to the layout with the cgildren prop.

im using the Layout props from ant d

what is the best way to add something like a <toastContainer> to the layout

GitHub

Build your React-based CRUD applications, without constraints. - refine/App.tsx at next · refinedev/refine

Omer•10/31/22, 8:21 AM

hmm you can use offLayoutAreaoffLayoutArea property of <Refine> component

`` component is the entry point of a refine app. It is where the highest level of configuration of the app occurs.

unique-blueOP•10/31/22, 9:45 AM

Awesome ! @Omer I'll give that a try. Thanks

unique-blueOP•10/31/22, 9:48 AM

Yep, thats the ticket. Worked perfectly. Thanks again @Omer