@trackunit/react-core-contexts 0.4.667 → 0.4.668

package/index.cjs.js

@@ -5,8 +5,11 @@ var client = require('@apollo/client');
 var context = require('@apollo/client/link/context');
 var error = require('@apollo/client/link/error');
 var removeTypename = require('@apollo/client/link/remove-typename');
+var utilities = require('@apollo/client/utilities');
 var reactCoreHooks = require('@trackunit/react-core-hooks');
 var apolloUploadClient = require('apollo-upload-client');
+var graphql = require('graphql');
+var graphqlSse = require('graphql-sse');
 var React = require('react');
 require('@js-temporal/polyfill');
 var i18nLibraryTranslation = require('@trackunit/i18n-library-translation');
@@ -85,7 +88,7 @@ const createApolloClient = ({ graphqlManagerUrl, graphqlPublicUrl, graphqlManage
                 window.location.reload();
             }
             // eslint-disable-next-line no-console
-            console.error(`Error calling: '${errorResponse.operation.getContext().clientAwareness.name}' fetching Data for: ${errorResponse.operation.operationName}`, errorResponse.graphQLErrors);
+            console.error(`Error calling: '${errorResponse.operation.getContext().response.url}'`, errorResponse.graphQLErrors);
             errorResponse.graphQLErrors.forEach(error => {
                 var _a, _b;
                 if ("extensions" in error) {
@@ -153,6 +156,42 @@ const createApolloClient = ({ graphqlManagerUrl, graphqlPublicUrl, graphqlManage
         },
     };
     const removeTypenameLink = removeTypename.removeTypenameFromVariables();
+    class SSELink extends client.ApolloLink {
+        constructor(options) {
+            super();
+            this.client = graphqlSse.createClient(options);
+        }
+        request(operation) {
+            return new utilities.Observable(sink => {
+                return this.client.subscribe({ ...operation, query: graphql.print(operation.query) }, {
+                    next: sink.next.bind(sink),
+                    complete: sink.complete.bind(sink),
+                    error: sink.error.bind(sink),
+                });
+            });
+        }
+    }
+    const sseLink = new SSELink({
+        url: `${graphqlInternalUrl}/stream`,
+        headers: () => {
+            return {
+                Authorization: `Bearer ${token}`,
+            };
+        },
+    });
+    // Split links based on operation type
+    const splitLink = client.from([
+        authLink,
+        client.split(({ query }) => {
+            const definition = utilities.getMainDefinition(query);
+            return definition.kind === "OperationDefinition" && definition.operation === "subscription";
+        }, sseLink, client.from([
+            errorLink,
+            removeTypenameLink,
+            client.split(operation => operation.getContext().clientName === "imageupload", imageUploadGraphQLLink),
+            client.split(operation => operation.getContext().clientName === "manager", managerGraphQLLink, client.split(operation => operation.getContext().clientName === "report", reportGraphQLLink, client.split(() => global.gql === "internal", internalGraphQLLink, publicGraphQLLink))),
+        ])),
+    ]);
     return {
         client: new client.ApolloClient({
             name: "Manager",
@@ -167,13 +206,7 @@ const createApolloClient = ({ graphqlManagerUrl, graphqlPublicUrl, graphqlManage
                 },
             }),
             defaultOptions,
-            link: client.from([
-                errorLink,
-                authLink,
-                removeTypenameLink,
-                client.split(operation => operation.getContext().clientName === "imageupload", imageUploadGraphQLLink),
-                client.split(operation => operation.getContext().clientName === "manager", managerGraphQLLink, client.split(operation => operation.getContext().clientName === "report", reportGraphQLLink, client.split(() => global.gql === "internal", internalGraphQLLink, publicGraphQLLink))),
-            ]),
+            link: splitLink,
         }),
         setToken: (newToken) => {
             token = newToken;

package/index.esm.js

@@ -1,10 +1,13 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
-import { ApolloProvider, createHttpLink, ApolloClient, InMemoryCache, from, split } from '@apollo/client';
+import { ApolloProvider, createHttpLink, from, split, ApolloClient, InMemoryCache, ApolloLink } from '@apollo/client';
 import { setContext } from '@apollo/client/link/context';
 import { onError } from '@apollo/client/link/error';
 import { removeTypenameFromVariables } from '@apollo/client/link/remove-typename';
+import { getMainDefinition, Observable } from '@apollo/client/utilities';
 import { useEnvironment, useToken, useErrorHandler, AnalyticsContextProvider, AssetSortingProvider, ConfirmationDialogProvider, EnvironmentContextProvider, ErrorHandlingContextProvider, FilterBarProvider, ModalDialogContextProvider, NavigationContextProvider, OemBrandingContextProvider, ToastProvider, TokenProvider, CurrentUserProvider, CurrentUserPreferenceProvider, UserSubscriptionProvider } from '@trackunit/react-core-hooks';
 import { createUploadLink } from 'apollo-upload-client';
+import { print } from 'graphql';
+import { createClient } from 'graphql-sse';
 import * as React from 'react';
 import { useRef, useMemo, useEffect, useState } from 'react';
 import '@js-temporal/polyfill';
@@ -65,7 +68,7 @@ const createApolloClient = ({ graphqlManagerUrl, graphqlPublicUrl, graphqlManage
                 window.location.reload();
             }
             // eslint-disable-next-line no-console
-            console.error(`Error calling: '${errorResponse.operation.getContext().clientAwareness.name}' fetching Data for: ${errorResponse.operation.operationName}`, errorResponse.graphQLErrors);
+            console.error(`Error calling: '${errorResponse.operation.getContext().response.url}'`, errorResponse.graphQLErrors);
             errorResponse.graphQLErrors.forEach(error => {
                 var _a, _b;
                 if ("extensions" in error) {
@@ -133,6 +136,42 @@ const createApolloClient = ({ graphqlManagerUrl, graphqlPublicUrl, graphqlManage
         },
     };
     const removeTypenameLink = removeTypenameFromVariables();
+    class SSELink extends ApolloLink {
+        constructor(options) {
+            super();
+            this.client = createClient(options);
+        }
+        request(operation) {
+            return new Observable(sink => {
+                return this.client.subscribe({ ...operation, query: print(operation.query) }, {
+                    next: sink.next.bind(sink),
+                    complete: sink.complete.bind(sink),
+                    error: sink.error.bind(sink),
+                });
+            });
+        }
+    }
+    const sseLink = new SSELink({
+        url: `${graphqlInternalUrl}/stream`,
+        headers: () => {
+            return {
+                Authorization: `Bearer ${token}`,
+            };
+        },
+    });
+    // Split links based on operation type
+    const splitLink = from([
+        authLink,
+        split(({ query }) => {
+            const definition = getMainDefinition(query);
+            return definition.kind === "OperationDefinition" && definition.operation === "subscription";
+        }, sseLink, from([
+            errorLink,
+            removeTypenameLink,
+            split(operation => operation.getContext().clientName === "imageupload", imageUploadGraphQLLink),
+            split(operation => operation.getContext().clientName === "manager", managerGraphQLLink, split(operation => operation.getContext().clientName === "report", reportGraphQLLink, split(() => global.gql === "internal", internalGraphQLLink, publicGraphQLLink))),
+        ])),
+    ]);
     return {
         client: new ApolloClient({
             name: "Manager",
@@ -147,13 +186,7 @@ const createApolloClient = ({ graphqlManagerUrl, graphqlPublicUrl, graphqlManage
                 },
             }),
             defaultOptions,
-            link: from([
-                errorLink,
-                authLink,
-                removeTypenameLink,
-                split(operation => operation.getContext().clientName === "imageupload", imageUploadGraphQLLink),
-                split(operation => operation.getContext().clientName === "manager", managerGraphQLLink, split(operation => operation.getContext().clientName === "report", reportGraphQLLink, split(() => global.gql === "internal", internalGraphQLLink, publicGraphQLLink))),
-            ]),
+            link: splitLink,
         }),
         setToken: (newToken) => {
             token = newToken;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-core-contexts",
-  "version": "0.4.667",
+  "version": "0.4.668",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
@@ -14,6 +14,8 @@
     "@js-temporal/polyfill": "^0.4.4",
     "@trackunit/iris-app-runtime-core": "*",
     "jest-fetch-mock": "^3.0.3",
+    "graphql-sse": "^2.5.3",
+    "graphql": "^16.9.0",
     "@trackunit/i18n-library-translation": "*",
     "@trackunit/react-components": "*",
     "@trackunit/iris-app-api": "*",