feat(frontend): review page loaders and queries to Tanstack React Query

frontend/codegen.ts

@@ -1,31 +1,72 @@
 import type { CodegenConfig } from '@graphql-codegen/cli';
 
+const scalars = {
+    DateTime: 'string',
+    Date: 'string',
+    BigInt: 'number',
+    Decimal: 'number',
+    ID: 'string',
+}
 const config: CodegenConfig = {
-  schema: 'schema.graphql',
-  documents: "src/api/**/*.graphql",
-  ignoreNoDocuments: true,
-  generates: {
-    'src/api/types.gql-generated.ts': {
-      plugins: [ 'typescript' ],
-    },
-    'src/': {
-      preset: 'near-operation-file',
-      presetConfig: {
-        baseTypesPath: '/api/types.gql-generated.ts',
-      },
-      plugins: [
-        'typescript-operations',
-        {
-          'typescript-rtk-query': {
-            importBaseApiFrom: '@/api/baseGqlApi',
-            importBaseApiAlternateName: 'gqlAPI',
-          }
-        }
-      ],
+    schema: 'schema.graphql',
+    ignoreNoDocuments: true,
+    generates: {
+        // 1️⃣ Generic TypeScript types (unique source)
+        'src/api/types.gql-generated.ts': {
+            documents: 'src/api/**/*.graphql',
+            plugins: [ 'typescript' ],
+            config: {
+                useTypeImports: true,
+                skipTypename: false,
+                dedupeOperationSuffix: true,
+                scalars,
+            },
+        },
+
+        // 2️⃣ RTK Query in /api - Near-operation-file
+        'src/api/': {
+            documents: 'src/api/**/*.graphql',
+            preset: 'near-operation-file',
+            presetConfig: {
+                baseTypesPath: 'types.gql-generated.ts',
+                importTypesNamespace: '_Types',
+            },
+            plugins: [
+                'typescript-operations',
+                {
+                    'typescript-rtk-query': {
+                        importBaseApiFrom: '@/api/baseGqlApi',
+                        importBaseApiAlternateName: 'gqlAPI',
+                    },
+                },
+            ],
+            config: {
+                arrayInputCoercion: false,
+                scalars
+            },
+        },
+
+        // 3️⃣ React Query in /features - Near-operation-file
+        'src/features': {
+            documents: 'src/features/**/*.graphql',
+            preset: 'near-operation-file',
+            presetConfig: {
+                baseTypesPath: '../api/types.gql-generated.ts',
+                importTypesNamespace: '_Types',
+            },
+            plugins: [
+                'typescript-operations',
+                'typed-document-node',
+            ],
+            config: {
+                useTypeImports: true,
+                documentMode: 'documentNode',
+                skipTypename: false,
+                dedupeOperationSuffix: true,
+                arrayInputCoercion: false,
+                scalars,
+            },
+        },
     },
-    '.introspection.json': {
-      plugins: [ 'introspection' ]
-    }
-  },
 }
 export default config;

frontend/package.json

@@ -29,6 +29,8 @@
     "@reduxjs/toolkit": "^2.2.1",
     "@rtk-query/graphql-request-base-query": "^2.3.1",
     "@solar-icons/react": "^1.0.1",
+    "@tanstack/react-query": "^5.100.14",
+    "@tanstack/react-query-devtools": "^5.100.14",
     "@tanstack/react-router": "^1.169.2",
     "@tanstack/react-router-devtools": "^1.166.13",
     "@xyflow/react": "^12.7.0",