Skip to content
This repository has been archived by the owner on Sep 27, 2023. It is now read-only.

Latest commit

 

History

History
69 lines (55 loc) · 1.54 KB

README.md

File metadata and controls

69 lines (55 loc) · 1.54 KB

Zact - Zod Server ACTions

DEPRECATED

I don't plan to support this. next-safe-action is better and well maintained, credits to @TheEdoRan for building it 🙏

LEGACY

We like NextJS Server Actions. We wanted to love them. This package makes them validated and typesafe, so you can use them in things that aren't forms.

npm install zact

Backend

// action.ts
"use server";

import { z } from "zod";
import { zact } from "zact/server";
export const validatedAction = zact(z.object({ stuff: z.string().min(6) }))(
  async (input) => {
    return { message: `hello ${input.stuff}` };
  }
);

Client WITH custom hook

// component.tsx
"use client";

import { validatedAction } from "./action";
import { useZact } from "zact/client";

export const zactTestComponent = () => {
  const { mutate, data, isRunning } = useZact(validatedAction);

  return (
    <div>
      <button onClick={() => mutate({ stuff: "testtestaet" })}>
        Run server action
      </button>
      {isRunning && <div>Loading...</div>}
      {data?.message}
    </div>
  );
};

Client WITHOUT custom hook

Yes you can just import them and call them like promises too

// component.tsx
"use client";

import { validatedAction } from "./action";

export const zactTestComponent = () => {
  return (
    <div>
      <button onClick={() => {
        validatedAction({ stuff: "test" }).then((response) => console.log("response!", response));
      }>
        Run server action
      </button>
    </div>
  );
};