merge dev to main (v1.2.0) (#794)

Author: ymc9

README.md

@@ -174,14 +174,27 @@ The following diagram gives a high-level architecture overview of ZenStack.
 
 ## Examples
 
+### Todo SaaS App
+
 Check out the [Collaborative Todo App](https://zenstack-todo.vercel.app/) for a running example. You can find different implementations below:
 
--   [Next.js + SWR hooks](https://github.com/zenstackhq/sample-todo-nextjs)
--   [Next.js + TanStack Query](https://github.com/zenstackhq/sample-todo-nextjs-tanstack)
--   [Next.js + tRPC](https://github.com/zenstackhq/sample-todo-trpc)
--   [Nuxt + TanStack Query](https://github.com/zenstackhq/sample-todo-nuxt)
+-   [Next.js 13 + NextAuth + SWR](https://github.com/zenstackhq/sample-todo-nextjs)
+-   [Next.js 13 + NextAuth + TanStack Query](https://github.com/zenstackhq/sample-todo-nextjs-tanstack)
+-   [Next.js 13 + NextAuth + tRPC](https://github.com/zenstackhq/sample-todo-trpc)
+-   [Nuxt V3 + TanStack Query](https://github.com/zenstackhq/sample-todo-nuxt)
 -   [SvelteKit + TanStack Query](https://github.com/zenstackhq/sample-todo-sveltekit)
 
+### Blog App
+
+-   [Next.js 13 + Pages Route + SWR](https://github.com/zenstackhq/docs-tutorial-nextjs)
+-   [Next.js 13 + App Route + SWR](https://github.com/zenstackhq/docs-tutorial-nextjs-app-dir)
+-   [Next.js 13 + App Route + tRPC](https://github.com/zenstackhq/sample-blog-nextjs-app-trpc)
+-   [Nuxt V3 + TanStack Query](https://github.com/zenstackhq/docs-tutorial-nuxt)
+-   [SvelteKit](https://github.com/zenstackhq/docs-tutorial-sveltekit)
+-   [Remix](https://github.com/zenstackhq/docs-tutorial-remix)
+-   [Express Backend API](https://github.com/zenstackhq/docs-tutorial-express)
+-   [Clerk Integration](https://github.com/zenstackhq/docs-tutorial-clerk)
+
 ## Community
 
 Join our [discord server](https://discord.gg/Ykhr738dUe) for chat and updates!

package.json

@@ -1,6 +1,6 @@
 {
     "name": "zenstack-monorepo",
-    "version": "1.1.1",
+    "version": "1.2.0",
     "description": "",
     "scripts": {
         "build": "pnpm -r build",

packages/language/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@zenstackhq/language",
-    "version": "1.1.1",
+    "version": "1.2.0",
     "displayName": "ZenStack modeling language compiler",
     "description": "ZenStack modeling language compiler",
     "homepage": "https://zenstack.dev",

packages/plugins/openapi/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@zenstackhq/openapi",
   "displayName": "ZenStack Plugin and Runtime for OpenAPI",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "ZenStack plugin and runtime supporting OpenAPI",
   "main": "index.js",
   "repository": {

packages/plugins/openapi/src/rest-generator.ts

@@ -19,6 +19,7 @@ import * as path from 'path';
 import pluralize from 'pluralize';
 import invariant from 'tiny-invariant';
 import YAML from 'yaml';
+import { name } from '.';
 import { OpenAPIGeneratorBase } from './generator-base';
 import { getModelResourceMeta } from './meta';
 
@@ -31,7 +32,7 @@ export class RESTfulOpenAPIGenerator extends OpenAPIGeneratorBase {
     private warnings: string[] = [];
 
     generate() {
-        let output = requireOption<string>(this.options, 'output');
+        let output = requireOption<string>(this.options, 'output', name);
         output = resolvePath(output, this.options);
 
         const components = this.generateComponents();

packages/plugins/openapi/src/rpc-generator.ts

@@ -18,6 +18,7 @@ import * as path from 'path';
 import invariant from 'tiny-invariant';
 import { upperCaseFirst } from 'upper-case-first';
 import YAML from 'yaml';
+import { name } from '.';
 import { OpenAPIGeneratorBase } from './generator-base';
 import { getModelResourceMeta } from './meta';
 
@@ -32,7 +33,7 @@ export class RPCOpenAPIGenerator extends OpenAPIGeneratorBase {
     private warnings: string[] = [];
 
     generate() {
-        let output = requireOption<string>(this.options, 'output');
+        let output = requireOption<string>(this.options, 'output', name);
         output = resolvePath(output, this.options);
 
         // input types

packages/plugins/swr/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@zenstackhq/swr",
     "displayName": "ZenStack plugin for generating SWR hooks",
-    "version": "1.1.1",
+    "version": "1.2.0",
     "description": "ZenStack plugin for generating SWR hooks",
     "main": "index.js",
     "repository": {
@@ -29,6 +29,7 @@
         "@zenstackhq/runtime": "workspace:*",
         "@zenstackhq/sdk": "workspace:*",
         "change-case": "^4.1.2",
+        "cross-fetch": "^4.0.0",
         "decimal.js": "^10.4.2",
         "lower-case-first": "^2.0.2",
         "semver": "^7.3.8",
@@ -37,6 +38,7 @@
     },
     "devDependencies": {
         "@tanstack/react-query": "^4.28.0",
+        "@testing-library/react": "^14.0.0",
         "@types/jest": "^29.5.0",
         "@types/node": "^18.0.0",
         "@types/react": "18.2.0",
@@ -45,6 +47,7 @@
         "@zenstackhq/testtools": "workspace:*",
         "copyfiles": "^2.4.1",
         "jest": "^29.5.0",
+        "nock": "^13.3.6",
         "react": "18.2.0",
         "rimraf": "^3.0.2",
         "swr": "^2.0.3",

packages/plugins/swr/src/generator.ts

@@ -2,6 +2,7 @@ import type { DMMF } from '@prisma/generator-helper';
 import {
     PluginOptions,
     createProject,
+    generateModelMeta,
     getDataModels,
     getPrismaClientImportSpec,
     getPrismaVersion,
@@ -16,9 +17,10 @@ import path from 'path';
 import semver from 'semver';
 import { FunctionDeclaration, OptionalKind, ParameterDeclarationStructure, Project, SourceFile } from 'ts-morph';
 import { upperCaseFirst } from 'upper-case-first';
+import { name } from '.';
 
 export async function generate(model: Model, options: PluginOptions, dmmf: DMMF.Document) {
-    let outDir = requireOption<string>(options, 'output');
+    let outDir = requireOption<string>(options, 'output', name);
     outDir = resolvePath(outDir, options);
 
     const project = createProject();
@@ -32,6 +34,8 @@ export async function generate(model: Model, options: PluginOptions, dmmf: DMMF.
 
     const models = getDataModels(model);
 
+    await generateModelMeta(project, models, path.join(outDir, '__model_meta.ts'), false, true);
+
     generateIndex(project, outDir, models);
 
     models.forEach((dataModel) => {
@@ -60,24 +64,20 @@ function generateModelHooks(project: Project, outDir: string, model: DataModel,
         moduleSpecifier: prismaImport,
     });
     sf.addStatements([
-        `import { useContext } from 'react';`,
-        `import { RequestHandlerContext, type GetNextArgs, type RequestOptions, type InfiniteRequestOptions, type PickEnumerable, type CheckSelect } from '@zenstackhq/swr/runtime';`,
+        `import { RequestHandlerContext, type GetNextArgs, type RequestOptions, type InfiniteRequestOptions, type PickEnumerable, type CheckSelect, useHooksContext } from '@zenstackhq/swr/runtime';`,
+        `import metadata from './__model_meta';`,
         `import * as request from '@zenstackhq/swr/runtime';`,
     ]);
 
     const modelNameCap = upperCaseFirst(model.name);
     const prismaVersion = getPrismaVersion();
 
-    const prefixesToMutate = ['find', 'aggregate', 'count', 'groupBy'];
     const useMutation = sf.addFunction({
         name: `useMutate${model.name}`,
         isExported: true,
         statements: [
-            'const { endpoint, fetch } = useContext(RequestHandlerContext);',
-            `const prefixesToMutate = [${prefixesToMutate
-                .map((prefix) => '`${endpoint}/' + lowerCaseFirst(model.name) + '/' + prefix + '`')
-                .join(', ')}];`,
-            'const mutate = request.getMutate(prefixesToMutate);',
+            'const { endpoint, fetch, logging } = useHooksContext();',
+            `const mutate = request.useMutate('${model.name}', metadata, logging);`,
         ],
     });
     const mutationFuncs: string[] = [];
@@ -297,8 +297,6 @@ function generateQueryHook(
     typeParameters?: string[],
     infinite = false
 ) {
-    const modelRouteName = lowerCaseFirst(model.name);
-
     const typeParams = typeParameters ? [...typeParameters] : [`T extends ${argsType}`];
     if (infinite) {
         typeParams.push(`R extends ${returnType}`);
@@ -329,10 +327,10 @@ function generateQueryHook(
     })
         .addBody()
         .addStatements([
-            'const { endpoint, fetch } = useContext(RequestHandlerContext);',
+            'const { endpoint, fetch } = useHooksContext();',
             !infinite
-                ? `return request.get<${returnType}>(\`\${endpoint}/${modelRouteName}/${operation}\`, args, options, fetch);`
-                : `return request.infiniteGet<${inputType} | undefined, ${returnType}>(\`\${endpoint}/${modelRouteName}/${operation}\`, getNextArgs, options, fetch);`,
+                ? `return request.useGet<${returnType}>('${model.name}', '${operation}', endpoint, args, options, fetch);`
+                : `return request.useInfiniteGet<${inputType} | undefined, ${returnType}>('${model.name}', '${operation}', endpoint, getNextArgs, options, fetch);`,
         ]);
 }