pro/src/components/status/Status.tsx

import { Tag, TagProps } from 'antd'
import { useTranslation } from '@/i18n.ts'
import { SyncOutlined } from '@ant-design/icons'

export interface StatusProps extends TagProps {
  status: string
}


const getColor = (status: string) => {
  if (status.includes('error') || status.includes('err')) {
    return 'danger'
  }
  switch (status) {
    case 'running':
      return 'success'
    case 'stopped':
      return 'danger'
    case 'unhealthy':
    case 'paused':
    case 'exited':
    case 'dead':
    case 'removing':
      return 'warning'
    default:
      return 'default'
  }
}

const loadingStatus = [
  'installing',
  'building',
  'restarting',
  'upgrading',
  'rebuilding',
  'recreating',
  'creating',
  'starting',
  'removing',
  'applying',
]

const loadingIcon = (status: string): boolean => {
  return loadingStatus.indexOf(status) > -1
}
export const Status = ({ status = 'running', ...props }: StatusProps) => {

  const { t } = useTranslation()
  const icon = loadingIcon(status) ? <SyncOutlined spin/> : null
  return (
    <>
      <Tag {...props}
           color={getColor(status)}
           icon={icon}>{t(`status.${status}`, status)}</Tag>
    </>
  )
}

export default Status