A simple example to add toast messages in Remix
Open this example on CodeSandbox:
It's a pretty common use case to provide feedback to the users in the form of toast messages. In this example, we take a look at how to use session cookies to set the feedback messages at the action handler and read from the session cookie at the root loader. When we make a non-GET request Remix automatically reloads all the matching loaders, and since root loader will always be called, it's a good place to keep our toast message component.
We use the flash method in the session object to set the message. Once we read the value set using the flash method, the value will be unset from the session when we commit the session. Thus on the following request, when the loader reads the cookie, the value won't be there and, we can avoid reading the same value between requests.