import React from "react";
import AlarmIcon from "@/components/icons/material-symbols/AlarmIcon";
import Tooltip from "@mui/material/Tooltip";

/**
 * AlarmIndicator zeigt ein Alarm-Icon, das bei Klick den AlarmLink in neuem Tab öffnet.
 * @param {boolean} hasAlarm - Ob ein Alarm aktiv ist
 * @param {string} alarmLink - Link zur Alarm-Detailseite
 * @param {string} [alarmText] - Optionaler Tooltip-Text
 */
const AlarmIndicator = ({ hasAlarm, alarmLink, alarmText }) => {
  if (!hasAlarm || !alarmLink) return null;
  return (
    <Tooltip title={alarmText || "Alarm aktiv"}>
      <span
        style={{ cursor: "pointer", color: "red" }}
        onClick={e => {
          e.stopPropagation();
          window.open(alarmLink, "_blank");
        }}
        aria-label="Alarm aktiv"
      >
        <AlarmIcon className="h-8 w-8 animate-pulse text-red-500" />
      </span>
    </Tooltip>
  );
};

export default AlarmIndicator;