From 82864256f7feddaa2094cd6ac9c440ac43968f92 Mon Sep 17 00:00:00 2001
From: Hannan Ebrahimi Sotoudeh <hannanstd@gmail.com>
Date: Wed, 28 Feb 2024 20:13:41 +0100
Subject: [PATCH] chore: added environment.configName to getRequestCacheKey

---
 .../react-relay/ReactRelayQueryRenderer.js    |  8 ++-
 .../__tests__/ReactRelayQueryRenderer-test.js | 64 +++++++++++++++++++
 .../MultiActorEnvironmentTypes.js             |  6 --
 .../relay-runtime/store/RelayStoreTypes.js    |  6 ++
 4 files changed, 75 insertions(+), 9 deletions(-)

diff --git a/packages/react-relay/ReactRelayQueryRenderer.js b/packages/react-relay/ReactRelayQueryRenderer.js
index 1f623ee83ae83..0caf98348d889 100644
--- a/packages/react-relay/ReactRelayQueryRenderer.js
+++ b/packages/react-relay/ReactRelayQueryRenderer.js
@@ -116,7 +116,7 @@ class ReactRelayQueryRenderer extends React.Component<Props, State> {
       const {query} = props;
 
       const request = getRequest(query);
-      requestCacheKey = getRequestCacheKey(request.params, props.variables);
+      requestCacheKey = getRequestCacheKey(request.params, props.variables, props.environment?.configName);
       queryFetcher = requestCache[requestCacheKey]
         ? requestCache[requestCacheKey].queryFetcher
         : new ReactRelayQueryFetcher();
@@ -329,9 +329,11 @@ function getRenderProps(
 function getRequestCacheKey(
   request: RequestParameters,
   variables: Variables,
+  configName: ?string
 ): string {
   return JSON.stringify({
     id: request.cacheID ? request.cacheID : request.id,
+    configName: configName || null,
     variables,
   });
 }
@@ -349,7 +351,7 @@ function resetQueryStateForUpdate(
   let queryFetcher;
   if (query) {
     const request = getRequest(query);
-    const requestCacheKey = getRequestCacheKey(request.params, props.variables);
+    const requestCacheKey = getRequestCacheKey(request.params, props.variables, props.environment?.configName);
     queryFetcher = requestCache[requestCacheKey]
       ? requestCache[requestCacheKey].queryFetcher
       : new ReactRelayQueryFetcher(prevSelectionReferences);
@@ -436,7 +438,7 @@ function fetchQueryAndComputeStateFromProps(
 
       // cache the request to avoid duplicate requests
       requestCacheKey =
-        requestCacheKey || getRequestCacheKey(request.params, props.variables);
+        requestCacheKey || getRequestCacheKey(request.params, props.variables, props.environment?.configName);
       requestCache[requestCacheKey] = {queryFetcher, snapshot};
 
       if (!snapshot) {
diff --git a/packages/react-relay/__tests__/ReactRelayQueryRenderer-test.js b/packages/react-relay/__tests__/ReactRelayQueryRenderer-test.js
index 8f9ee6f36907f..18934766ae9ee 100644
--- a/packages/react-relay/__tests__/ReactRelayQueryRenderer-test.js
+++ b/packages/react-relay/__tests__/ReactRelayQueryRenderer-test.js
@@ -1210,6 +1210,70 @@ describe('ReactRelayQueryRenderer', () => {
     });
   });
 
+  describe('when two constructors fire with different environments', () => {
+    it('fetches the first query only, when `configName`s are the same', () => {
+      const environmentA = createMockEnvironment();
+      const environmentB = createMockEnvironment();
+      class Example extends React.Component {
+        render() {
+          return (
+            <React.Fragment>
+              <ReactRelayQueryRenderer
+                query={TestQuery}
+                cacheConfig={cacheConfig}
+                environment={environmentA}
+                render={render}
+                variables={variables}
+              />
+              <ReactRelayQueryRenderer
+                query={TestQuery}
+                cacheConfig={cacheConfig}
+                environment={environmentB}
+                render={render}
+                variables={variables}
+              />
+            </React.Fragment>
+          );
+        }
+      }
+      ReactTestRenderer.create(<Example />);
+      expect.assertions(2);
+      expect(environmentA.execute).toBeCalledTimes(1);
+      expect(environmentB.execute).toBeCalledTimes(0);
+    });
+
+    it('fetches both queries, when `configName`s are different', () => {
+      const environmentA = createMockEnvironment({ configName: 'A' });
+      const environmentB = createMockEnvironment({ configName: 'B' });
+      class Example extends React.Component {
+        render() {
+          return (
+            <React.Fragment>
+              <ReactRelayQueryRenderer
+                query={TestQuery}
+                cacheConfig={cacheConfig}
+                environment={environmentA}
+                render={render}
+                variables={variables}
+              />
+              <ReactRelayQueryRenderer
+                query={TestQuery}
+                cacheConfig={cacheConfig}
+                environment={environmentB}
+                render={render}
+                variables={variables}
+              />
+            </React.Fragment>
+          );
+        }
+      }
+      ReactTestRenderer.create(<Example />);
+      expect.assertions(2);
+      expect(environmentA.execute).toBeCalledTimes(1);
+      expect(environmentB.execute).toBeCalledTimes(1);
+    });
+  });
+
   describe('when the fetch succeeds', () => {
     beforeEach(() => {
       ReactTestRenderer.create(
diff --git a/packages/relay-runtime/multi-actor-environment/MultiActorEnvironmentTypes.js b/packages/relay-runtime/multi-actor-environment/MultiActorEnvironmentTypes.js
index aba40ae6802e8..7ec6c7cea9c09 100644
--- a/packages/relay-runtime/multi-actor-environment/MultiActorEnvironmentTypes.js
+++ b/packages/relay-runtime/multi-actor-environment/MultiActorEnvironmentTypes.js
@@ -57,12 +57,6 @@ export interface IActorEnvironment extends IEnvironment {
    * TODO: this needs to move the the MultiActorEnvironment with different API.
    */
   getPublishQueue(): RelayPublishQueue;
-
-  /**
-   * Optional. A human-readable identifier of the environment.
-   * This value should be visible in the dev tools.
-   */
-  +configName: ?string;
 }
 
 /**
diff --git a/packages/relay-runtime/store/RelayStoreTypes.js b/packages/relay-runtime/store/RelayStoreTypes.js
index 3a1287dcb1628..f464fb72ebaf2 100644
--- a/packages/relay-runtime/store/RelayStoreTypes.js
+++ b/packages/relay-runtime/store/RelayStoreTypes.js
@@ -958,6 +958,12 @@ export interface IEnvironment {
    * with `@required(action: LOG)`.
    */
   relayFieldLogger: RelayFieldLogger;
+
+  /**
+   * Optional. A human-readable identifier of the environment.
+   * This value should be visible in the dev tools.
+   */
+  +configName: ?string;
 }
 
 /**