Toasts (and confetti) now built-into the Epic Stack

[kentcdodds]

Huge thank you to @AlemTuzlak for doing the bulk of the work on this. Toasts (and flash messages in general) are now built into the Epic Stack 🎊

Read more in the documentation: https://github.com/epicweb-dev/epic-stack/blob/main/docs/toasts.md

[MoSattler]

Quick question: When a RR7 action returns a 400 status code, loaders (including the root loader that handles toasts) don't revalidate. See this. So whats the best approach to show a toast when returning an error with a 400 code from an action?

[AlemTuzlak]

You can return it via json and programatically show it via useEffect, like the dataWithToast utility from remix-toast does

[kentcdodds]

I tried to reproduce the problem with the current version of the Epic Stack, and I wasn't able to. It seems to be revalidating on a 400 status code anyway. Can you give me a specific series of actions to take to reproduce the problem? I know that React Router documentation says that it's not going to revalidate on non-successful responses from actions, but you can check out my livestream here (I started working on this around 45 minutes I think) and I noticed it was revalidating even on a 400. Maybe that's a bug?

[kentcdodds]

I think I managed to reproduce this with an invariantResponse usage which triggers the catch boundary and that does not revalidate. I'm trying to decide whether or not that's actually desirable because that's going to show the error boundary anyway which is an error UI. I think it's probably better to revalidate if we have a cookie for the toast message, so I'll look into adding some way to determine whether we have a cookie for a toast message in our shouldRevalidate of the route. Loader and revalidate if we do.

[kentcdodds]

After further investigation, it looks like adding shouldRevalidate to the root loader doesn't end up even getting called when an action has a thrown Response. That seems contrary to what I'm seeing in the docs as well. I'm a little bit confused as to what to do in this case. I think it would be good to make a minimal reproduction of the issue and report that to the team, and see what they say.

[MoSattler]

I apologize, I left out some important context. The repo where I ran into this issue was a fresh RR7 app (not using Epic Stack). I just tend to use bits and pieces of Epic Stack since it has a ton of useful patterns - for example, here I took the toast.

And I ran into exactly the issue I mentioned. The fix was indeed to set shouldRevalidate to return true in the root loader.

So I'm not sure why it's not working as documented in Epic Stack, but in a fresh RR7 app, it seems to work as expected.