| 1 | "use client"; |
| 2 | |
| 3 | import { useActionState } from "react"; |
| 4 | import { greet } from "../actions.ts"; |
| 5 | |
| 6 | export function GreetingForm() { |
| 7 | const [message, formAction] = useActionState(greet, ""); |
| 8 | return ( |
| 9 | <form action={formAction}> |
| 10 | <input name="name" data-testid="greet-name" /> |
| 11 | <button type="submit" data-testid="greet-submit"> |
| 12 | Greet |
| 13 | </button> |
| 14 | <output data-testid="greet-output">{message}</output> |
| 15 | </form> |
| 16 | ); |
| 17 | } |