tRPC API-Schicht

Der Router in packages/api/trpc/router.ts enthält die Bereiche auth, billing, team, notifications, ai, uploads, feedback, changelog und admin. ApiInput und ApiOutput liefern die abgeleiteten Eingabe- und Ergebnistypen.

Prozedur ergänzen

Nutzen Sie die Guards aus packages/api/trpc/base.ts: publicProcedure erlaubt öffentliche Zugriffe, protectedProcedure verlangt eine Anmeldung und adminProcedure zusätzlich die Rolle admin. Teamdaten brauchen außerdem eine Mitgliedschafts- oder Eigentümerprüfung über ctx.abilities.

Beispiel für packages/api/modules/auth/procedures/update-display-name.ts:

import { db } from "database";
import { z } from "zod";
import { protectedProcedure } from "../../../trpc/base";

export const updateDisplayName = protectedProcedure
  .input(z.object({ name: z.string().min(1) }))
  .mutation(({ input, ctx }) =>
    db.user.update({
      where: { id: ctx.user.id },
      data: { name: input.name },
      select: { id: true, name: true },
    }),
  );

Exportieren Sie die Prozedur aus der dortigen index.ts, damit der Router sie registriert. Importieren Sie db aus database; ctx.db existiert nicht.

Vorhandene Prozedur aufrufen

Clientkomponenten nutzen den vorhandenen Provider und Client:

"use client";

import { apiClient } from "@shared/lib/api-client";

export function UpdateNameButton() {
  const update = apiClient.auth.update.useMutation();
  return (
    <button onClick={() => update.mutate({ name: "Alex" })}>
      Namen ändern
    </button>
  );
}

Produktformulare brauchen Lade- und Fehlerzustände, übersetzte Beschriftungen und eine Aktualisierung betroffener Benutzerdaten, wie die vorhandenen Einstellungsformulare. Serverzugriffe verwenden den Caller in packages/api/trpc/caller.ts.

Weiterlesen: Routing & Seiten.