import React from 'react';
import { FormBuilder } from '@savedo/re-form';

const MyForm = ({ handleSubmit }) => {
  const fields = [
    'name',
    'age',
    'email'
  ];

  const fieldOptions = {
    name: {
      label: 'Name:'
    },
    age: {
      label: 'Age:',
      type: 'number'
    },
    email: {
      label: 'E-mail:'
    }
  };

  const validate = (formData) => {
    const errors = {};
    const { name, age } = formData;

    if (!name) {
      errors.name = 'Name is required!';
    }
    if (!age) {
      errors.age = 'Age is required!';
    } else if (Number(age) < 18) {
      errors.age = 'You should be 18 years old or older!';
    }

    return errors;
  };

  return (
    <div>
      <FormBuilder { ...{ fields, fieldOptions, handleSubmit, validate } } />
    </div>
  );
};

export default MyForm;

import React from 'react';
import MyForm from './MyForm';

const App = () => {
  const handleSubmit = (formData) => {
    console.log(formData)
  };

  return (
    <MyForm handleSubmit={ handleSubmit } />
  );
};

export default App;