@teambit/graphql 0.0.802 → 0.0.803

package/dist/render-lifecycle.d.ts

@@ -1,21 +1,17 @@
 import { ReactNode } from 'react';
 import type { ApolloClient, NormalizedCacheObject } from '@apollo/client';
-import type { BrowserData, RenderPlugins } from '@teambit/ui';
+import type { SSR } from '@teambit/ui';
 import type { GraphqlUI, GraphQLClient } from './graphql.ui.runtime';
 declare type RenderContext = {
     client: GraphQLClient<any>;
 };
-export declare class GraphqlRenderPlugins implements RenderPlugins<RenderContext, {
+export declare class GraphqlRenderPlugins implements SSR.RenderPlugin<RenderContext, {
     state?: NormalizedCacheObject;
 }> {
     private graphqlUI;
     constructor(graphqlUI: GraphqlUI);
-    serverInit: ({ browser, server }?: {
-        browser?: BrowserData | undefined;
-        server?: {
-            port: number;
-        } | undefined;
-    }) => RenderContext | undefined;
+    key: string;
+    serverInit: ({ browser }: SSR.SsrSession) => RenderContext;
     /**
      * Eagerly and recursively execute all gql queries in the app.
      * Data will be available in gqlClient.extract()

package/dist/render-lifecycle.js

@@ -69,21 +69,30 @@ function _graphqlProvider() {
   return data;
 }
 
+function _graphql() {
+  const data = require("./graphql.aspect");
+
+  _graphql = function () {
+    return data;
+  };
+
+  return data;
+}
+
 const ALLOWED_HEADERS = ['cookie'];
 
 class GraphqlRenderPlugins {
   constructor(graphqlUI) {
     this.graphqlUI = graphqlUI;
+    (0, _defineProperty2().default)(this, "key", _graphql().GraphqlAspect.id);
     (0, _defineProperty2().default)(this, "serverInit", ({
-      browser,
-      server
-    } = {}) => {
-      if (!browser) return undefined;
-      const port = (server === null || server === void 0 ? void 0 : server.port) || 3000;
+      browser
+    }) => {
+      const port = (browser === null || browser === void 0 ? void 0 : browser.location.port) || 3000;
       const serverUrl = `http://localhost:${port}/graphql`;
       const client = this.graphqlUI.createSsrClient({
         serverUrl,
-        headers: (0, _lodash().default)(browser.connection.headers, ALLOWED_HEADERS)
+        headers: (0, _lodash().default)(browser === null || browser === void 0 ? void 0 : browser.headers, ALLOWED_HEADERS)
       });
       const ctx = {
         client

package/dist/render-lifecycle.js.map

@@ -1 +1 @@
-{"version":3,"names":["ALLOWED_HEADERS","GraphqlRenderPlugins","constructor","graphqlUI","browser","server","undefined","port","serverUrl","client","createSsrClient","headers","pick","connection","ctx","app","getDataFromTree","json","JSON","stringify","extract","raw","state","parse","e","console","error","location","window","isInsecure","protocol","wsUrl","host","createClient","subscriptionUri","_client","renderCtx","children","TypeError","isBrowser","BrowserGqlProvider","ServerGqlProvider","getClient","browserInit"],"sources":["render-lifecycle.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { getDataFromTree } from '@apollo/client/react/ssr';\nimport type { ApolloClient, NormalizedCacheObject } from '@apollo/client';\nimport pick from 'lodash.pick';\n\nimport { isBrowser } from '@teambit/ui-foundation.ui.is-browser';\nimport type { BrowserData, RenderPlugins } from '@teambit/ui';\n\nimport type { GraphqlUI, GraphQLClient } from './graphql.ui.runtime';\nimport { GraphQLProvider } from './graphql-provider';\n\ntype RenderContext = {\n  client: GraphQLClient<any>;\n};\n\nconst ALLOWED_HEADERS = ['cookie'];\n\nexport class GraphqlRenderPlugins implements RenderPlugins<RenderContext, { state?: NormalizedCacheObject }> {\n  constructor(private graphqlUI: GraphqlUI) {}\n\n  serverInit = ({ browser, server }: { browser?: BrowserData; server?: { port: number } } = {}) => {\n    if (!browser) return undefined;\n\n    const port = server?.port || 3000;\n    const serverUrl = `http://localhost:${port}/graphql`;\n\n    const client = this.graphqlUI.createSsrClient({\n      serverUrl,\n      headers: pick(browser.connection.headers, ALLOWED_HEADERS),\n    });\n\n    const ctx: RenderContext = { client };\n    return ctx;\n  };\n\n  /**\n   * Eagerly and recursively execute all gql queries in the app.\n   * Data will be available in gqlClient.extract()\n   */\n  onBeforeRender = async (ctx: RenderContext, app: ReactNode) => {\n    await getDataFromTree(app);\n  };\n\n  serialize = (ctx?: RenderContext) => {\n    const client = ctx?.client;\n    if (!client) return undefined;\n\n    return {\n      json: JSON.stringify(client.extract()),\n    };\n  };\n\n  deserialize = (raw?: string) => {\n    if (!raw) return { state: undefined };\n    let state: NormalizedCacheObject | undefined;\n    try {\n      state = JSON.parse(raw);\n    } catch (e) {\n      // eslint-disable-next-line no-console\n      console.error('[GraphQL] failed deserializing state from DOM', e);\n    }\n\n    return { state };\n  };\n\n  private _client: ApolloClient<NormalizedCacheObject> | undefined = undefined;\n\n  browserInit = ({ state }: { state?: NormalizedCacheObject } = {}) => {\n    const { location } = window;\n    const isInsecure = location.protocol === 'http:';\n    const wsUrl = `${isInsecure ? 'ws:' : 'wss:'}//${location.host}/subscriptions`;\n\n    const client = this.graphqlUI.createClient('/graphql', { state, subscriptionUri: wsUrl });\n    this._client = client;\n\n    return { client };\n  };\n\n  getClient() {\n    if (!this._client) return this.browserInit().client;\n    return this._client;\n  }\n\n  private BrowserGqlProvider = ({ renderCtx, children }: { renderCtx?: RenderContext; children: ReactNode }) => {\n    if (!renderCtx?.client) throw new TypeError('GQL client is not initialized, make sure `.browserInit()` executes');\n\n    return <this.graphqlUI.getProvider client={renderCtx?.client}>{children}</this.graphqlUI.getProvider>;\n  };\n\n  reactContext = isBrowser ? this.BrowserGqlProvider : ServerGqlProvider;\n}\n\nfunction ServerGqlProvider({ renderCtx, children }: { renderCtx?: RenderContext; children: ReactNode }) {\n  if (!renderCtx?.client)\n    throw new TypeError('GQL client has not been initialized during SSR, make sure `.serverInit()` executes');\n\n  const { client } = renderCtx;\n  return <GraphQLProvider client={client}>{children}</GraphQLProvider>;\n}\n"],"mappings":"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"}
+{"version":3,"names":["ALLOWED_HEADERS","GraphqlRenderPlugins","constructor","graphqlUI","GraphqlAspect","id","browser","port","location","serverUrl","client","createSsrClient","headers","pick","ctx","app","getDataFromTree","undefined","json","JSON","stringify","extract","raw","state","parse","e","console","error","window","isInsecure","protocol","wsUrl","host","createClient","subscriptionUri","_client","renderCtx","children","TypeError","isBrowser","BrowserGqlProvider","ServerGqlProvider","getClient","browserInit"],"sources":["render-lifecycle.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { getDataFromTree } from '@apollo/client/react/ssr';\nimport type { ApolloClient, NormalizedCacheObject } from '@apollo/client';\nimport pick from 'lodash.pick';\n\nimport { isBrowser } from '@teambit/ui-foundation.ui.is-browser';\nimport type { SSR } from '@teambit/ui';\n\nimport type { GraphqlUI, GraphQLClient } from './graphql.ui.runtime';\nimport { GraphQLProvider } from './graphql-provider';\nimport { GraphqlAspect } from './graphql.aspect';\n\ntype RenderContext = {\n  client: GraphQLClient<any>;\n};\n\nconst ALLOWED_HEADERS = ['cookie'];\n\nexport class GraphqlRenderPlugins implements SSR.RenderPlugin<RenderContext, { state?: NormalizedCacheObject }> {\n  constructor(private graphqlUI: GraphqlUI) {}\n\n  key = GraphqlAspect.id;\n\n  serverInit = ({ browser }: SSR.SsrSession) => {\n    const port = browser?.location.port || 3000;\n    const serverUrl = `http://localhost:${port}/graphql`;\n\n    const client = this.graphqlUI.createSsrClient({\n      serverUrl,\n      headers: pick(browser?.headers, ALLOWED_HEADERS),\n    });\n\n    const ctx: RenderContext = { client };\n    return ctx;\n  };\n\n  /**\n   * Eagerly and recursively execute all gql queries in the app.\n   * Data will be available in gqlClient.extract()\n   */\n  onBeforeRender = async (ctx: RenderContext, app: ReactNode) => {\n    await getDataFromTree(app);\n  };\n\n  serialize = (ctx?: RenderContext) => {\n    const client = ctx?.client;\n    if (!client) return undefined;\n\n    return {\n      json: JSON.stringify(client.extract()),\n    };\n  };\n\n  deserialize = (raw?: string) => {\n    if (!raw) return { state: undefined };\n    let state: NormalizedCacheObject | undefined;\n    try {\n      state = JSON.parse(raw);\n    } catch (e) {\n      // eslint-disable-next-line no-console\n      console.error('[GraphQL] failed deserializing state from DOM', e);\n    }\n\n    return { state };\n  };\n\n  private _client: ApolloClient<NormalizedCacheObject> | undefined = undefined;\n\n  browserInit = ({ state }: { state?: NormalizedCacheObject } = {}) => {\n    const { location } = window;\n    const isInsecure = location.protocol === 'http:';\n    const wsUrl = `${isInsecure ? 'ws:' : 'wss:'}//${location.host}/subscriptions`;\n\n    const client = this.graphqlUI.createClient('/graphql', { state, subscriptionUri: wsUrl });\n    this._client = client;\n\n    return { client };\n  };\n\n  getClient() {\n    if (!this._client) return this.browserInit().client;\n    return this._client;\n  }\n\n  private BrowserGqlProvider = ({ renderCtx, children }: { renderCtx?: RenderContext; children: ReactNode }) => {\n    if (!renderCtx?.client) throw new TypeError('GQL client is not initialized, make sure `.browserInit()` executes');\n\n    return <this.graphqlUI.getProvider client={renderCtx?.client}>{children}</this.graphqlUI.getProvider>;\n  };\n\n  reactContext = isBrowser ? this.BrowserGqlProvider : ServerGqlProvider;\n}\n\nfunction ServerGqlProvider({ renderCtx, children }: { renderCtx?: RenderContext; children: ReactNode }) {\n  if (!renderCtx?.client)\n    throw new TypeError('GQL client has not been initialized during SSR, make sure `.serverInit()` executes');\n\n  const { client } = renderCtx;\n  return <GraphQLProvider client={client}>{children}</GraphQLProvider>;\n}\n"],"mappings":"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"}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/graphql",
-  "version": "0.0.802",
+  "version": "0.0.803",
   "homepage": "https://bit.dev/teambit/harmony/graphql",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.harmony",
     "name": "graphql",
-    "version": "0.0.802"
+    "version": "0.0.803"
   },
   "dependencies": {
     "@graphql-modules/core": "0.7.17",
@@ -32,10 +32,10 @@
     "@babel/runtime": "7.12.18",
     "core-js": "^3.0.0",
     "@teambit/harmony": "0.3.3",
-    "@teambit/cli": "0.0.534",
-    "@teambit/logger": "0.0.627",
+    "@teambit/cli": "0.0.535",
+    "@teambit/logger": "0.0.628",
     "@teambit/toolbox.network.get-port": "0.0.113",
-    "@teambit/ui": "0.0.802",
+    "@teambit/ui": "0.0.803",
     "@teambit/ui-foundation.ui.is-browser": "0.0.486"
   },
   "devDependencies": {
@@ -53,7 +53,7 @@
   "peerDependencies": {
     "@apollo/client": "^3.0.0",
     "graphql": "14.7.0",
-    "@teambit/legacy": "1.0.316",
+    "@teambit/legacy": "1.0.317",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },

package/{preview-1659151732866.js → preview-1659271062546.js}

@@ -1,5 +1,5 @@
-import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.harmony_graphql@0.0.802/dist/graphql.composition.js';
-import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.harmony_graphql@0.0.802/dist/graphql.docs.mdx';
+import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.harmony_graphql@0.0.803/dist/graphql.composition.js';
+import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.harmony_graphql@0.0.803/dist/graphql.docs.mdx';
 
 export const compositions = [compositions_0];
 export const overview = [overview_0];

package/render-lifecycle.tsx

@@ -4,10 +4,11 @@ import type { ApolloClient, NormalizedCacheObject } from '@apollo/client';
 import pick from 'lodash.pick';
 
 import { isBrowser } from '@teambit/ui-foundation.ui.is-browser';
-import type { BrowserData, RenderPlugins } from '@teambit/ui';
+import type { SSR } from '@teambit/ui';
 
 import type { GraphqlUI, GraphQLClient } from './graphql.ui.runtime';
 import { GraphQLProvider } from './graphql-provider';
+import { GraphqlAspect } from './graphql.aspect';
 
 type RenderContext = {
   client: GraphQLClient<any>;
@@ -15,18 +16,18 @@ type RenderContext = {
 
 const ALLOWED_HEADERS = ['cookie'];
 
-export class GraphqlRenderPlugins implements RenderPlugins<RenderContext, { state?: NormalizedCacheObject }> {
+export class GraphqlRenderPlugins implements SSR.RenderPlugin<RenderContext, { state?: NormalizedCacheObject }> {
   constructor(private graphqlUI: GraphqlUI) {}
 
-  serverInit = ({ browser, server }: { browser?: BrowserData; server?: { port: number } } = {}) => {
-    if (!browser) return undefined;
+  key = GraphqlAspect.id;
 
-    const port = server?.port || 3000;
+  serverInit = ({ browser }: SSR.SsrSession) => {
+    const port = browser?.location.port || 3000;
     const serverUrl = `http://localhost:${port}/graphql`;
 
     const client = this.graphqlUI.createSsrClient({
       serverUrl,
-      headers: pick(browser.connection.headers, ALLOWED_HEADERS),
+      headers: pick(browser?.headers, ALLOWED_HEADERS),
     });
 
     const ctx: RenderContext = { client };