import React from 'react'
import { Col, Row } from 'reactstrap';
import { FakeSelectData } from '../../Layout/app/Const';
import { useFormikContext } from 'formik';

import { DatePicker } from 'antd';
import ValidationField from '../../Components/ValidationField/ValidationField';

function FormContact() {
  const formik = useFormikContext<any>();


  const directionArray = [
    { direction: "ltr", value: true },
    { direction: "rtl", value: false },
  ];

  const directionOptions = directionArray?.map((e: any) => ({
    label: e?.direction,
    value: e?.value
  }))

  return (
    <Row xs={1} sm={1} md={1} lg={2} xl={2}>
      <Col>
        {/* name from form utils */}
        <ValidationField name="title" type="text" label='title' placeholder='placeholder' />
        <ValidationField name="sub_title" type="text" label='sub_title' placeholder='placeholder' />
        <ValidationField name="description" type="text" label='description' placeholder='placeholder' />
      </Col>
      <Col>
        <ValidationField name="direction" option={directionOptions || []} type="Select" label='direction' placeholder='placeholder' />
        <ValidationField name="is_have_button" type="Checkbox" label='Have button' placeholder='placeholder' />
        <ValidationField name="image" type="File" label='image' placeholder='placeholder' />

      </Col>


    </Row>
  )
}

export default FormContact