create-fate 1.0.3 → 1.3.0

package/templates/fate/graphql/client/vite.config.ts

@@ -0,0 +1,40 @@
+import { join } from 'node:path';
+import fbteePreset from '@nkzw/babel-preset-fbtee';
+import babel from '@rolldown/plugin-babel';
+import tailwindcss from '@tailwindcss/vite';
+import { reactCompilerPreset } from '@vitejs/plugin-react';
+import { voidReact } from '@void/react/plugin';
+import dotenv from 'dotenv';
+import { fate } from 'react-fate/vite';
+import { defineConfig, lazyPlugins } from 'vite-plus';
+import { voidPlugin } from 'void';
+
+const root = process.cwd();
+const isDevelopment = process.env.NODE_ENV === 'development' || process.env.DEV;
+
+dotenv.config({
+  path: join(root, '../server', isDevelopment ? '.env' : '.prod.env'),
+  quiet: true,
+});
+
+if (!process.env.VITE_SERVER_URL) {
+  throw new Error(`client-build, vite.config: 'VITE_SERVER_URL' is missing.`);
+}
+
+export default defineConfig({
+  build: { outDir: join(root, '../dist/client') },
+  plugins: [
+    ...(lazyPlugins(() => [
+      babel({
+        presets: [fbteePreset, reactCompilerPreset()],
+      }),
+      tailwindcss(),
+      voidPlugin(),
+      voidReact(),
+    ]) ?? []),
+    fate({
+      module: '@app/server/src/graphql/fate.ts',
+      transport: 'graphql',
+    }),
+  ],
+});

package/templates/fate/graphql/client/void.json

@@ -0,0 +1,29 @@
+{
+  "$schema": "./node_modules/void/schema.json",
+  "target": "node",
+  "head": {
+    "title": "fate",
+    "htmlAttrs": {
+      "lang": "en"
+    },
+    "meta": [
+      {
+        "charset": "utf-8"
+      },
+      {
+        "name": "viewport",
+        "content": "width=device-width, initial-scale=1"
+      },
+      {
+        "name": "theme-color",
+        "content": "#fff"
+      }
+    ],
+    "link": [
+      {
+        "rel": "icon",
+        "href": "/icon.svg"
+      }
+    ]
+  }
+}

package/templates/fate/graphql/docker-compose.yml

@@ -0,0 +1,11 @@
+services:
+  db:
+    image: postgres:17
+    restart: always
+    container_name: fate-db
+    ports:
+      - '5432:5432'
+
+    environment:
+      POSTGRES_USER: fate
+      POSTGRES_PASSWORD: echo

package/templates/fate/graphql/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "fate-app",
+  "version": "0.0.1",
+  "private": true,
+  "description": "fate is a modern data client for React.",
+  "author": "Christoph Nakazawa <christoph.pojer@gmail.com>",
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/nkzw-tech/fate.git"
+  },
+  "type": "module",
+  "scripts": {
+    "build": "dotenv -e server/.env -- vp run --filter '@app/client' --filter '@app/server' build",
+    "dev": "npm-run-all --parallel dev:client dev:server",
+    "dev:client": "cd client && vp dev",
+    "dev:server": "cd server && vp run dev",
+    "dev:setup": "vp run --filter '@app/client' --filter '@app/server' dev:setup && vp run fate:generate",
+    "fate:generate": "vp run --filter '@app/client' fate:generate",
+    "prepare": "vp config",
+    "prisma": "vp run --filter '@app/server' prisma"
+  },
+  "devDependencies": {
+    "@app/server": "workspace:*",
+    "@nkzw/eslint-plugin": "^2.0.0",
+    "@nkzw/oxlint-config": "^1.2.1",
+    "@swc/core": "^1.15.33",
+    "@types/node": "^25.6.0",
+    "@typescript/native-preview": "7.0.0-dev.20260505.1",
+    "babel-plugin-react-compiler": "^1.0.0",
+    "dotenv": "^17.4.2",
+    "dotenv-cli": "^11.0.0",
+    "eslint-plugin-no-only-tests": "^3.4.0",
+    "eslint-plugin-perfectionist": "^5.9.0",
+    "eslint-plugin-react-hooks": "^7.1.1",
+    "npm-run-all2": "^8.0.4",
+    "prisma": "^7.8.0",
+    "ts-node": "^10.9.2",
+    "vite": "catalog:",
+    "vite-plus": "catalog:",
+    "vitest": "catalog:"
+  },
+  "engines": {
+    "node": ">=24.0.0",
+    "pnpm": ">=11.0.0"
+  },
+  "packageManager": "pnpm@11.0.6"
+}

package/templates/fate/graphql/pnpm-workspace.yaml

@@ -0,0 +1,45 @@
+packages:
+  - client
+  - server
+
+allowBuilds:
+  '@prisma/engines': true
+  '@swc/core': true
+  better-sqlite3: true
+  esbuild: true
+  prisma: true
+  sharp: true
+  workerd: true
+
+catalog:
+  vite: npm:@voidzero-dev/vite-plus-core@^0.1.23
+  vite-plus: ^0.1.23
+  vitest: npm:@voidzero-dev/vite-plus-test@^0.1.23
+
+minimumReleaseAgeExclude:
+  - '@voidzero-dev/vite-plus-core'
+  - '@voidzero-dev/vite-plus-test'
+  - vite-plus
+
+onlyBuiltDependencies:
+  - '@prisma/client'
+  - '@prisma/engines'
+  - '@swc/core'
+  - '@tailwindcss/oxide'
+  - esbuild
+  - msgpackr-extract
+  - prisma
+  - unrs-resolver
+
+overrides:
+  kysely: 0.28.17
+  vite: 'catalog:'
+  vitest: 'catalog:'
+
+peerDependencyRules:
+  allowAny:
+    - vite
+    - vitest
+  allowedVersions:
+    vite: '*'
+    vitest: '*'

package/templates/fate/graphql/server/.env.example

@@ -0,0 +1,5 @@
+BETTER_AUTH_SECRET="local-template-development-secret-with-enough-entropy"
+BETTER_AUTH_URL="http://localhost:9000"
+CLIENT_DOMAIN="http://localhost:5173"
+DATABASE_URL="postgresql://fate:echo@localhost:5432/fate"
+VITE_SERVER_URL="http://localhost:9000"

package/templates/fate/graphql/server/README.md

@@ -0,0 +1,27 @@
+# Fate GraphQL Example
+
+This server uses Pothos to expose a GraphQL API backed by Prisma.
+It exposes Relay `node`/`nodes`, Relay connections for Fate list fields, GraphQL mutations
+for the existing Fate mutations, and GraphQL SSE subscriptions for Fate live updates.
+
+Run it from this directory:
+
+```sh
+vp run dev:setup
+vp run prisma migrate dev
+vp run dev
+```
+
+The server defaults to `http://localhost:9000/graphql`.
+
+To generate the Fate client against this server, point the Vite plugin at:
+
+```ts
+fate({
+  module: '@app/server/src/graphql/fate.ts',
+  transport: 'graphql',
+});
+```
+
+The generated client keeps the same Fate roots, views, mutations, store, and cache behavior;
+only the transport and server module change.

package/templates/fate/graphql/server/package.json

@@ -0,0 +1,64 @@
+{
+  "name": "@app/server",
+  "version": "0.0.1",
+  "private": true,
+  "author": "Christoph Nakazawa <christoph.pojer@gmail.com>",
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/nkzw-tech/fate.git"
+  },
+  "type": "module",
+  "scripts": {
+    "build": "vp pack",
+    "dev": "NODE_ENV=development node_modules/.bin/nodemon -q -I --exec node --no-warnings --experimental-specifier-resolution=node --loader ts-node/esm --env-file .env src/index.tsx",
+    "dev:setup": "pnpm prisma generate && pnpm generate-graphql",
+    "generate-graphql": "node --no-warnings --experimental-specifier-resolution=node --loader ts-node/esm ./scripts/generate-graphql.tsx",
+    "prisma": "prisma"
+  },
+  "dependencies": {
+    "@graphql-tools/utils": "^11.1.0",
+    "@graphql-yoga/plugin-graphql-sse": "^3.21.0",
+    "@hono/node-server": "^2.0.1",
+    "@nkzw/core": "^1.3.1",
+    "@nkzw/define-env": "^1.1.0",
+    "@nkzw/fate": "latest",
+    "@pothos/core": "^4.12.0",
+    "@pothos/plugin-complexity": "^4.1.2",
+    "@pothos/plugin-directives": "^4.3.0",
+    "@pothos/plugin-prisma": "^4.14.3",
+    "@pothos/plugin-relay": "^4.7.0",
+    "@pothos/plugin-scope-auth": "^4.1.6",
+    "@prisma/adapter-pg": "^7.8.0",
+    "@prisma/client": "^7.8.0",
+    "better-auth": "^1.6.9",
+    "graphql": "^16.13.2",
+    "graphql-yoga": "^5.21.0",
+    "hono": "^4.12.17"
+  },
+  "devDependencies": {
+    "@nkzw/eslint-plugin": "^2.0.0",
+    "@nkzw/oxlint-config": "^1.2.1",
+    "@swc/core": "^1.15.33",
+    "@types/node": "^25.6.0",
+    "@typescript/native-preview": "7.0.0-dev.20260505.1",
+    "dotenv": "^17.4.2",
+    "eslint-plugin-no-only-tests": "^3.4.0",
+    "eslint-plugin-perfectionist": "^5.9.0",
+    "eslint-plugin-react-hooks": "^7.1.1",
+    "glob": "^13.0.6",
+    "nodemon": "^3.1.14",
+    "oxfmt": "^0.48.0",
+    "prisma": "^7.8.0",
+    "prisma-json-types-generator": "^5.0.0",
+    "ts-node": "^10.9.2",
+    "typescript": "^6.0.3",
+    "vite-plus": "catalog:",
+    "vitest": "catalog:"
+  },
+  "nodemonConfig": {
+    "ext": "tsx",
+    "watch": [
+      "src/"
+    ]
+  }
+}

package/templates/fate/graphql/server/prisma.config.ts

@@ -0,0 +1,17 @@
+import { join } from 'node:path';
+import dotenv from 'dotenv';
+import { defineConfig } from 'prisma/config';
+
+const root = process.cwd();
+
+dotenv.config({
+  path: join(root, '.env'),
+  quiet: true,
+});
+
+export default defineConfig({
+  migrations: {
+    seed: `node --no-warnings --experimental-specifier-resolution=node --loader ts-node/esm --env-file .env src/prisma/seed.tsx`,
+  },
+  schema: './src/prisma/schema.prisma',
+});

package/templates/fate/graphql/server/scripts/generate-graphql.tsx

@@ -0,0 +1,40 @@
+#!/usr/bin/env node --no-warnings --experimental-specifier-resolution=node --loader ts-node/esm
+import { createHash } from 'node:crypto';
+import { writeFileSync } from 'node:fs';
+import { join, posix, relative, sep } from 'node:path';
+import { styleText } from 'node:util';
+import { globSync } from 'glob';
+import { format } from 'oxfmt';
+
+console.log(styleText('bold', '› Generating GraphQL schema import map...'));
+
+const sign = (code: string) =>
+  `/* @generated(${createHash('sha256').update(code).digest('hex')}) */\n${code}`;
+
+const root = process.cwd();
+const path = join(root, 'src/graphql');
+const outputFile = join(path, 'schemaImportMap.tsx');
+
+const files = globSync([
+  `${path}/{nodes,mutations}/*.tsx`.split(sep).join(posix.sep),
+  `${path}/{live,mutations}.tsx`.split(sep).join(posix.sep),
+])
+  .map((file) => relative(path, file.slice(0, file.lastIndexOf('.'))))
+  .sort((a, b) => String(a).localeCompare(String(b)));
+
+if (!files.length) {
+  throw new Error(`generate-graphql: No GraphQL schema files found.`);
+}
+
+writeFileSync(
+  outputFile,
+  sign(
+    (
+      await format(outputFile, `${files.map((name) => `import './${name}.tsx';`).join('\n')}`, {
+        singleQuote: true,
+      })
+    ).code,
+  ),
+);
+
+console.log(styleText(['green', 'bold'], '✓ Done generating GraphQL schema import map.'));

package/templates/fate/graphql/server/src/__tests__/index.test.tsx

@@ -0,0 +1,5 @@
+import { expect, test } from 'vite-plus/test';
+
+test('App', () => {
+  expect(1 + 1).toBe(2);
+});

package/templates/fate/graphql/server/src/app.tsx

@@ -0,0 +1,47 @@
+import { styleText } from 'node:util';
+import { useGraphQLSSE as createGraphQLSSEPlugin } from '@graphql-yoga/plugin-graphql-sse';
+import { createYoga } from 'graphql-yoga';
+import { Hono } from 'hono';
+import { cors } from 'hono/cors';
+import { Context, createContext } from './graphql/context.tsx';
+import schema from './graphql/schema.tsx';
+import { auth } from './lib/auth.tsx';
+import { clientOrigin, resolveCorsOrigin } from './lib/origins.ts';
+import prisma from './prisma/prisma.tsx';
+
+try {
+  await prisma.$connect();
+} catch (error) {
+  console.error(`${styleText(['red', 'bold'], 'Prisma Database Connection Error')}\n`, error);
+  process.exit(1);
+}
+
+const app = new Hono();
+
+app.use(
+  cors({
+    credentials: true,
+    origin: resolveCorsOrigin,
+  }),
+);
+
+app.on(['POST', 'GET'], '/api/auth/*', ({ req }) => auth.handler(req.raw));
+
+const yoga = createYoga<Context>({
+  graphiql: process.env.NODE_ENV === 'development',
+  plugins: [
+    createGraphQLSSEPlugin({
+      endpoint: '/graphql/stream',
+    }),
+  ],
+  schema,
+});
+
+app.on(['POST', 'GET', 'OPTIONS', 'DELETE', 'PUT'], '/graphql/*', async (context) => {
+  const req = context.req.raw;
+  return yoga.handleRequest(req, await createContext({ headers: req.headers }));
+});
+
+app.all('/*', (context) => context.redirect(clientOrigin));
+
+export default app;

package/templates/fate/graphql/server/src/graphql/builder.tsx

@@ -0,0 +1,121 @@
+import SchemaBuilder from '@pothos/core';
+import ComplexityPlugin from '@pothos/plugin-complexity';
+import DirectivesPlugin from '@pothos/plugin-directives';
+import PrismaPlugin from '@pothos/plugin-prisma';
+import RelayPlugin from '@pothos/plugin-relay';
+import ScopeAuthPlugin from '@pothos/plugin-scope-auth';
+import { Kind, type ValueNode } from 'graphql';
+import PrismaTypes, { getDatamodel } from '../prisma/pothos-types.ts';
+import prisma from '../prisma/prisma.tsx';
+import isAdmin from '../user/isAdmin.tsx';
+import { Context } from './context.tsx';
+import AuthDirectivesPlugin from './lib/authDirectives.tsx';
+import decodeGlobalID from './lib/decodeGlobalID.tsx';
+import encodeGlobalID from './lib/encodeGlobalID.tsx';
+
+interface PothosTypes extends Partial<PothosSchemaTypes.UserSchemaTypes> {
+  AuthScopes: {
+    role: string;
+    self: string;
+  };
+  Context: Context;
+  PrismaTypes: PrismaTypes;
+  Scalars: {
+    DateTime: {
+      Input: Date | string;
+      Output: Date | string;
+    };
+    JSON: {
+      Input: unknown;
+      Output: unknown;
+    };
+  };
+}
+
+const builder = new SchemaBuilder<PothosTypes>({
+  complexity: {
+    defaultComplexity: 1,
+    defaultListMultiplier: 10,
+    limit: {
+      breadth: 300,
+      complexity: 20_000,
+      depth: 20,
+    },
+  },
+  directives: {
+    useGraphQLToolsUnorderedDirectives: true,
+  },
+  plugins: [
+    ScopeAuthPlugin,
+    ComplexityPlugin,
+    PrismaPlugin,
+    RelayPlugin,
+    AuthDirectivesPlugin,
+    DirectivesPlugin,
+  ],
+  prisma: {
+    client: prisma,
+    dmmf: getDatamodel(),
+    exposeDescriptions: false,
+    filterConnectionTotalCount: true,
+    maxConnectionSize: 120,
+    onUnusedQuery: process.env.NODE_ENV === 'production' ? null : 'error',
+  },
+  relay: {
+    clientMutationId: 'omit',
+    cursorType: 'String',
+    decodeGlobalID,
+    encodeGlobalID: (typename, id) => encodeGlobalID(typename as keyof PrismaTypes, id),
+  },
+  scopeAuth: {
+    authScopes: ({ sessionUser }) => ({
+      role: (role) =>
+        !!sessionUser && (sessionUser.role.split(',').includes(role) || isAdmin(sessionUser)),
+      self: (id) => !!sessionUser && id === sessionUser.id,
+    }),
+  },
+});
+
+builder.mutationType();
+builder.queryType();
+builder.subscriptionType();
+
+const parseJSONLiteral = (ast: ValueNode): unknown => {
+  switch (ast.kind) {
+    case Kind.BOOLEAN:
+      return ast.value;
+    case Kind.FLOAT:
+    case Kind.INT:
+      return Number(ast.value);
+    case Kind.LIST:
+      return ast.values.map(parseJSONLiteral);
+    case Kind.NULL:
+      return null;
+    case Kind.OBJECT:
+      return Object.fromEntries(
+        ast.fields.map((field) => [field.name.value, parseJSONLiteral(field.value)]),
+      );
+    case Kind.STRING:
+    case Kind.ENUM:
+      return ast.value;
+    default:
+      return null;
+  }
+};
+
+const isDate = (value: unknown): value is Date =>
+  Object.prototype.toString.call(value) === '[object Date]';
+
+export const DateTimeScalar = builder.scalarType('DateTime', {
+  parseLiteral: (ast) => (ast.kind === Kind.STRING ? ast.value : ''),
+  parseValue: (value) => (typeof value === 'string' || isDate(value) ? value : String(value)),
+  serialize: (value) => (isDate(value) ? value.toISOString() : value),
+});
+
+export const JSONScalar = builder.scalarType('JSON', {
+  parseLiteral: parseJSONLiteral,
+  parseValue: (value) => value,
+  serialize: (value) => value,
+});
+
+export default builder;

package/templates/fate/graphql/server/src/graphql/context.tsx

@@ -0,0 +1,22 @@
+import { auth } from '../lib/auth.tsx';
+import prisma from '../prisma/prisma.tsx';
+import { toSessionUser, type SessionUser } from '../user/SessionUser.tsx';
+
+type CreateContextOptions = {
+  headers?: Headers;
+};
+
+export const createContext = async (options?: CreateContextOptions) => {
+  const session = options?.headers ? await auth.api.getSession({ headers: options.headers }) : null;
+
+  return {
+    headers: options?.headers ?? new Headers(),
+    prisma,
+    sessionUser: session?.user ? toSessionUser(session.user) : null,
+  };
+};
+
+export type Context = Awaited<ReturnType<typeof createContext>>;
+export type AppContext = Context & {
+  sessionUser: SessionUser | null;
+};

package/templates/fate/graphql/server/src/graphql/fate.ts

@@ -0,0 +1,85 @@
+import { graphqlMutation } from '@nkzw/fate';
+import { createLiveEventBus } from '@nkzw/fate/server';
+import { createPrismaSourceAdapter } from '@nkzw/fate/server/prisma';
+import type { AppContext } from './context.tsx';
+import {
+  categoryDataView,
+  commentDataView,
+  eventAttendeeDataView,
+  eventDataView,
+  postDataView,
+  Root,
+  tagDataView,
+  userDataView,
+  type Comment,
+  type Post,
+  type User,
+} from './views.ts';
+
+type FateMutationInput<Input extends Record<string, unknown>> = Input & {
+  args?: Record<string, unknown>;
+};
+
+export type PostAddInput = FateMutationInput<{
+  content: string;
+  title: string;
+}>;
+export type PostLikeInput = FateMutationInput<{
+  error?: 'boundary' | 'callSite';
+  id: string;
+  slow?: boolean;
+}>;
+export type PostUnlikeInput = FateMutationInput<{
+  id: string;
+}>;
+export type CommentAddInput = FateMutationInput<{
+  content: string;
+  postId: string;
+}>;
+export type CommentDeleteInput = FateMutationInput<{
+  id: string;
+}>;
+export type UserUpdateInput = FateMutationInput<{
+  name: string;
+}>;
+
+export const live = createLiveEventBus();
+
+export const fate = createPrismaSourceAdapter<AppContext>({
+  views: Root,
+});
+
+export const viewsByType = {
+  Category: categoryDataView,
+  Comment: commentDataView,
+  Event: eventDataView,
+  EventAttendee: eventAttendeeDataView,
+  Post: postDataView,
+  Tag: tagDataView,
+  User: userDataView,
+} as const;
+
+export const fateGraphQL = {
+  mutations: {
+    'comment.add': graphqlMutation<Comment, CommentAddInput, Comment>('Comment', {
+      field: 'commentAdd',
+    }),
+    'comment.delete': graphqlMutation<Comment, CommentDeleteInput, Comment>('Comment', {
+      field: 'commentDelete',
+    }),
+    'post.add': graphqlMutation<Post, PostAddInput, Post>('Post', {
+      field: 'postAdd',
+    }),
+    'post.like': graphqlMutation<Post, PostLikeInput, Post>('Post', {
+      field: 'postLike',
+    }),
+    'post.unlike': graphqlMutation<Post, PostUnlikeInput, Post>('Post', {
+      field: 'postUnlike',
+    }),
+    'user.update': graphqlMutation<User, UserUpdateInput, User>('User', {
+      field: 'userUpdate',
+    }),
+  },
+} as const;
+
+export * from './views.ts';