import { DatePicker, Form, FormInstance, Input } from 'antd'
import TextArea from 'antd/lib/input/TextArea'
import moment from 'moment'
import { useParams } from 'react-router-dom'

export type UpdateNgComponentImage = {
  cluster_type: string
  version: string
  component_name: string
  image_base: string
  image_tag: string
}

export default function UpdateNgComponentImageForm({
  form
}: {
  form: FormInstance
}) {
  return (
    <>
      <Form.Item label="Cluster Type" name="cluster_type">
        <Input
          type="text"
          disabled={true}
          bordered={false}
          style={{ color: 'black' }}
        ></Input>
      </Form.Item>
      <Form.Item label="Version" name="version">
        <Input
          type="text"
          disabled={true}
          bordered={false}
          style={{ color: 'black' }}
        ></Input>
      </Form.Item>
      <Form.Item label="Component Name" name="component_name">
        <Input
          type="text"
          disabled={true}
          bordered={false}
          style={{ color: 'black' }}
        ></Input>
      </Form.Item>
      <Form.Item label="Image Base" name="image_base">
        <Input
          type="text"
          disabled={true}
          bordered={false}
          style={{ color: 'black' }}
        ></Input>
      </Form.Item>
      <Form.Item label="Image Tag" name="image_tag">
        <Input></Input>
      </Form.Item>
    </>
  )
}

function isNumberString(str: string): boolean {
  const regex = /^[0-9]+$/
  return regex.test(str)
}