src/components/actiontest.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

"use client";

import { testFn, testLogin } from "@/actions/test";
import { useActionState, useState } from "react";

export default function TestForm() {
  const [state, formAction, isPending] = useActionState<number, FormData>(
    testLogin,
    0,
  );
  return (
    <form action={formAction}>
      <p>State: {state}</p>
      <label>
        Username
        <input type="text" placeholder="shadcn" name="username" />
      </label>
      <label className="flex justify-between">
        <span>Password</span>
        <input type="password" placeholder="..." name="password" />
      </label>
      <button type="submit" className="w-full">
        Login
      </button>
    </form>
  );
}