"use client"

import { createContext, useContext, useState, ReactNode } from "react"

type FlashMessageType = "success" | "warning" | "info"

interface FlashMessage {
  text: string
  type: FlashMessageType
}

interface FlashMessageContextType {
  showFlashMessage: (text: string, type?: FlashMessageType) => void
}

const FlashMessageContext = createContext<FlashMessageContextType | undefined>(undefined)

// -------------------------------------------------------------- داخل لایو اصلی رندر می شود
export function FlashMessageProvider({ children }: { children: ReactNode }) {
  const [message, setMessage] = useState<FlashMessage | null>(null)
  const [visible, setVisible] = useState(false)

  const showFlashMessage = (text: string, type: FlashMessageType = "info") => {
    setMessage({ text, type })
    setVisible(true)
    setTimeout(() => setVisible(false), 3000)
  }

  let messageColor = "bg-blue-200"
  if (message?.type === "success") messageColor = "bg-green-200"
  if (message?.type === "warning") messageColor = "bg-red-200"

  return (
    <FlashMessageContext.Provider value={{ showFlashMessage }}>
      {children}
      {message && (
        <div
          className={`fixed bottom-4 right-4 px-4 py-2 ${messageColor} rounded-md shadow-sm transition-all duration-500 ease-in-out
            ${visible ? "opacity-100 scale-100" : "opacity-0 scale-95"}`}
        >
          {message.text}
        </div>
      )}
    </FlashMessageContext.Provider>
  )
}

// -------------------------------------------------------------- جایی که پیام نمایش داده می شود استفاده می شود
// هوک سفارشی برای استفاده راحت‌تر از کانتکست احراز هویت
export function useFlashMessage() {
  const context = useContext(FlashMessageContext)
  if (!context) throw new Error("useFlashMessage باید داخل FlashMessageProvider استفاده بشه")
  return context
}