1import { fetchCuple } from "@cuple/client";
2import { useAction } from "@cuple/react";
3import { useState } from "react";
4import { client } from "./cuple";
5
6export function App() {
7 const [name, setName] = useState("");
8 const greet = useAction(() =>
9 fetchCuple(client.sayHi.get, {}),
10 );
11
12 return (
13 <form
14 onSubmit={(e) => {
15 e.preventDefault();
16 greet.run();
17 }}
18 >
19 <h1>{greet.value?.message}</h1>
20 <input
21 value={name}
22 onChange={(e) => setName(e.target.value)}
23 />
24 <button disabled={greet.isPending}>Welcome</button>
25 </form>
26 );
27}
28