import { Col, Row } from "reactstrap";
import ValidationField from "../../../Components/ValidationField/ValidationField";
import { translateAbilities } from "../../../utils/translateAbilities";
import { useGetAllAbility } from "../../../api/ability";
import { useTranslation } from "react-i18next";
const Form = () => {
  const { data } = useGetAllAbility();
  const [t] = useTranslation();
  const abilities = translateAbilities(data?.data, t);
  return (
    <Row className="w-100">
      <Col>
        <ValidationField placeholder="name" label="name" name="name" />
      </Col>
      <Col>
        <ValidationField
          placeholder="abilities"
          label="abilities"
          name="abilities"
          type="LocalSearch"
          option={abilities}
          isMulti
        />
      </Col>
    </Row>
  );
};

export default Form;
