Merge pull request #2 from Code-Hex/add/README-more

write more description in readme

Author: Code-Hex

README.md

@@ -1,5 +1,123 @@
 # graphql-codegen-typescript-validation-schema
 
-GraphQL Code Generator plugin to generate form validation schema from your GraphQL schema
+[![Test](https://github.com/Code-Hex/graphql-codegen-typescript-validation-schema/actions/workflows/ci.yml/badge.svg)](https://github.com/Code-Hex/graphql-codegen-typescript-validation-schema/actions/workflows/ci.yml) [![npm version](https://badge.fury.io/js/graphql-codegen-typescript-validation-schema.svg)](https://badge.fury.io/js/graphql-codegen-typescript-validation-schema)
 
-## THIS IS ALPHA VERSION
+[GraphQL code generator](https://github.com/dotansimha/graphql-code-generator) plugin to generate form validation schema from your GraphQL schema.
+
+- [x] support [yup](https://github.com/jquense/yup)
+- [ ] support [zod](https://github.com/colinhacks/zod)
+
+## Quick Start
+
+Start by installing this plugin and write simple plugin config;
+
+```sh
+$ npm i graphql-codegen-typescript-validation-schema
+```
+
+```yml
+generates:
+  path/to/graphql.ts:
+    plugins:
+      - typescript
+      - typescript-validation-schema # specify to use this plugin
+    config:
+      # You can put the config for typescript plugin here
+      # see: https://www.graphql-code-generator.com/plugins/typescript
+      strictScalars: true
+      # You can also write the config for this plugin together
+      schema: yup
+```
+
+## Config API Reference
+
+### `schema`
+
+type: `ValidationSchema` default: `'yup'`
+
+Specify generete validation schema you want.
+
+```yml
+generates:
+  path/to/graphql.ts:
+    plugins:
+      - typescript
+      - graphql-codegen-validation-schema
+    config:
+      schema: yup
+```
+
+### `importFrom`
+
+type: `string`
+
+import types from generated typescript type path. if not given, omit import statement.
+
+```yml
+generates:
+  path/to/graphql.ts:
+    plugins:
+      - typescript
+  path/to/validation.ts:
+    plugins:
+      - graphql-codegen-validation-schema
+    config:
+      importFrom: ./graphql # path for generated ts code
+```
+
+Then the generator generates code with import statement like below.
+
+```ts
+import { GeneratedInput } from './graphql'
+
+/* generates validation schema here */
+```
+
+### `enumsAsTypes`
+
+type: `boolean` default: `false`
+
+Generates enum as TypeScript `type` instead of `enum`.
+
+### `directives`
+
+type: `DirectiveConfig`
+
+Generates validation schema with more API based on directive schema. For example, yaml config and GraphQL schema is here.
+
+```yml
+generates:
+  path/to/graphql.ts:
+    plugins:
+      - typescript
+      - graphql-codegen-validation-schema
+    config:
+      schema: yup
+      directives:
+        required:
+          msg: required
+        constraint:
+          minLength: min
+          # Replace $1 with specified `startsWith` argument value of the constraint directive
+          startsWith: ["matches", "/^$1/"]
+          format:
+            email: email
+```
+
+```graphql
+input ExampleInput {
+  email: String! @required(msg: "Hello, World!") @constraint(minLength: 50)
+  message: String! @constraint(startsWith: "Hello")
+}
+```
+
+Then generates yup validation schema like below.
+
+```ts
+export function ExampleInputSchema(): yup.SchemaOf<ExampleInput> {
+  return yup.object({
+    email: yup.string().defined().required("Hello, World!").min(50),
+    message: yup.string().defined().matches(/^Hello/)
+  })
+}
+```

jest.config.js

@@ -1,5 +1,5 @@
 const { resolve } = require("path");
-const { pathsToModuleNameMapper } = require("ts-jest/utils");
+const { pathsToModuleNameMapper } = require("ts-jest");
 
 const pkg = require("./package.json");
 const tsconfig = require("./tsconfig.json");

src/config.ts

@@ -74,17 +74,13 @@ export interface ValidationSchemaPluginConfig extends TypeScriptPluginConfig {
    */
   enumsAsTypes?: boolean;
   /**
-   * @description this is for yup schema. use this when you specified `schema: yup`
-   */
-  yup?: YupSchemaPluginConfig;
-  /**
-   * @description Generates yup schema as strict.
+   * @description Generates validation schema with more API based on directive schema.
    * @exampleMarkdown
    * ```yml
    * generates:
    *   path/to/file.ts:
    *     plugins:
-   *       - graphql-codegen-validation-schema:
+   *       - graphql-codegen-validation-schema
    *     config:
    *       schema: yup
    *       directives:

src/yup/index.ts

@@ -185,7 +185,7 @@ const generateNameNodeYupSchema = (
   }
 
   const primitive = yup4Scalar(tsVisitor, node.value);
-  return config.yup?.strict ? `${primitive}.strict(true)` : primitive;
+  return primitive;
 };
 
 const maybeLazy = (type: TypeNode, schema: string): string => {

tests/yup.spec.ts

@@ -214,43 +214,4 @@ describe("yup", () => {
       "export const PageTypeSchema = yup.mixed().oneOf(['PUBLIC', 'BASIC_AUTH'])"
     );
   });
-  it("with yup.strict", async () => {
-    const schema = buildSchema(/* GraphQL */ `
-      input PrimitiveInput {
-        a: ID
-        b: String
-        c: Boolean
-        d: Int
-        e: Float
-        f: F!
-      }
-
-      input F {
-        a: String!
-      }
-    `);
-    const result = await plugin(
-      schema,
-      [],
-      {
-        yup: {
-          strict: true,
-        },
-      },
-      {}
-    );
-    const wantContains = [
-      "export function PrimitiveInputSchema(): yup.SchemaOf<PrimitiveInput>",
-      "a: yup.string().strict(true),",
-      "b: yup.string().strict(true),",
-      "c: yup.boolean().strict(true),",
-      "d: yup.number().strict(true),",
-      "e: yup.number().strict(true),",
-      "f: FSchema().defined()",
-      "a: yup.string().strict(true).defined()", // for FSchema
-    ];
-    for (const wantContain of wantContains) {
-      expect(result.content).toContain(wantContain);
-    }
-  });
 });