import React, { useState } from "react";

function TodoForm({ addTodo }) {
  const [input, setInput] = useState("");

  function handleSubmit(event) {
    event.preventDefault();
    letid = Math.floor(Math.random() * 15000);

    if (input.trim()) {
      addTodo({ id, task: input });
      setInput("");
    }
  }

  return (
    <div>
      <form onSubmit={handleSubmit}>
        <header>What do you have to do today?</header>
        <input
          type="text"
          placeholder="Add a task to your list"
          value={input}
          onChange={(e) => setInput(e.target.value)}
        ></input>
        <button type="button" value="Submit" onClick={handleSubmit}>
          Add task
        </button>
      </form>
    </div>
  );
}

export default TodoForm;