test: try to graphql ((( See this pain, it is a mistake choice

by Sivritkin Dmitriy

1@@ -16,14 +16,17 @@
2     "lint:ts:fix": "npx eslint \"**/*.{ts,tsx}\" --fix",
3     "format:check": "prettier --check .",
4     "format:fix": "prettier --write .",
5-    "typecheck": "tsc --noEmit --pretty"
6+    "typecheck": "tsc --noEmit --pretty",
7+    "generate-gql": "graphql-codegen -r dotenv/config --config ./src/api/codegen.yml && prettier --write ./src/api/__generated__.ts"
8   },
9   "dependencies": {
10     "@radix-ui/react-dropdown-menu": "^2.0.6",
11     "@radix-ui/react-icons": "^1.3.0",
12     "@radix-ui/react-slot": "^1.0.2",
13     "class-variance-authority": "^0.7.0",
14     "clsx": "^2.1.1",
15+    "graphql": "^16.8.2",
16+    "graphql-request": "^7.0.1",
17     "lucide-react": "^0.395.0",
18     "next": "14.2.4",
19     "next-themes": "^0.3.0",
20@@ -33,6 +36,10 @@
21     "tailwindcss-animate": "^1.0.7"
22   },
23   "devDependencies": {
24+    "@graphql-codegen/cli": "^5.0.2",
25+    "@graphql-codegen/typescript": "^4.0.7",
26+    "@graphql-codegen/typescript-graphql-request": "^6.2.0",
27+    "@graphql-codegen/typescript-operations": "^4.2.1",
28     "@types/node": "^20",
29     "@types/react": "^18",
30     "@types/react-dom": "^18",
31@@ -42,7 +49,7 @@
32     "prettier": "^3.3.2",
33     "prettier-plugin-tailwindcss": "^0.6.4",
34     "tailwindcss": "^3.4.1",
35-    "typescript": "^5"
36+    "typescript": "^5.4.5"
37   },
38   "packageManager": "yarn@4.3.0"
39 }@@ -0,0 +1,16 @@
40+overwrite: true
41+schema:
42+  - https://api.github.com/graphql:
43+      headers:
44+        User-Agent: velenyx
45+        Authorization: 'Bearer ${GITHUB_TOKEN}'
46+documents: './src/api/documents/**/*.gql'
47+generates:
48+  ./src/api/__generated__.ts:
49+    plugins:
50+      - typescript
51+      - typescript-operations
52+      - typescript-graphql-request
53+config:
54+  maybeValue: 'T'
55+  immutableTypes: true@@ -0,0 +1,30 @@
56+# i need git diffs code
57+
58+query Commits($owner: String!, $name: String!, $branchName: String!) {
59+  repository(owner: $owner, name: $name) {
60+    ref(qualifiedName: $branchName) {
61+      target {
62+        ... on Commit {
63+          history(last: 10) {
64+            edges {
65+              node {
66+                parents(first: 10) {
67+                  nodes {
68+                    oid
69+                  }
70+                }
71+                messageHeadline
72+                oid
73+                author {
74+                  name
75+                  email
76+                  date
77+                }
78+              }
79+            }
80+          }
81+        }
82+      }
83+    }
84+  }
85+}@@ -0,0 +1,6 @@
86+schema:
87+  - https://api.github.com/graphql:
88+      headers:
89+        User-Agent: velenyx
90+        Authorization: 'Bearer ${GITHUB_TOKEN}'
91+documents: '**/*.graphql'@@ -0,0 +1,10 @@
92+import { GraphQLClient } from "graphql-request";
93+import { getSdk } from "~/api/__generated__";
94+
95+const client = new GraphQLClient(`https://api.github.com/graphql`, {
96+  headers: {
97+    Authorization: `Bearer ${process.env.GITHUB_TOKEN || ""}`,
98+  },
99+});
100+
101+export const gql = getSdk(client);@@ -1,4 +1,12 @@
102-export default function Home() {
103+import { gql } from "~/api";
104+
105+export default async function Home() {
106+  const { repository } = await gql.Commits({
107+    owner: "velenyx",
108+    name: "github-commit-explorer",
109+    branchName: "main",
110+  });
111+
112   return (
113     <div className="container mt-3">
114       <h1 className="text-3xl text-green-600">Hello world!!!</h1>