Render bigint in server response

packages/altair-app/package.json

@@ -73,6 +73,7 @@
     "graphql-language-service-types": "1.8.2",
     "graphql-query-compress": "1.2.3",
     "graphql-ws": "5.9.1",
+    "json-bigint": "^1.0.0",
     "lodash-es": "4.17.21",
     "loglevel": "1.8.0",
     "loglevel-plugin-prefix": "0.8.4",
@@ -125,6 +126,7 @@
     "@types/firefox-webext-browser": "^109.0.0",
     "@types/graphql": "^14.5.0",
     "@types/jest": "26.0.0",
+    "@types/json-bigint": "^1.0.1",
     "@types/json-schema": "^7.0.6",
     "@types/lodash-es": "^4.17.4",
     "@types/memoizee": "^0.4.3",

packages/altair-app/src/app/modules/altair/components/environment-manager/environment-manager.component.ts

@@ -15,7 +15,7 @@ import {
   EnvironmentState,
 } from 'altair-graphql-core/build/types/state/environments.interfaces';
 import { Extension } from '@codemirror/state';
-import { json, jsonParseLinter } from '@codemirror/lang-json';
+import { json } from '@codemirror/lang-json';
 import { Options as SortableOptions, SortableEvent } from 'sortablejs';
 import { TODO } from 'altair-graphql-core/build/types/shared';
 (window as any).jsonlint = (window as any).jsonlint || {

packages/altair-app/src/app/modules/altair/services/gql/gql.service.ts

@@ -36,7 +36,7 @@ import { debug } from '../../utils/logger';
 import * as fromHeaders from '../../store/headers/headers.reducer';
 import * as fromVariables from '../../store/variables/variables.reducer';
 import { fillAllFields, FillAllFieldsOptions } from './fillFields';
-import { setByDotNotation } from '../../utils';
+import { parseJson, setByDotNotation } from '../../utils';
 import { Token } from 'codemirror';
 import { IDictionary, Omit } from '../../interfaces/shared';
 import {
@@ -696,8 +696,18 @@ export class GqlService {
         headers,
         observe: 'response',
         withCredentials,
+        // returning text instead of transforming to JSON automatically.
+        // Will instead transform to JSON manually to support bigint
+        responseType: 'text',
       })
       .pipe(
+        map((res) => {
+          if (res.body) {
+            return res.clone({ body: parseJson(res.body, res.body) });
+          }
+
+          return res;
+        }),
         catchError((err: HttpErrorResponse) => {
           debug.error(err);
           if (err.error instanceof ErrorEvent) {

packages/altair-app/src/app/modules/altair/utils/index.ts

@@ -1,4 +1,5 @@
 import FileSaver from 'file-saver';
+import JSONBigint from 'json-bigint';
 import isElectron from 'altair-graphql-core/build/utils/is_electron';
 import { debug } from './logger';
 import { IDictionary } from '../interfaces/shared';
@@ -158,7 +159,7 @@ export const jsonc = (str: string) => {
 
 export const parseJson = (str: string, defaultValue = {}) => {
   try {
-    return JSON.parse(str);
+    return JSONBigint.parse(str);
   } catch {
     debug.error('Could not parse JSON. Using default instead.');
     return defaultValue;

yarn.lock

@@ -6041,6 +6041,11 @@
     "@types/parse5" "^6.0.3"
     "@types/tough-cookie" "*"
 
+"@types/json-bigint@^1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@types/json-bigint/-/json-bigint-1.0.1.tgz#201062a6990119a8cc18023cfe1fed12fc2fc8a7"
+  integrity sha512-zpchZLNsNuzJHi6v64UBoFWAvQlPhch7XAi36FkH6tL1bbbmimIF+cS7vwkzY4u5RaSWMoflQfu+TshMPPw8uw==
+
 "@types/json-buffer@~3.0.0":
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/@types/json-buffer/-/json-buffer-3.0.0.tgz#85c1ff0f0948fc159810d4b5be35bf8c20875f64"