nuxt4-demo/app/plugins/toast-autoclose-fallback.client.ts

const TOAST_PATCH_FLAG = '__person_panel_toast_patch_applied__'
const DEFAULT_TOAST_DURATION_MS = 5000
const FALLBACK_EXTRA_MS = 400

export default defineNuxtPlugin(() => {
  const g = globalThis as typeof globalThis & { [TOAST_PATCH_FLAG]?: boolean }
  if (g[TOAST_PATCH_FLAG]) {
    return
  }

  const toast = useToast()
  const originalAdd = toast.add.bind(toast)
  const originalRemove = toast.remove.bind(toast)
  type ToastId = Parameters<typeof toast.remove>[0]
  const timers = new Map<ToastId, ReturnType<typeof setTimeout>>()

  const clearFallbackTimer = (id: ToastId) => {
    const timer = timers.get(id)
    if (!timer) {
      return
    }
    clearTimeout(timer)
    timers.delete(id)
  }

  const scheduleFallbackRemove = (id: ToastId, duration?: number) => {
    clearFallbackTimer(id)

    const finalDuration = typeof duration === 'number' ? duration : DEFAULT_TOAST_DURATION_MS
    if (finalDuration <= 0) {
      return
    }

    const timer = setTimeout(() => {
      originalRemove(id)
      timers.delete(id)
    }, finalDuration + FALLBACK_EXTRA_MS)
    timers.set(id, timer)
  }

  toast.add = ((input: Parameters<typeof toast.add>[0]) => {
    const created = originalAdd(input)
    scheduleFallbackRemove(created.id, created.duration)
    return created
  }) as typeof toast.add

  toast.remove = ((id: ToastId) => {
    clearFallbackTimer(id)
    originalRemove(id)
  }) as typeof toast.remove

  g[TOAST_PATCH_FLAG] = true
})