v3.0.0 - Middleware support

Middleware mode

In order to be able to show toasts anywhere in the app you need to add the following code to your root.tsx file.

import { getToast, unstable_toastMiddleware } from "remix-toast/middleware";

export const loader = async ({ request }: LoaderFunctionArgs) => {
  // Extracts the toast from the request
  const toast = getToast(context); 
  // pass it to the client side
  return { toast }
}

export default function App({ children }: { children: ReactNode }) {
  const { toast } = useLoaderData<typeof loader>();
  
  useEffect(() => {
   if(toast){
    // Call your toast function here
    alert(toast.message);
   }
  }, [toast])

  return (
    ...
  );
}

// Export the middleware to be used in the app
export const unstable_middleware = [unstable_toastMiddleware()];

This change also should fix any sort of race condition issues that were reported in the past

What's Changed

• Update package.json by @petrpacas in #32
• Update git organizations to forge-42 by @beeman in #39

New Contributors

• @petrpacas made their first contribution in #32
• @beeman made their first contribution in #39

Full Changelog: v2.0.0...v3.0.0