feat: Add graphql.tada for automatic typesafe GQL

Author: codinsonn

.vscode/settings.json

@@ -0,0 +1,4 @@
+{
+    "typescript.tsdk": "node_modules/typescript/lib",
+    "typescript.enablePromptUseWorkspaceTsdk": true
+}

features/app-core/fetchers/useHealthCheckQuery.ts

@@ -0,0 +1,33 @@
+import { graphql } from 'gql.tada'
+
+/* --- Query ----------------------------------------------------------------------------------- */
+
+export const healthCheckQuery = graphql(`
+  query healthCheck {
+    healthCheck {
+      echo
+      status
+      alive
+      kicking
+      now
+      aliveTime
+      aliveSince
+      serverTimezone
+      requestHost
+      requestProtocol
+      requestURL
+      baseURL
+      apiURL
+      port
+      debugPort
+      nodeVersion
+      v8Version
+      systemArch
+      systemPlatform
+      systemRelease
+      systemFreeMemory
+      systemTotalMemory
+      systemLoadAverage
+    }
+  }
+`)

features/app-core/graphql-env.d.ts

@@ -0,0 +1,33 @@
+/* eslint-disable */
+/* prettier-ignore */
+
+/** An IntrospectionQuery representation of your schema.
+ *
+ * @remarks
+ * This is an introspection of your schema saved as a file by GraphQLSP.
+ * It will automatically be used by `gql.tada` to infer the types of your GraphQL documents.
+ * If you need to reuse this data or update your `scalars`, update `tadaOutputLocation` to
+ * instead save to a .ts instead of a .d.ts file.
+ */
+export type introspection = {
+  query: 'Query';
+  mutation: never;
+  subscription: never;
+  types: {
+    'Query': { kind: 'OBJECT'; name: 'Query'; fields: { 'healthCheck': { name: 'healthCheck'; type: { kind: 'NON_NULL'; name: never; ofType: { kind: 'OBJECT'; name: 'HealthCheckData'; ofType: null; }; } }; }; };
+    'HealthCheckArgs': { kind: 'INPUT_OBJECT'; name: 'HealthCheckArgs'; inputFields: [{ name: 'echo'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; }; defaultValue: null }]; };
+    'String': unknown;
+    'HealthCheckData': { kind: 'OBJECT'; name: 'HealthCheckData'; fields: { 'echo': { name: 'echo'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'status': { name: 'status'; type: { kind: 'NON_NULL'; name: never; ofType: { kind: 'SCALAR'; name: 'String'; ofType: null; }; } }; 'alive': { name: 'alive'; type: { kind: 'NON_NULL'; name: never; ofType: { kind: 'SCALAR'; name: 'Boolean'; ofType: null; }; } }; 'kicking': { name: 'kicking'; type: { kind: 'NON_NULL'; name: never; ofType: { kind: 'SCALAR'; name: 'Boolean'; ofType: null; }; } }; 'now': { name: 'now'; type: { kind: 'NON_NULL'; name: never; ofType: { kind: 'SCALAR'; name: 'String'; ofType: null; }; } }; 'aliveTime': { name: 'aliveTime'; type: { kind: 'NON_NULL'; name: never; ofType: { kind: 'SCALAR'; name: 'Float'; ofType: null; }; } }; 'aliveSince': { name: 'aliveSince'; type: { kind: 'NON_NULL'; name: never; ofType: { kind: 'SCALAR'; name: 'String'; ofType: null; }; } }; 'serverTimezone': { name: 'serverTimezone'; type: { kind: 'NON_NULL'; name: never; ofType: { kind: 'SCALAR'; name: 'String'; ofType: null; }; } }; 'requestHost': { name: 'requestHost'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'requestProtocol': { name: 'requestProtocol'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'requestURL': { name: 'requestURL'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'baseURL': { name: 'baseURL'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'apiURL': { name: 'apiURL'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'port': { name: 'port'; type: { kind: 'SCALAR'; name: 'Int'; ofType: null; } }; 'debugPort': { name: 'debugPort'; type: { kind: 'SCALAR'; name: 'Int'; ofType: null; } }; 'nodeVersion': { name: 'nodeVersion'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'v8Version': { name: 'v8Version'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'systemArch': { name: 'systemArch'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'systemPlatform': { name: 'systemPlatform'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'systemRelease': { name: 'systemRelease'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'systemFreeMemory': { name: 'systemFreeMemory'; type: { kind: 'SCALAR'; name: 'Float'; ofType: null; } }; 'systemTotalMemory': { name: 'systemTotalMemory'; type: { kind: 'SCALAR'; name: 'Float'; ofType: null; } }; 'systemLoadAverage': { name: 'systemLoadAverage'; type: { kind: 'LIST'; name: never; ofType: { kind: 'SCALAR'; name: 'Float'; ofType: null; }; } }; }; };
+    'Boolean': unknown;
+    'Float': unknown;
+    'Int': unknown;
+  };
+};
+
+import * as gqlTada from 'gql.tada';
+
+declare module 'gql.tada' {
+  interface setupSchema {
+    introspection: introspection
+  }
+}

features/app-core/package.json

@@ -6,9 +6,11 @@
     "@apollo/server": "^4.10.2",
     "@as-integrations/next": "^3.0.0",
     "@graphql-tools/load-files": "^7.0.0",
+    "gql.tada": "^1.4.3",
     "graphql-tag": "^2.12.6"
   },
   "devDependencies": {
+    "@0no-co/graphqlsp": "^1.9.1",
     "typescript": "5.3.3"
   },
   "scripts": {}

features/app-core/tsconfig.json

@@ -16,6 +16,13 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "preserve",
+    "plugins": [
+      {
+        "name": "@0no-co/graphqlsp",
+        "schema": "http://localhost:3000/api/graphql",
+        "tadaOutputLocation": "./graphql-env.d.ts"
+      }
+    ],
     "paths": {
       "@app/config": ["../../features/app-core/appConfig.ts"],
       "@app/hooks/*": ["../../features/app-core/hooks/*"],
@@ -24,7 +31,7 @@
       "@app/assets/*": ["../../features/app-core/assets/*"],
       "@app/resolvers/*": ["../../features/app-core/resolvers/*"],
       "@app/middleware/*": ["../../features/app-core/middleware/*"]
-    },
+    }
   },
   "include": [
     "next-env.d.ts",