import { Form, redirect } from 'react-router-dom';

function NewPost() {
  return (
    <Form method="post" id="post-form">
      <p>
        <label htmlFor="title">Tytuł</label>
        <input type="text" id="title" name="title" />
      </p>
      <p>
        <label htmlFor="text">Tekst</label>
        <textarea id="text" name="text" rows={3} />
      </p>
      <button>Zapisz artykuł</button>
    </Form>
  );
}

export default NewPost;

export async function action({ request }) {
  const formData = await request.formData();
  const postData = Object.fromEntries(formData);
  await fetch('https://jsonplaceholder.typicode.com/posts', {
    method: 'POST',
    body: JSON.stringify(postData),
    headers: { 'Content-Type': 'application/json' },
  });
  return redirect('/posts');
}
