import PropTypes from 'prop-types'
import { Badge, Flex, Tag } from 'antd'
import { useMemo } from 'react'

const StateTag = ({ state, showBadge = true, showTag = true, style = {} }) => {
  const { badgeStatus, badgeText } = useMemo(() => {
    let status = 'default'
    let text = 'Unknown'

    switch (state) {
      case 'online':
        status = 'success'
        text = 'Online'
        break
      case 'standby':
        status = 'success'
        text = 'Standby'
        break
      case 'complete':
        status = 'success'
        text = 'Complete'
        break
      case 'offline':
        status = 'default'
        text = 'Offline'
        break
      case 'shutdown':
        status = 'default'
        text = 'Shutdown'
        break
      case 'initializing':
        status = 'warning'
        text = 'Initializing'
        break
      case 'connecting':
        status = 'warning'
        text = 'Connecting'
        break
      case 'deploying':
        status = 'warning'
        text = 'Deploying'
        break
      case 'printing':
        status = 'processing'
        text = 'Printing'
        break
      case 'paused':
        status = 'warning'
        text = 'Paused'
        break
      case 'cancelled':
        status = 'error'
        text = 'Cancelled'
        break
      case 'loading':
        status = 'processing'
        text = 'Uploading'
        break
      case 'processing':
        status = 'processing'
        text = 'Processing'
        break
      case 'ready':
        status = 'success'
        text = 'Ready'
        break
      case 'new':
        status = 'success'
        text = 'New'
        break
      case 'error':
        status = 'error'
        text = 'Error'
        break
      case 'startup':
        status = 'warning'
        text = 'Startup'
        break
      case 'draft':
        status = 'default'
        text = 'Draft'
        break
      case 'active':
        status = 'success'
        text = 'Active'
        break
      case 'inactive':
        status = 'default'
        text = 'Inactive'
        break
      case 'deleted':
        status = 'error'
        text = 'Deleted'
        break
      case 'suspended':
        status = 'warning'
        text = 'Suspended'
        break
      case 'syncing':
        status = 'processing'
        text = 'Syncing'
        break
      case 'disconnected':
        status = 'default'
        text = 'Disconnected'
        break
      case 'failed':
        status = 'error'
        text = 'Failed'
        break
      case 'queued':
        status = 'warning'
        text = 'Queued'
        break
      case 'used':
        status = 'warning'
        text = 'Used'
        break
      case 'unconsumed':
        status = 'success'
        text = 'Unconsumed'
        break
      case 'sent':
        status = 'cyan'
        text = 'Sent'
        break
      case 'acknowledged':
        status = 'purple'
        text = 'Acknowledged'
        break
      case 'confirmed':
        status = 'purple'
        text = 'Confirmed'
        break
      case 'ordered':
        status = 'cyan'
        text = 'Ordered'
        break
      case 'posted':
        status = 'magenta'
        text = 'Posted'
        break
      case 'authorised':
        status = 'success'
        text = 'Authorised'
        break
      case 'declined':
        status = 'error'
        text = 'Declined'
        break
      case 'received':
        status = 'success'
        text = 'Received'
        break
      case 'invoiced':
        status = 'warning'
        text = 'Invoiced'
        break
      case 'planned':
        status = 'warning'
        text = 'Planned'
        break
      case 'partiallyShipped':
        status = 'processing'
        text = 'Partially Shipped'
        break
      case 'shipped':
        status = 'processing'
        text = 'Shipped'
        break
      case 'delivered':
        status = 'success'
        text = 'Delivered'
        break
      case 'paid':
        status = 'success'
        text = 'Paid'
        break
      default:
        status = 'default'
        text = state || 'Unknown'
    }

    return { badgeStatus: status, badgeText: text }
  }, [state])

  var badgeProps = {
    status: badgeStatus
  }

  if (
    !['success', 'warning', 'error', 'processing', 'default'].includes(
      badgeStatus
    )
  ) {
    badgeProps = { color: badgeStatus }
  }

  if (showTag == false) {
    return <Badge {...badgeProps} style={{ ...style }} />
  }

  return (
    <Tag color={badgeStatus} style={{ marginRight: 0, ...style }}>
      <Flex gap={6}>
        {showBadge && <Badge {...badgeProps} />}
        {badgeText}
      </Flex>
    </Tag>
  )
}

StateTag.propTypes = {
  state: PropTypes.string,
  showBadge: PropTypes.bool,
  style: PropTypes.object,
  showTag: PropTypes.bool
}

export default StateTag
