web/packages/design-system/lib/components/Alert/utils.tsx

import {
  MaterialIcon,
  type MaterialIconSetIconProps,
} from '../Icons/MaterialIcon'
import { AlertTypeEnum } from '@scandic-hotels/common/constants/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}
        />
      )
  }
}