Fix subscription server to work normally

server/src/context.ts

@@ -1,13 +1,17 @@
 import Redis, {RedisOptions} from 'ioredis';
-import WebSocket, {WebSocketServer} from 'ws';
 
+import {ApolloServer} from 'apollo-server-express';
+import {Disposable} from 'graphql-ws';
 import {PrismaClient} from '@prisma/client';
 import {PubSub} from 'graphql-subscriptions';
 import {RedisPubSub} from 'graphql-redis-subscriptions';
 import {Server} from 'http';
+import {WebSocketServer} from 'ws';
 import {assert} from './utils/assert';
 import express from 'express';
 import {getUserId} from './utils/auth';
+import {schemaWithMiddleware} from './server';
+import {useServer} from 'graphql-ws/lib/use/ws';
 
 // eslint-disable-next-line prettier/prettier
 const {JWT_SECRET, JWT_SECRET_ETC, REDIS_HOSTNAME, REDIS_CACHEKEY, NODE_ENV} =
@@ -125,17 +129,42 @@ export function createContext(params: CreateContextParams): Context {
 
 export const runSubscriptionServer = (
   httpServer: Server,
-): WebSocket.Server<WebSocket.WebSocket> => {
+  apollo: ApolloServer,
+): Disposable => {
   const subscriptionServer = new WebSocketServer({
     server: httpServer,
-    path: '/graphql',
+    path: apollo.graphqlPath,
   });
 
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  const serverCleanup = useServer(
+    {
+      schema: schemaWithMiddleware,
+      context: async (ctx) => {
+        process.stdout.write('Connected to websocket\n');
+
+        // Return connection parameters for context building.
+        return {
+          connectionParams: ctx.connectionParams,
+          prisma,
+          pubsub,
+          appSecret: JWT_SECRET,
+          userId: getUserId(
+            // @ts-ignore
+            ctx.connectionParams?.Authorization ||
+              ctx.connectionParams?.authorization,
+          ),
+        };
+      },
+    },
+    subscriptionServer,
+  );
+
   if (NODE_ENV === 'production') {
     ['SIGINT', 'SIGTERM'].forEach((signal) => {
       process.on(signal, () => subscriptionServer.close());
     });
   }
 
-  return subscriptionServer;
+  return serverCleanup;
 };

server/src/server.ts

@@ -11,7 +11,6 @@ import {createApp} from './app';
 import express from 'express';
 import {permissions} from './permissions';
 import {schema} from './schema';
-import {useServer} from 'graphql-ws/lib/use/ws';
 
 const {PORT = 4000, NODE_ENV, SENDGRID_API_KEY} = process.env;
 
@@ -49,10 +48,7 @@ const initializeApolloServer = (
   app: express.Application,
 ): (() => void) => {
   apollo.applyMiddleware({app});
-
-  const subscriptionServer = runSubscriptionServer(httpServer);
-  // eslint-disable-next-line react-hooks/rules-of-hooks
-  serverCleanup = useServer({schema: schemaWithMiddleware}, subscriptionServer);
+  serverCleanup = runSubscriptionServer(httpServer, apollo);
 
   return (): void => {
     process.stdout.write(