package update and Apollo Server 4 migration WIP

.yarnrc.yml

@@ -0,0 +1,3 @@
+nodeLinker: node-modules
+
+yarnPath: .yarn/releases/yarn-berry.js

package.json

@@ -76,7 +76,6 @@
     ]
   },
   "browserslist": [
-    "maintained node versions",
     "last 1 chrome version",
     "last 1 firefox version",
     "last 1 safari version"
@@ -194,15 +193,12 @@
     "styledComponents": {}
   },
   "dependencies": {
-    "@apollo/client": "^3.0.0-beta.33",
-    "@apollo/link-context": "^2.0.0-beta.3",
-    "@apollo/link-error": "^2.0.0-beta.3",
-    "@apollo/link-ws": "^2.0.0-beta.3",
+    "@apollo/client": "^3.10.8",
+    "@apollo/server": "^4.10.4",
     "@blueprintjs/core": "^3.28.2",
     "@blueprintjs/icons": "^3.18.1",
     "@sentry/node": "^5.7.1",
     "@serialport/bindings": "^9.0.0",
-    "apollo-server-express": "^2.9.6",
     "bonjour": "^3.5.0",
     "chalk": "^4.0.0",
     "change-case": "^4.1.1",
@@ -223,8 +219,9 @@
     "fuse.js": "^6.0.0",
     "gl-matrix": "^3.2.1",
     "googleapis": "^51.0.0",
-    "graphql": "^15.0.0",
+    "graphql": "^16.9.0",
     "graphql-bigint": "^1.0.0",
+    "graphql-subscriptions": "^2.0.0",
     "graphql-type-json": "^0.3.0",
     "graphql.macro": "^1.4.2",
     "immer": "^6.0.5",
@@ -252,14 +249,14 @@
     "react-app-rewired": "^2.1.6",
     "react-pdf": "^5.0.0",
     "react-router": "^6.0.0-alpha.4",
-    "react-scripts": "^3.4.1",
+    "react-scripts": "^5.0.1",
     "react-three-fiber": "^4.0.17",
     "react-use-gesture": "^7.0.4",
     "request": "^2.88.0",
     "rng": "^0.2.2",
     "sass": "^1.77.2",
     "simplex-noise": "^2.4.0",
-    "subscriptions-transport-ws": "^0.9.16",
+    "subscriptions-transport-ws": "^0.11.0",
     "three": "^0.116.1",
     "usb-detection": "^4.9.0",
     "uuid": "^3.3.3",
@@ -270,23 +267,24 @@
   },
   "devDependencies": {
     "@babel/cli": "^7.6.4",
-    "@babel/core": "^7.6.4",
+    "@babel/core": "^7.24.7",
     "@babel/helper-environment-visitor": "^7.24.7",
     "@babel/node": "^7.6.3",
     "@babel/plugin-proposal-class-properties": "^7.7.4",
     "@babel/plugin-proposal-nullish-coalescing-operator": "^7.7.4",
     "@babel/plugin-proposal-optional-chaining": "^7.7.5",
+    "@babel/preset-env": "^7.24.7",
     "@babel/preset-typescript": "^7.8.3",
     "@emotion/babel-preset-css-prop": "^10.0.27",
     "@emotion/core": "^10.0.28",
     "@emotion/styled": "^10.0.27",
-    "@graphql-codegen/cli": "^1.12.0",
-    "@graphql-codegen/fragment-matcher": "^1.13.5",
-    "@graphql-codegen/introspection": "^1.12.0",
-    "@graphql-codegen/typescript": "^1.13.5",
-    "@graphql-codegen/typescript-operations": "^1.12.0",
-    "@graphql-codegen/typescript-react-apollo": "^1.13.5",
-    "@graphql-codegen/typescript-resolvers": "^1.13.4",
+    "@graphql-codegen/cli": "^5.0.2",
+    "@graphql-codegen/fragment-matcher": "^5.0.2",
+    "@graphql-codegen/introspection": "^4.0.3",
+    "@graphql-codegen/typescript": "^4.0.9",
+    "@graphql-codegen/typescript-operations": "^4.2.3",
+    "@graphql-codegen/typescript-react-apollo": "^4.3.0",
+    "@graphql-codegen/typescript-resolvers": "^4.2.1",
     "@jagi/jest-transform-graphql": "^1.0.2",
     "@semantic-release/changelog": "^5.0.1",
     "@semantic-release/exec": "^5.0.0",
@@ -296,12 +294,14 @@
     "@storybook/addon-actions": "^5.2.4",
     "@storybook/addon-links": "^5.2.4",
     "@storybook/addons": "^5.2.4",
-    "@storybook/react": "^5.2.4",
+    "@storybook/react": "^8.1.11",
     "@testing-library/jest-dom": "^5.7.0",
     "@testing-library/react": "^10.0.4",
     "@tweenjs/tween.js": "^18.3.1",
+    "@types/babel__preset-env": "^7",
     "@types/bonjour": "^3.5.8",
     "@types/errorhandler": "^1.5.0",
+    "@types/jscodeshift": "^0",
     "@types/luxon": "^1.21.0",
     "@types/match-sorter": "^4.0.0",
     "@types/mkdirp": "^1.0.0",
@@ -322,14 +322,14 @@
     "all-contributors-cli": "^6.20.0",
     "apollo": "^2.22.0",
     "apollo-cache-hermes": "^0.8.9",
-    "babel-jest": "^24.9.0",
+    "babel-jest": "^29.7.0",
     "babel-plugin-import-glob": "^2.0.0",
     "babel-plugin-transform-node-env-inline": "^0.4.3",
     "babel-preset-env": "^1.7.0",
     "babel-preset-react": "^6.24.1",
     "babel-preset-react-app": "^9.0.2",
     "bodymovin": "^4.13.0",
-    "bootstrap": "^4.6.0",
+    "bootstrap": "^5.3.3",
     "canvas": "^2.11.2",
     "centered-pan-zoom": "^2.0.0",
     "cross-env": "^7.0.0",
@@ -354,7 +354,6 @@
     "rc-menu": "^8.0.0-alpha.1",
     "react": "^16.13.0",
     "react-animated-number": "^0.4.4",
-    "react-apollo": "^4.0.0-beta.1",
     "react-color": "^2.17.3",
     "react-dom": "^16.13.0",
     "react-draggable": "^4.0.3",
@@ -367,7 +366,6 @@
     "react-mosaic-component": "^4.0.0",
     "react-promise-suspense": "^0.3.1",
     "react-qrcode-hook": "^1.1.0",
-    "react-rangeslider": "^2.2.0",
     "react-router-dom": "^6.0.0-alpha.4",
     "react-sortable-hoc": "^1.10.1",
     "react-table": "^6.10.3",
@@ -387,7 +385,7 @@
     "stylelint-scss": "^3.12.0",
     "svg-to-jsx": "^1.0.2",
     "three-obj-loader": "^1.1.3",
-    "ts-jest": "^26.0.0",
+    "ts-jest": "^29.1.5",
     "ts-node-dev": "^1.0.0-pre.44",
     "tsconfig-paths-webpack-plugin": "^3.2.0",
     "typescript": "^5.4.0",
@@ -398,11 +396,10 @@
   },
   "resolutions": {
     "change-case": "^4.1.1",
-    "param-case": "3.0.3",
-    "@babel/preset-env": "^7.8.7"
+    "param-case": "3.0.3"
   },
   "volta": {
-    "node": "16.20.2"
+    "node": "18.20.3"
   },
   "packageManager": "[email protected]"
 }

server/bootstrap/apollo.ts

@@ -1,12 +1,15 @@
 import {
   ApolloServer,
-  makeExecutableSchema,
-  ApolloServerExpressConfig,
-} from "apollo-server-express";
+  ApolloServerOptions,
+  BaseContext
+} from "@apollo/server";
+import { expressMiddleware } from "@apollo/server/express4";
+import {makeExecutableSchema} from "@graphql-tools/schema"
 import express from "express";
 import vanity from "./vanity";
 import https from "https";
 import http from "http";
+import cors from "cors";
 import path from "path";
 import fs from "fs";
 import ipAddress from "../helpers/ipaddress";
@@ -26,7 +29,6 @@ export const schema = makeExecutableSchema({
   typeDefs,
   resolvers,
   resolverValidationOptions: {
-    requireResolversForResolveType: false,
   },
 });
 if (process.env.NODE_ENV === "development" && !process.env.CI) {
@@ -55,7 +57,7 @@ function responseForOperation(requestContext) {
   const selection = operation.selectionSet.selections[0] as FieldNode;
   const opName = selection.name.value;
   const parentType = getOperationRootType(schema, operation);
-  const fieldDef = getFieldDef(schema, parentType, opName);
+  const fieldDef = getFieldDef(schema, parentType, selection);
   const args = getArgumentValues(
     fieldDef,
     operation.selectionSet.selections[0] as FieldNode,
@@ -128,9 +130,11 @@ export default (
   httpOnly: boolean,
   setMutations: (r: {[key: string]: Function}) => void,
 ) => {
+
+
   // Apply the mutations to App.js so we don't get circular dependency issues
   setMutations(resolvers.Mutation);
-  const graphqlOptions: ApolloServerExpressConfig = {
+  const graphqlOptions: ApolloServerOptions<BaseContext> = {
     schema,
     engine: {
       apiKey: "service:Thorium:yZHa-qq7-_kVSpmsc9Ka1A",
@@ -154,7 +158,17 @@ export default (
     }),
   };
   const apollo = new ApolloServer(graphqlOptions);
-  apollo.applyMiddleware({app});
+  app.use(
+    '/graphql',
+    cors<cors.CorsRequest>(),
+    express.json(),
+    expressMiddleware(apollo, {
+      context: async ({req, res}) => ({
+        clientId: req?.headers.clientid,
+        core: req?.headers.core,
+      }),
+    })
+  )
 
   let httpServer: http.Server | https.Server = http.createServer(app);
   let isHttps = false;

server/data.ts

@@ -1,4 +1,4 @@
-import {gql} from "apollo-server-express";
+import {gql} from "graphql-tag";
 import merge from "./helpers/merge.js";
 import * as schema from "./typeDefs/index";
 

server/helpers/subscriptionManager.ts

@@ -1,4 +1,4 @@
-import {PubSub} from "apollo-server-express";
+import {PubSub} from "graphql-subscriptions"
 import EventEmitter from "events";
 
 const ee = new EventEmitter.EventEmitter();

server/typeDefs/actions.ts

@@ -1,4 +1,5 @@
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 const mutationHelper = require("../helpers/mutationHelper").default;
 // We define a schema that encompasses all of the types

server/typeDefs/ambiance.ts

@@ -1,4 +1,4 @@
-import {gql} from "apollo-server-express";
+import {gql} from "graphql-tag";
 const mutationHelper = require("../helpers/mutationHelper").default;
 // We define a schema that encompasses all of the types
 // necessary for the functionality in this file.

server/typeDefs/assets.ts

@@ -1,4 +1,4 @@
-import {gql} from "apollo-server-express";
+import {gql} from "graphql-tag";
 import {pubsub} from "../helpers/subscriptionManager";
 import {getFolders} from "../helpers/uploadAsset";
 import path from "path";

server/typeDefs/clients.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 import {StationResolver} from "../helpers/stationResolver";
 import uuid from "uuid";

server/typeDefs/commandLine.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 const mutationHelper = require("../helpers/mutationHelper").default;
 // We define a schema that encompasses all of the types

server/typeDefs/computerCore.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 import {ComputerCore, HackingPreset} from "../classes";
 import uuid from "uuid";

server/typeDefs/coolant.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 const mutationHelper = require("../helpers/mutationHelper").default;
 // We define a schema that encompasses all of the types

server/typeDefs/coreFeed.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 const mutationHelper = require("../helpers/mutationHelper").default;
 // We define a schema that encompasses all of the types

server/typeDefs/coreLayouts.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 const mutationHelper = require("../helpers/mutationHelper").default;
 // We define a schema that encompasses all of the types

server/typeDefs/countermeasures.ts

@@ -1,4 +1,5 @@
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 import App from "../app";
 import {moduleTypes} from "../classes/Countermeasure";

server/typeDefs/crew.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 import {Crew} from "../classes";
 const mutationHelper = require("../helpers/mutationHelper").default;

server/typeDefs/crm.ts

@@ -1,4 +1,5 @@
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 import mutationHelper from "../helpers/mutationHelper";
 import App from "../app";

server/typeDefs/damage.ts

@@ -1,5 +1,5 @@
 import App from "../app";
-import {gql} from "apollo-server-express";
+import {gql} from "graphql-tag";
 const mutationHelper = require("../helpers/mutationHelper").default;
 // We define a schema that encompasses all of the types
 // necessary for the functionality in this file.

server/typeDefs/decks.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 import {Room} from "../classes";
 const mutationHelper = require("../helpers/mutationHelper").default;

server/typeDefs/dmx.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 import {DMXConfig, DMXDevice, DMXFixture, DMXSet} from "../classes";
 import uuid from "uuid";

server/typeDefs/docking.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 const mutationHelper = require("../helpers/mutationHelper").default;
 // We define a schema that encompasses all of the types

server/typeDefs/engines.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 const mutationHelper = require("../helpers/mutationHelper").default;
 // We define a schema that encompasses all of the types

server/typeDefs/environment.ts

@@ -1,4 +1,4 @@
-import {gql} from "apollo-server-express";
+import {gql} from "graphql-tag";
 const mutationHelper = require("../helpers/mutationHelper").default;
 // We define a schema that encompasses all of the types
 // necessary for the functionality in this file.

server/typeDefs/exocomp.ts

@@ -1,5 +1,6 @@
 import App from "../app";
-import {gql, withFilter} from "apollo-server-express";
+import {gql} from "graphql-tag"
+import { withFilter } from "graphql-subscriptions";
 import {pubsub} from "../helpers/subscriptionManager";
 const mutationHelper = require("../helpers/mutationHelper").default;
 // We define a schema that encompasses all of the types

server/typeDefs/externals.ts

@@ -5,7 +5,7 @@ import os from "os";
 import uuid from "uuid";
 import importMission from "../imports/missions/import";
 import importSimulator from "../imports/simulators/import";
-import {gql} from "apollo-server-express";
+import {gql} from "graphql-tag";
 
 // We define a schema that encompasses all of the types
 // necessary for the functionality in this file.