import React, { useState, useEffect } from "react";
import { Button } from "@/components/ui/button";
import { Download } from "lucide-react";
import {
  Tooltip,
  TooltipContent,
  TooltipProvider,
  TooltipTrigger,
} from "@/components/ui/tooltip";
import { getDictionary } from "@/lib/dictionary";
import { useLocale } from "@/hooks/useLocale";
import type { Messages } from "@/types/messages";

interface FileTransferButtonProps {
  onRequest: () => void;
  onSave?: () => void; // 新增：处理手动保存
  isCurrentFileTransferring: boolean;
  isOtherFileTransferring: boolean;
  isSavedToDisk: boolean;
  isPendingSave?: boolean; // 新增：是否待保存状态
}
// Manage buttons for different download statuses
const FileTransferButton = ({
  onRequest,
  onSave,
  isCurrentFileTransferring,
  isOtherFileTransferring,
  isSavedToDisk,
  isPendingSave = false,
}: FileTransferButtonProps) => {
  const locale = useLocale();
  const [messages, setMessages] = useState<Messages | null>(null);
  // Button status judgment - 待保存状态时按钮应该可点击
  const isDisabled =
    isCurrentFileTransferring ||
    isSavedToDisk ||
    (isOtherFileTransferring && !isPendingSave);

  useEffect(() => {
    getDictionary(locale)
      .then((dict) => setMessages(dict))
      .catch((error) => console.error("Failed to load messages:", error));
  }, [locale]);
  // Display different tooltips based on status
  const getTooltipContent = () => {
    if (isSavedToDisk)
      return messages!.text.FileTransferButton.SavedToDisk_tips;
    if (isCurrentFileTransferring)
      return messages!.text.FileTransferButton.CurrentFileTransferring_tips;
    if (isPendingSave)
      return messages!.text.FileTransferButton.PendingSave_tips;
    if (isOtherFileTransferring)
      return messages!.text.FileTransferButton.OtherFileTransferring_tips;
    return messages!.text.FileTransferButton.download_tips;
  };

  // Set different button styles and class names based on status
  const getButtonStyles = () => {
    if (isSavedToDisk) {
      return {
        variant: "ghost" as const,
        className: "mr-2 text-gray-500",
      };
    }
    if (isCurrentFileTransferring) {
      return {
        variant: "outline" as const,
        className: "mr-2 cursor-not-allowed",
      };
    }
    if (isPendingSave) {
      return {
        variant: "default" as const, // 使用更明显的样式
        className: "mr-2 bg-green-600 hover:bg-green-700 text-white",
      };
    }
    if (isOtherFileTransferring) {
      return {
        variant: "outline" as const,
        className:
          "mr-2 cursor-not-allowed bg-gray-100 border-gray-300 text-gray-500",
      };
    }
    return {
      variant: "outline" as const,
      className: "mr-2 hover:bg-blue-50",
    };
  };

  const buttonStyles = getButtonStyles();
  if (messages === null) {
    return <div>Loading...</div>;
  }
  return (
    <TooltipProvider delayDuration={100}>
      <Tooltip>
        <TooltipTrigger asChild>
          <span className="inline-block">
            <Button
              onClick={isPendingSave && onSave ? onSave : onRequest}
              variant={buttonStyles.variant}
              size="sm"
              className={buttonStyles.className}
              disabled={isDisabled}
            >
              <Download
                className={`mr-2 h-4 w-4 ${
                  isOtherFileTransferring && !isPendingSave ? "opacity-50" : ""
                }`}
              />
              {isSavedToDisk
                ? messages.text.FileTransferButton.Saved_dis
                : isPendingSave
                ? messages.text.FileTransferButton.Save_dis
                : isOtherFileTransferring
                ? messages.text.FileTransferButton.Waiting_dis
                : messages.text.FileTransferButton.Download_dis}
            </Button>
          </span>
        </TooltipTrigger>
        <TooltipContent
          side="top"
          className="bg-gray-800 text-white px-3 py-2 rounded-md text-sm"
        >
          {getTooltipContent()}
        </TooltipContent>
      </Tooltip>
    </TooltipProvider>
  );
};

export default FileTransferButton;
