From ea1a69ac12ec7b85d8a62b55bc8ac877224a54f4 Mon Sep 17 00:00:00 2001 From: Estela Silva Date: Fri, 3 May 2024 18:00:53 -0300 Subject: [PATCH 1/2] wip --- apps/back-office/src/app/graphql.module.ts | 95 ++++++++++++---------- 1 file changed, 54 insertions(+), 41 deletions(-) diff --git a/apps/back-office/src/app/graphql.module.ts b/apps/back-office/src/app/graphql.module.ts index 5fddd0e4aa..45e9682713 100644 --- a/apps/back-office/src/app/graphql.module.ts +++ b/apps/back-office/src/app/graphql.module.ts @@ -2,71 +2,84 @@ import { NgModule } from '@angular/core'; import { ApolloModule, APOLLO_OPTIONS } from 'apollo-angular'; import { ApolloClientOptions, - ApolloLink, + // ApolloLink, InMemoryCache, - split, + // split, } from '@apollo/client/core'; import { HttpLink } from 'apollo-angular/http'; -import { setContext } from '@apollo/client/link/context'; -import { getMainDefinition } from '@apollo/client/utilities'; -import { environment } from '../environments/environment'; +// import { setContext } from '@apollo/client/link/context'; +// import { getMainDefinition } from '@apollo/client/utilities'; +// import { environment } from '../environments/environment'; import extractFiles from 'extract-files/extractFiles.mjs'; import isExtractableFile from 'extract-files/isExtractableFile.mjs'; -import { GraphQLWsLink } from '@apollo/client/link/subscriptions'; -import { createClient } from 'graphql-ws'; +// import { GraphQLWsLink } from '@apollo/client/link/subscriptions'; +// import { createClient } from 'graphql-ws'; +// import { SchemaService } from '@oort-front/shared'; +import { HttpClient } from '@angular/common/http'; +import { firstValueFrom, map } from 'rxjs'; /** * Configuration of the Apollo client. * * @param httpLink Apollo http link + * @param httpClient Http client * @returns void */ -export const createApollo = (httpLink: HttpLink): ApolloClientOptions => { - const basic = setContext(() => ({ - headers: { - // eslint-disable-next-line @typescript-eslint/naming-convention - Accept: 'application/json; charset=utf-8', - UserTimeZone: Intl.DateTimeFormat().resolvedOptions().timeZone, - }, - })); +export const createApollo = async ( + httpLink: HttpLink, + httpClient: HttpClient +): Promise> => { + // const basic = setContext(() => ({ + // headers: { + // // eslint-disable-next-line @typescript-eslint/naming-convention + // Accept: 'application/json; charset=utf-8', + // UserTimeZone: Intl.DateTimeFormat().resolvedOptions().timeZone, + // }, + // })); + + const schemaUrl = await firstValueFrom( + httpClient + .get<{ url: string }>('/schema/url') + .pipe(map((response) => response.url)) + ); const http = httpLink.create({ - uri: `${environment.apiUrl}/graphql`, + uri: schemaUrl, extractFiles: (body) => extractFiles(body, isExtractableFile), }); - const ws = new GraphQLWsLink( - createClient({ - url: `${environment.subscriptionApiUrl}/graphql`, - connectionParams: { - authToken: localStorage.getItem('idtoken'), - }, - }) - ); + // const ws = new GraphQLWsLink( + // createClient({ + // url: `${environment.subscriptionApiUrl}/graphql`, + // connectionParams: { + // authToken: localStorage.getItem('idtoken'), + // }, + // }) + // ); /** Definition for apollo link query definition */ - interface Definition { - kind: string; - operation?: string; - } + // interface Definition { + // kind: string; + // operation?: string; + // } - const link = ApolloLink.from([ - basic, - split( - ({ query }) => { - const { kind, operation }: Definition = getMainDefinition(query); - return kind === 'OperationDefinition' && operation === 'subscription'; - }, - ws, - http - ), - ]); + // const link = ApolloLink.from([ + // basic, + // split( + // ({ query }) => { + // const { kind, operation }: Definition = getMainDefinition(query); + // return kind === 'OperationDefinition' && operation === 'subscription'; + // }, + // ws, + // http + // ), + // ]); // Cache is not currently used, due to fetchPolicy values const cache = new InMemoryCache(); return { - link, + link: http, cache, defaultOptions: { watchQuery: { @@ -95,7 +108,7 @@ export const createApollo = (httpLink: HttpLink): ApolloClientOptions => { { provide: APOLLO_OPTIONS, useFactory: createApollo, - deps: [HttpLink], + deps: [HttpLink, HttpClient], }, ], }) From 4dd86f8bdca61ee0dbe11e441ae4964bfad07caf Mon Sep 17 00:00:00 2001 From: Estela Silva Date: Mon, 6 May 2024 17:45:13 -0300 Subject: [PATCH 2/2] wip: updated graphql module to use schema endpoint url --- apps/back-office/src/app/graphql.module.ts | 110 ++++++++++----------- package.json | 3 +- 2 files changed, 55 insertions(+), 58 deletions(-) diff --git a/apps/back-office/src/app/graphql.module.ts b/apps/back-office/src/app/graphql.module.ts index 45e9682713..9f605baa10 100644 --- a/apps/back-office/src/app/graphql.module.ts +++ b/apps/back-office/src/app/graphql.module.ts @@ -2,84 +2,80 @@ import { NgModule } from '@angular/core'; import { ApolloModule, APOLLO_OPTIONS } from 'apollo-angular'; import { ApolloClientOptions, - // ApolloLink, + ApolloLink, InMemoryCache, - // split, } from '@apollo/client/core'; import { HttpLink } from 'apollo-angular/http'; -// import { setContext } from '@apollo/client/link/context'; -// import { getMainDefinition } from '@apollo/client/utilities'; -// import { environment } from '../environments/environment'; -import extractFiles from 'extract-files/extractFiles.mjs'; -import isExtractableFile from 'extract-files/isExtractableFile.mjs'; -// import { GraphQLWsLink } from '@apollo/client/link/subscriptions'; -// import { createClient } from 'graphql-ws'; -// import { SchemaService } from '@oort-front/shared'; -import { HttpClient } from '@angular/common/http'; -import { firstValueFrom, map } from 'rxjs'; +import { setContext } from '@apollo/client/link/context'; +import { getMainDefinition } from '@apollo/client/utilities'; +import { environment } from '../environments/environment'; +import { buildClientSchema } from 'graphql/utilities'; +import { fetch } from 'cross-fetch'; /** * Configuration of the Apollo client. * * @param httpLink Apollo http link - * @param httpClient Http client * @returns void */ export const createApollo = async ( - httpLink: HttpLink, - httpClient: HttpClient + httpLink: HttpLink ): Promise> => { - // const basic = setContext(() => ({ - // headers: { - // // eslint-disable-next-line @typescript-eslint/naming-convention - // Accept: 'application/json; charset=utf-8', - // UserTimeZone: Intl.DateTimeFormat().resolvedOptions().timeZone, - // }, - // })); + const basic = setContext(() => ({ + headers: { + // eslint-disable-next-line @typescript-eslint/naming-convention + Accept: 'application/json; charset=utf-8', + UserTimeZone: Intl.DateTimeFormat().resolvedOptions().timeZone, + }, + })); - const schemaUrl = await firstValueFrom( - httpClient - .get<{ url: string }>('/schema/url') - .pipe(map((response) => response.url)) - ); + // Fetch the schema url from back-end + // NOT WORKING: we must be logged in and here we're not + // const schemaEndpoint = await fetch(`${environment.apiUrl}/schema/url`); + // const schemaEndpointString = await schemaEndpoint.text(); - const http = httpLink.create({ - uri: schemaUrl, - extractFiles: (body) => extractFiles(body, isExtractableFile), - }); + // Fetch the schema file from the fetched endpoint + // NOT WORKING: CORS ERROR + const response = await fetch( + 'https://oortdevstorage.blob.core.windows.net/public/introspection/schema?1715023102100' + ); + const schemaString = await response.text(); + const schema = buildClientSchema(JSON.parse(schemaString)); - // const ws = new GraphQLWsLink( - // createClient({ - // url: `${environment.subscriptionApiUrl}/graphql`, - // connectionParams: { - // authToken: localStorage.getItem('idtoken'), - // }, - // }) - // ); + const link = ApolloLink.from([ + basic, + httpLink.create({ + uri: `${environment.apiUrl}/graphql`, + }), + ]); - /** Definition for apollo link query definition */ - // interface Definition { - // kind: string; - // operation?: string; - // } + // Create a link that uses the introspected schema + const schemaLink = new ApolloLink((operation, forward) => { + operation.setContext(({ graphqlContext = {} }) => ({ + graphqlContext: { + ...graphqlContext, + schema, + }, + })); - // const link = ApolloLink.from([ - // basic, - // split( - // ({ query }) => { - // const { kind, operation }: Definition = getMainDefinition(query); - // return kind === 'OperationDefinition' && operation === 'subscription'; - // }, - // ws, - // http - // ), - // ]); + return forward(operation); + }); // Cache is not currently used, due to fetchPolicy values const cache = new InMemoryCache(); return { - link: http, + link: ApolloLink.split( + (operation) => { + const definition = getMainDefinition(operation.query); + return ( + definition.kind === 'OperationDefinition' && + definition.operation === 'subscription' + ); + }, + schemaLink.concat(link), + link + ), cache, defaultOptions: { watchQuery: { @@ -108,7 +104,7 @@ export const createApollo = async ( { provide: APOLLO_OPTIONS, useFactory: createApollo, - deps: [HttpLink, HttpClient], + deps: [HttpLink], }, ], }) diff --git a/package.json b/package.json index 2f6f16df9f..c9149ce56e 100644 --- a/package.json +++ b/package.json @@ -75,6 +75,7 @@ "cron-parser": "^4.7.0", "cron-validator": "^1.3.1", "cronstrue": "^2.20.0", + "cross-fetch": "^4.0.0", "esri-leaflet": "^3.0.10", "esri-leaflet-cluster": "^3.0.1", "esri-leaflet-geocoder": "^3.1.4", @@ -151,11 +152,11 @@ "@types/jasminewd2": "~2.0.3", "@types/jest": "28.1.1", "@types/jsonpath": "^0.2.0", - "@types/simpleheat": "^0.4.3", "@types/leaflet.heat": "^0.2.1", "@types/leaflet.markercluster": "^1.5.1", "@types/node": "18.7.1", "@types/proj4": "^2.5.2", + "@types/simpleheat": "^0.4.3", "@types/to-json-schema": "^0.2.4", "@types/uuid": "^9.0.1", "@types/ws": "^7.4.1",