Skip to content

issue: action button persists on future toasts #692

Description

@jordiup

context

  • using toast.promise
  • using global toast ids on Toaster + toast() call
  • using toasterId for parent styling

problem description

  • when setting an action button in a toast.promise error: () => case the action persists on for all subsequent toasts under that id
Screen.Recording.2025-10-01.at.11.08.26.am.mov

expected behaviour

  • action should not cache/propagate to subsequent toast.promise calls
  • in last 5s of screen recording, you can see a fresh reload performs expected behaviour but if a previous action call occurs it will pollute context

code sample

// toaster def
      <SonnerToaster
        id="medcertSuccess"
        position="top-right"
        toastOptions={{
          classNames: {
            default: "",
            success: "",
            error: "",
          },
        }}
      />

// usage 
    toast.promise(
      updateMedicalCertificateMutation.mutateAsync({
        id: currentMedCertId,
      }),
      {
        loading: "Updating...",
        id: "generalCertupdate", // <-- toast id
        success: {
          message: "Saved",
        },
        error: (error) => {
          /* problem 👇 this will pollute future toast context */
          return {
            duration: 3000,
            message: error.message || "Failed to update leave category",
            action: {
              label: "Go back",
              onClick: goBack,
            },
          }
        },
        position: "top-right",
        toasterId: "medcertSuccess", // <-- toaster id (see above)
      },
    )

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions