Form Validation

1import { Timepicker } from "timepicker-ui-react";
2import { useState } from "react";
3
4function App() {
5  const [time, setTime] = useState("");
6  const [error, setError] = useState("");
7
8  const handleSubmit = (e) => {
9    e.preventDefault();
10    
11    if (!time) {
12      setError("Time is required");
13      return;
14    }
15
16    setError("");
17    alert(`Form submitted: ${time}`);
18  };
19
20  return (
21    <form onSubmit={handleSubmit}>
22      <Timepicker
23        value={time}
24        className={error ? "border-red-500" : ""}
25        onUpdate={(data) => {
26          setTime(`${data.hour}:${data.minutes} ${data.type}`);
27          setError("");
28        }}
29      />
30      {error && <p className="text-red-500">{error}</p>}
31      <button type="submit">Submit</button>
32    </form>
33  );
34}