finally happy with GraphQL I think

packages/web/codegen.ts

@@ -0,0 +1,44 @@
+import { CodegenConfig } from "@graphql-codegen/cli";
+import { readFile, writeFile } from "fs/promises";
+import { format } from "prettier";
+
+const formatFile = async (path: string) => {
+  const content = await readFile(path, "utf-8");
+  const formatted = format(content, { parser: "typescript" });
+  await writeFile(path, formatted, "utf-8");
+};
+
+const config: CodegenConfig = {
+  overwrite: true,
+  schema: {
+    "http://localhost:5000/graphql": {
+      headers: {
+        Cookie: "ytf-cookie-consent=0;",
+      },
+    },
+  },
+  documents: "./**/*.graphql",
+  hooks: {
+    afterAllFileWrite: async (...filePaths: string[]) => {
+      await Promise.all(filePaths.map(formatFile));
+    },
+  },
+  generates: {
+    "src/__generated__/graphql.ts": {
+      plugins: [
+        "@atmina/only-enum-types",
+        "typescript-operations",
+        "typescript-graphql-request",
+      ],
+      config: {
+        scalars: {
+          DateTime: "string",
+        },
+        enumsAsTypes: true,
+        preResolveTypes: true,
+      },
+    },
+  },
+};
+
+export default config;

packages/web/next.config.js

@@ -3,6 +3,9 @@ const { PHASE_DEVELOPMENT_SERVER } = require("next/constants");
 /** @returns {import("next").NextConfig} */
 const config = (phase) => ({
   productionBrowserSourceMaps: true,
+  experimental: {
+    serverActions: true,
+  },
   typescript: {
     ignoreBuildErrors: true,
   },

packages/web/package.json

@@ -5,9 +5,7 @@
   "scripts": {
     "build": "next build",
     "chromatic": "env-cmd -f .env.local chromatic",
-    "codegen": "yarn codegen:client && yarn codegen:server",
-    "codegen:client": "graphql-codegen --config graphql.config.js --project client",
-    "codegen:server": "graphql-codegen --config graphql.config.js --project server",
+    "codegen": "graphql-codegen",
     "dev": "yarn codegen && yarn next",
     "e2e:open": "cypress open --config baseUrl=http://localhost:3000",
     "e2e:run": "cypress run --config baseUrl=http://localhost:3000",
@@ -18,13 +16,11 @@
     "storybook:build": "storybook build"
   },
   "devDependencies": {
-    "@atmina/local-typescript-operations": "0.8.0",
     "@atmina/only-enum-types": "0.7.0",
     "@graphql-codegen/cli": "2.16.1",
     "@graphql-codegen/near-operation-file-preset": "2.4.4",
-    "@graphql-codegen/typescript-graphql-request": "^4.5.9",
+    "@graphql-codegen/typescript-graphql-request": "^6.0.0",
     "@graphql-codegen/typescript-operations": "^3.0.2",
-    "@graphql-codegen/typescript-urql": "^4.0.0",
     "@next/eslint-plugin-next": "13.5.3",
     "@storybook/addon-essentials": "7.4.6",
     "@storybook/addon-interactions": "7.4.6",
@@ -55,19 +51,18 @@
     "@icons-pack/react-simple-icons": "^8.0.1",
     "@radix-ui/react-dialog": "^1.0.3",
     "@radix-ui/react-dropdown-menu": "^2.0.4",
-    "@urql/next": "^1.0.0",
     "cookie": "0.5.0",
     "framer-motion": "^10.2.3",
     "graphql": "16.8.0",
+    "graphql-request": "^6.1.0",
     "next": "13.5.3",
     "react": "18.2.0",
     "react-animate-height": "^3.1.1",
     "react-dom": "18.2.0",
     "react-ssr-prepass": "1.5.0",
     "sharp": "0.31.3",
     "tailwind-merge": "^1.10.0",
-    "typesense": "^1.5.3",
-    "urql": "^4.0.5"
+    "typesense": "^1.5.3"
   },
   "license": "MIT"
 }