import { PropertyCard } from '@tidbcloud/uikit/biz'

import { getConnectionMethodDisplayName } from 'dbaas/features/Changefeed/connection'
import { PulsarAuthTypeOptions, PulsarCompressionOptions } from 'dbaas/features/Changefeed/constants'
import { DataflowConnector } from 'dbaas/services/dataflow/interface'

import { DataFormatProperties } from './DataFormatProperties'
import { StartPositionProperty } from './StartPositionDisplay'
import { TableConfigProperties } from './TableFilterProperties'
import { TopicDistributionProperties } from './TopicDistributionProperties'

interface PulsarPropertiesProps {
  data: DataflowConnector
}

export const PulsarProperties = ({ data }: PulsarPropertiesProps) => {
  const networkType = data.request?.network_info?.network_type

  return (
    <>
      <PropertyCard.Divider />

      <PropertyCard.Item label="Connection Method">{getConnectionMethodDisplayName(networkType!)}</PropertyCard.Item>
      <PropertyCard.Item label="Broker Endpoint">{data.request?.pulsar_info?.endpoint || '-'}</PropertyCard.Item>
      <PropertyCard.Item label="Authentication">
        {PulsarAuthTypeOptions.find((i) => i.value === data.request?.pulsar_info?.authentication?.auth_type)?.label ||
          '-'}
      </PropertyCard.Item>

      {data.request?.pulsar_info?.authentication?.user_name && (
        <PropertyCard.Item label="User Name">{data.request?.pulsar_info?.authentication?.user_name}</PropertyCard.Item>
      )}

      <PropertyCard.Item label="Compression">
        {PulsarCompressionOptions.find((i) => i.value === data.request?.pulsar_info?.compression_type)?.label || '-'}
      </PropertyCard.Item>

      <PropertyCard.Divider />

      <TableConfigProperties data={data.request?.pulsar_info?.table_config} />
      <StartPositionProperty data={data.request?.pulsar_info?.start_position} />
      <DataFormatProperties data={data.request?.pulsar_info?.data_format} />

      <TopicDistributionProperties data={data.request?.pulsar_info?.topic_distribution} />

      <PropertyCard.Item label="Pulsar Tenant">
        {data.request?.pulsar_info?.topic_distribution?.pulsar_tenant || '-'}
      </PropertyCard.Item>

      <PropertyCard.Item label="Pulsar Namespace">
        {data.request?.pulsar_info?.topic_distribution?.pulsar_namespace || '-'}
      </PropertyCard.Item>
    </>
  )
}