web/apps/scandic-web/components/TempDesignSystem/Alert/utils.tsx

import {
  MaterialIcon,
  type MaterialIconSetIconProps,
} from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { AlertTypeEnum } from "@scandic-hotels/trpc/types/alert"

import type { JSX } from "react"

import type { AlertProps } from "./alert"

interface IconByAlertProps {
  alertType: AlertTypeEnum
  variant?: AlertProps["variant"]
}

export function IconByAlertType({
  alertType,
  variant = "inline",
  ...props
}: IconByAlertProps & MaterialIconSetIconProps): JSX.Element {
  switch (alertType) {
    case AlertTypeEnum.Alarm:
      return (
        <MaterialIcon
          color={variant === "inline" ? "Icon/Inverted" : "Icon/Feedback/Error"}
          isFilled
          icon="error"
          {...props}
        />
      )
    case AlertTypeEnum.Warning:
      return (
        <MaterialIcon
          icon="warning"
          color={
            variant === "inline" ? "Icon/Inverted" : "Icon/Feedback/Warning"
          }
          isFilled
          {...props}
        />
      )
    case AlertTypeEnum.Success:
      return (
        <MaterialIcon
          icon="check_circle"
          color={
            variant === "inline" ? "Icon/Inverted" : "Icon/Feedback/Success"
          }
          isFilled
          {...props}
        />
      )
    case AlertTypeEnum.Info:
    default:
      return (
        <MaterialIcon
          color={
            variant === "inline" ? "Icon/Inverted" : "Icon/Feedback/Information"
          }
          isFilled
          icon="info"
          {...props}
        />
      )
  }
}