import { Toast as ToastPrimitive } from '@base-ui/react/toast'
import { CircleCheck, Info, Loader2, OctagonX, TriangleAlert, X } from 'lucide-react'
import { toast } from '@/lib/notifications'
import './toast.css'

export { toast, settingsSaved } from '@/lib/notifications'

const icons = { success: CircleCheck, info: Info, warning: TriangleAlert, error: OctagonX, loading: Loader2 }

function ToastList() {
  const { toasts } = ToastPrimitive.useToastManager()
  return toasts.map(item => {
    const Icon = icons[item.type as keyof typeof icons]
    return (
      <ToastPrimitive.Root key={item.id} toast={item} swipeDirection={['up', 'left', 'right']} className="swift-commerce-dashboard-toast" data-slot="toast">
        <ToastPrimitive.Content className="swift-commerce-dashboard-toast-content">
          {Icon && <Icon aria-hidden="true" className={item.type === 'loading' ? 'swift-commerce-dashboard-toast-icon animate-spin' : 'swift-commerce-dashboard-toast-icon'} />}
          <div className="swift-commerce-dashboard-toast-message">
            <ToastPrimitive.Title className="swift-commerce-dashboard-toast-title" />
            {item.description && <ToastPrimitive.Description className="swift-commerce-dashboard-toast-description" />}
          </div>
          {item.actionProps && <ToastPrimitive.Action className="swift-commerce-dashboard-toast-action" />}
          <ToastPrimitive.Close aria-label="Dismiss notification" className="swift-commerce-dashboard-toast-close"><X aria-hidden="true" /></ToastPrimitive.Close>
        </ToastPrimitive.Content>
      </ToastPrimitive.Root>
    )
  })
}

// shadcn Base UI Toast composition; scoped styles support the dashboard's Tailwind 3 build.
export function Toaster() {
  return (
    <ToastPrimitive.Provider toastManager={toast} timeout={5000} limit={3}>
      <ToastPrimitive.Portal>
        <ToastPrimitive.Viewport className="swift-commerce-dashboard-toast-viewport" aria-label="Notifications">
          <ToastList />
        </ToastPrimitive.Viewport>
      </ToastPrimitive.Portal>
    </ToastPrimitive.Provider>
  )
}