import React,{useRef} from 'react';
import Layout from '../components/Layout';
import RegistrationForm from '../components/RegistrationForm';

export const Registration = (): JSX.Element => {
  const form = useRef(null);
  const submit = e => {
    const data =[];
    e.preventDefault();
    const form = e.target;
    // eslint-disable-next-line no-console
    for (let i = 0; i < e.target.length-1; i++) {
      data.push(form[i].value);
    }
    JSON.stringify(data);
    console.log(data);
    fetch('/api/registration', { method: 'POST', body: data })
     // .then(res => res.json())
     // .then(json => setUser(json.user))
  }
  return (
    <Layout
      customMeta={{
        title: 'О нас',
      }}
    >
      <h1>РоботТоп</h1>
      <RegistrationForm/>
        <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
            <thead className="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
                <tr>
                    <th scope="col" className="px-6 py-3">
                      Название команды
                    </th>
                    <th scope="col" className="px-6 py-3">
                      Учебное заведение
                    </th>
                    <th scope="col" className="px-6 py-3">
                      ФИО участников
                    </th>
                    <th scope="col" className="px-6 py-3">
                      Класс
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr className="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
                    <th scope="row" className="px-6 py-4 font-medium text-gray-900 dark:text-white whitespace-nowrap">
                        Фиксики
                    </th>
                    <td className="px-6 py-4">
                        МАОУ СОШ 103
                    </td>
                    <td className="px-6 py-4">
                        Иван, Петр, Дмитрий
                    </td>
                    <td className="px-6 py-4">
                        1
                    </td>
                </tr>
            </tbody>
        </table>
    </Layout>
  );
};

export default Registration;
