const KabelModulStatus: React.FC<KabelModulStatusProps> = ({
  slot,
  kueCableBreak,
  kueAlarm1,
  kueAlarm2,
  kueGroundFault,
  isOnline,
  moduleVersion,
}) => {
  if (!isOnline) {
    return (
      <div className="border border-gray-400 w-10 h-20 flex items-center justify-center bg-gray-200">
        <div className="text-xs text-gray-500">Leer</div>
      </div>
    );
  }

  // Modultyp basierend auf der Version bestimmen
  let moduleName = "";
  let moduleType = "";

  if (moduleVersion === 419) {
    moduleName = "KÜ705";
    moduleType = "FO";
  } else if (moduleVersion === 350) {
    moduleName = "KÜ605";
    moduleType = "µC";
  } else if (moduleVersion === 1100) {
    moduleName = "KÜSS";
    moduleType = "___";
  }

  // Status nur prüfen, wenn der Slot aktiv ist (kueOnline für den Slot ist 1)
  const isCableBreak = kueCableBreak[slot - 1] === 1;
  const isAlarm1 = kueAlarm1[slot - 1] === 1;
  const isAlarm2 = kueAlarm2[slot - 1] === 1;
  const groundFault = kueGroundFault[slot - 1] === 1;

  return (
    <div className="border border-gray-400 w-10 h-20 flex flex-col scale-100 xl:scale-90">
      <div className="bg-littwin-blue flex-grow flex flex-col items-center justify-center text-white text-[10px]">
        <div className="flex w-full mb-1 items-start justify-start">{slot}</div>
        <div className="text-[10px]">{moduleName}</div>
        <div className="text-[10px]">{moduleType}</div>
      </div>
      <div
        className={`w-full h-2/6 ${
          isCableBreak || isAlarm1 || isAlarm2 || groundFault
            ? "bg-red-500"
            : "bg-green-500"
        }`}
      ></div>
      <div className="bg-littwin-blue w-full h-1/6"></div>
    </div>
  );
};

export default KabelModulStatus;

interface KabelModulStatusProps {
  slot: number;
  kueCableBreak: number[];
  kueAlarm1: number[];
  kueAlarm2: number[];
  kueGroundFault: number[];
  isOnline: boolean;
  moduleVersion: number;
}