relay-runtime 10.0.1 → 10.1.3

package/store/RelayResponseNormalizer.js.flow

@@ -16,6 +16,7 @@ const RelayFeatureFlags = require('../util/RelayFeatureFlags');
 const RelayModernRecord = require('./RelayModernRecord');
 const RelayProfiler = require('../util/RelayProfiler');
 
+const areEqual = require('areEqual');
 const invariant = require('invariant');
 const warning = require('warning');
 
@@ -23,6 +24,7 @@ const {
   CONDITION,
   CLIENT_EXTENSION,
   DEFER,
+  FLIGHT_FIELD,
   INLINE_FRAGMENT,
   LINKED_FIELD,
   LINKED_HANDLE,
@@ -34,6 +36,12 @@ const {
 } = require('../util/RelayConcreteNode');
 const {generateClientID, isClientID} = require('./ClientID');
 const {createNormalizationSelector} = require('./RelayModernSelector');
+const {
+  refineToReactFlightPayloadData,
+  REACT_FLIGHT_QUERIES_STORAGE_KEY,
+  REACT_FLIGHT_TREE_STORAGE_KEY,
+  REACT_FLIGHT_TYPE_NAME,
+} = require('./RelayStoreReactFlightUtils');
 const {
   getArgumentValues,
   getHandleStorageKey,
@@ -42,12 +50,14 @@ const {
   getStorageKey,
   TYPENAME_KEY,
   ROOT_ID,
+  ROOT_TYPE,
 } = require('./RelayStoreUtils');
 const {generateTypeID, TYPE_SCHEMA_TYPE} = require('./TypeID');
 
 import type {PayloadData} from '../network/RelayNetworkTypes';
 import type {
   NormalizationDefer,
+  NormalizationFlightField,
   NormalizationLinkedField,
   NormalizationModuleImport,
   NormalizationNode,
@@ -61,6 +71,8 @@ import type {
   ModuleImportPayload,
   MutableRecordSource,
   NormalizationSelector,
+  ReactFlightReachableQuery,
+  ReactFlightPayloadDeserializer,
   Record,
   RelayResponsePayload,
 } from './RelayStoreTypes';
@@ -74,6 +86,7 @@ export type NormalizationOptions = {|
   +getDataID: GetDataID,
   +treatMissingFieldsAsNull: boolean,
   +path?: $ReadOnlyArray<string>,
+  +reactFlightPayloadDeserializer?: ?ReactFlightPayloadDeserializer,
 |};
 
 /**
@@ -111,6 +124,7 @@ class RelayResponseNormalizer {
   _path: Array<string>;
   _recordSource: MutableRecordSource;
   _variables: Variables;
+  _reactFlightPayloadDeserializer: ?ReactFlightPayloadDeserializer;
 
   constructor(
     recordSource: MutableRecordSource,
@@ -127,6 +141,8 @@ class RelayResponseNormalizer {
     this._path = options.path ? [...options.path] : [];
     this._recordSource = recordSource;
     this._variables = variables;
+    this._reactFlightPayloadDeserializer =
+      options.reactFlightPayloadDeserializer;
   }
 
   normalizeResponse(
@@ -277,6 +293,13 @@ class RelayResponseNormalizer {
           this._traverseSelections(selection, record, data);
           this._isClientExtension = isClientExtension;
           break;
+        case FLIGHT_FIELD:
+          if (RelayFeatureFlags.ENABLE_REACT_FLIGHT_COMPONENT_FIELD) {
+            this._normalizeFlightField(node, selection, record, data);
+          } else {
+            throw new Error('Flight fields are not yet supported.');
+          }
+          break;
         default:
           (selection: empty);
           invariant(
@@ -441,23 +464,27 @@ class RelayResponseNormalizer {
           return;
         }
       }
-      if (selection.kind === SCALAR_FIELD && __DEV__) {
-        this._validateConflictingFieldsWithIdenticalId(
-          record,
-          storageKey,
-          fieldValue,
-        );
+      if (__DEV__) {
+        if (selection.kind === SCALAR_FIELD) {
+          this._validateConflictingFieldsWithIdenticalId(
+            record,
+            storageKey,
+            fieldValue,
+          );
+        }
       }
       RelayModernRecord.setValue(record, storageKey, null);
       return;
     }
 
     if (selection.kind === SCALAR_FIELD) {
-      this._validateConflictingFieldsWithIdenticalId(
-        record,
-        storageKey,
-        fieldValue,
-      );
+      if (__DEV__) {
+        this._validateConflictingFieldsWithIdenticalId(
+          record,
+          storageKey,
+          fieldValue,
+        );
+      }
       RelayModernRecord.setValue(record, storageKey, fieldValue);
     } else if (selection.kind === LINKED_FIELD) {
       this._path.push(responseKey);
@@ -477,6 +504,84 @@ class RelayResponseNormalizer {
     }
   }
 
+  _normalizeFlightField(
+    parent: NormalizationNode,
+    selection: NormalizationFlightField,
+    record: Record,
+    data: PayloadData,
+  ) {
+    const responseKey = selection.alias || selection.name;
+    const storageKey = getStorageKey(selection, this._variables);
+    const fieldValue = data[responseKey];
+
+    if (fieldValue == null) {
+      RelayModernRecord.setValue(record, storageKey, null);
+      return;
+    }
+
+    const reactFlightPayload = refineToReactFlightPayloadData(fieldValue);
+
+    invariant(
+      reactFlightPayload != null,
+      'RelayResponseNormalizer(): Expected React Flight payload data ' +
+        'to be an object with `tree` and `queries` properties, got `%s`.',
+      fieldValue,
+    );
+    invariant(
+      typeof this._reactFlightPayloadDeserializer === 'function',
+      'RelayResponseNormalizer: Expected reactFlightPayloadDeserializer to ' +
+        'be a function, got `%s`.',
+      this._reactFlightPayloadDeserializer,
+    );
+
+    // We store the deserialized reactFlightClientResponse in a separate
+    // record and link it to the parent record. This is so we can GC the Flight
+    // tree later even if the parent record is still reachable.
+    const reactFlightClientResponse = this._reactFlightPayloadDeserializer(
+      reactFlightPayload.tree,
+    );
+    const reactFlightID = generateClientID(
+      RelayModernRecord.getDataID(record),
+      getStorageKey(selection, this._variables),
+    );
+    let reactFlightClientResponseRecord = this._recordSource.get(reactFlightID);
+    if (reactFlightClientResponseRecord == null) {
+      reactFlightClientResponseRecord = RelayModernRecord.create(
+        reactFlightID,
+        REACT_FLIGHT_TYPE_NAME,
+      );
+      this._recordSource.set(reactFlightID, reactFlightClientResponseRecord);
+    }
+    RelayModernRecord.setValue(
+      reactFlightClientResponseRecord,
+      REACT_FLIGHT_TREE_STORAGE_KEY,
+      reactFlightClientResponse,
+    );
+    const reachableQueries: Array<ReactFlightReachableQuery> = [];
+    for (const query of reactFlightPayload.queries) {
+      if (query.response.data != null) {
+        this._moduleImportPayloads.push({
+          data: query.response.data,
+          dataID: ROOT_ID,
+          operationReference: query.module,
+          path: [],
+          typeName: ROOT_TYPE,
+          variables: query.variables,
+        });
+      }
+      reachableQueries.push({
+        module: query.module,
+        variables: query.variables,
+      });
+    }
+    RelayModernRecord.setValue(
+      reactFlightClientResponseRecord,
+      REACT_FLIGHT_QUERIES_STORAGE_KEY,
+      reachableQueries,
+    );
+    RelayModernRecord.setLinkedRecordID(record, storageKey, reactFlightID);
+  }
+
   _normalizeLink(
     field: NormalizationLinkedField,
     record: Record,
@@ -582,13 +687,17 @@ class RelayResponseNormalizer {
       } else if (__DEV__) {
         this._validateRecordType(nextRecord, field, item);
       }
-      if (prevIDs && __DEV__) {
-        this._validateConflictingLinkedFieldsWithIdenticalId(
-          record,
-          prevIDs[nextIndex],
-          nextID,
-          storageKey,
-        );
+      // NOTE: the check to strip __DEV__ code only works for simple
+      // `if (__DEV__)`
+      if (__DEV__) {
+        if (prevIDs) {
+          this._validateConflictingLinkedFieldsWithIdenticalId(
+            record,
+            prevIDs[nextIndex],
+            nextID,
+            storageKey,
+          );
+        }
       }
       // $FlowFixMe[incompatible-variance]
       this._traverseSelections(field, nextRecord, item);
@@ -629,13 +738,14 @@ class RelayResponseNormalizer {
     storageKey: string,
     fieldValue: mixed,
   ): void {
+    // NOTE: Only call this function in DEV
     if (__DEV__) {
       const dataID = RelayModernRecord.getDataID(record);
       var previousValue = RelayModernRecord.getValue(record, storageKey);
       warning(
         storageKey === TYPENAME_KEY ||
           previousValue === undefined ||
-          previousValue === fieldValue,
+          areEqual(previousValue, fieldValue),
         'RelayResponseNormalizer: Invalid record. The record contains two ' +
           'instances of the same id: `%s` with conflicting field, %s and its values: %s and %s. ' +
           'If two fields are different but share ' +
@@ -657,6 +767,7 @@ class RelayResponseNormalizer {
     nextID: DataID,
     storageKey: string,
   ): void {
+    // NOTE: Only call this function in DEV
     if (__DEV__) {
       warning(
         prevID === undefined || prevID === nextID,

package/store/RelayStoreReactFlightUtils.js.flow

@@ -0,0 +1,64 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ * @format
+ */
+
+// flowlint ambiguous-object-type:error
+
+'use strict';
+
+const invariant = require('invariant');
+
+const {getType} = require('./RelayModernRecord');
+
+import type {ReactFlightPayloadData} from '../network/RelayNetworkTypes';
+import type {ReactFlightClientResponse, Record} from './RelayStoreTypes';
+
+const REACT_FLIGHT_QUERIES_STORAGE_KEY = 'queries';
+const REACT_FLIGHT_TREE_STORAGE_KEY = 'tree';
+const REACT_FLIGHT_TYPE_NAME = 'ReactFlightComponent';
+
+function refineToReactFlightPayloadData(
+  payload: mixed,
+): ?ReactFlightPayloadData {
+  if (
+    payload == null ||
+    typeof payload !== 'object' ||
+    !Array.isArray(payload.tree) ||
+    !Array.isArray(payload.queries)
+  ) {
+    return null;
+  }
+  return (payload: $FlowFixMe);
+}
+
+function getReactFlightClientResponse(
+  record: Record,
+): ?ReactFlightClientResponse {
+  invariant(
+    getType(record) === REACT_FLIGHT_TYPE_NAME,
+    'getReactFlightClientResponse(): Expected a ReactFlightComponentRecord, ' +
+      'got %s.',
+    record,
+  );
+  const response: ?ReactFlightClientResponse = (record[
+    REACT_FLIGHT_TREE_STORAGE_KEY
+  ]: $FlowFixMe);
+  if (response != null) {
+    return response;
+  }
+  return null;
+}
+
+module.exports = {
+  REACT_FLIGHT_QUERIES_STORAGE_KEY,
+  REACT_FLIGHT_TREE_STORAGE_KEY,
+  REACT_FLIGHT_TYPE_NAME,
+  getReactFlightClientResponse,
+  refineToReactFlightPayloadData,
+};

package/store/RelayStoreSubscriptions.js.flow

@@ -0,0 +1,168 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+// flowlint ambiguous-object-type:error
+
+'use strict';
+
+const RelayReader = require('./RelayReader');
+
+const deepFreeze = require('../util/deepFreeze');
+const hasOverlappingIDs = require('./hasOverlappingIDs');
+const isEmptyObject = require('../util/isEmptyObject');
+const recycleNodesInto = require('../util/recycleNodesInto');
+
+import type {Disposable} from '../util/RelayRuntimeTypes';
+import type {
+  RecordSource,
+  RequestDescriptor,
+  Snapshot,
+  StoreSubscriptions,
+  UpdatedRecords,
+} from './RelayStoreTypes';
+
+type Subscription = {|
+  callback: (snapshot: Snapshot) => void,
+  snapshot: Snapshot,
+  stale: boolean,
+  backup: ?Snapshot,
+|};
+
+class RelayStoreSubscriptions implements StoreSubscriptions {
+  _subscriptions: Set<Subscription>;
+
+  constructor() {
+    this._subscriptions = new Set();
+  }
+
+  subscribe(
+    snapshot: Snapshot,
+    callback: (snapshot: Snapshot) => void,
+  ): Disposable {
+    const subscription = {backup: null, callback, snapshot, stale: false};
+    const dispose = () => {
+      this._subscriptions.delete(subscription);
+    };
+    this._subscriptions.add(subscription);
+    return {dispose};
+  }
+
+  snapshotSubscriptions(source: RecordSource) {
+    this._subscriptions.forEach(subscription => {
+      // Backup occurs after writing a new "final" payload(s) and before (re)applying
+      // optimistic changes. Each subscription's `snapshot` represents what was *last
+      // published to the subscriber*, which notably may include previous optimistic
+      // updates. Therefore a subscription can be in any of the following states:
+      // - stale=true: This subscription was restored to a different value than
+      //   `snapshot`. That means this subscription has changes relative to its base,
+      //   but its base has changed (we just applied a final payload): recompute
+      //   a backup so that we can later restore to the state the subscription
+      //   should be in.
+      // - stale=false: This subscription was restored to the same value than
+      //   `snapshot`. That means this subscription does *not* have changes relative
+      //   to its base, so the current `snapshot` is valid to use as a backup.
+      if (!subscription.stale) {
+        subscription.backup = subscription.snapshot;
+        return;
+      }
+      const snapshot = subscription.snapshot;
+      const backup = RelayReader.read(source, snapshot.selector);
+      const nextData = recycleNodesInto(snapshot.data, backup.data);
+      (backup: $FlowFixMe).data = nextData; // backup owns the snapshot and can safely mutate
+      subscription.backup = backup;
+    });
+  }
+
+  restoreSubscriptions() {
+    this._subscriptions.forEach(subscription => {
+      const backup = subscription.backup;
+      subscription.backup = null;
+      if (backup) {
+        if (backup.data !== subscription.snapshot.data) {
+          subscription.stale = true;
+        }
+        subscription.snapshot = {
+          data: subscription.snapshot.data,
+          isMissingData: backup.isMissingData,
+          seenRecords: backup.seenRecords,
+          selector: backup.selector,
+          missingRequiredFields: backup.missingRequiredFields,
+        };
+      } else {
+        subscription.stale = true;
+      }
+    });
+  }
+
+  updateSubscriptions(
+    source: RecordSource,
+    updatedRecordIDs: UpdatedRecords,
+    updatedOwners: Array<RequestDescriptor>,
+  ) {
+    const hasUpdatedRecords = !isEmptyObject(updatedRecordIDs);
+    this._subscriptions.forEach(subscription => {
+      const owner = this._updateSubscription(
+        source,
+        subscription,
+        updatedRecordIDs,
+        hasUpdatedRecords,
+      );
+      if (owner != null) {
+        updatedOwners.push(owner);
+      }
+    });
+  }
+
+  /**
+   * Notifies the callback for the subscription if the data for the associated
+   * snapshot has changed.
+   * Additionally, updates the subscription snapshot with the latest snapshot,
+   * and marks it as not stale.
+   * Returns the owner (RequestDescriptor) if the subscription was affected by the
+   * latest update, or null if it was not affected.
+   */
+  _updateSubscription(
+    source: RecordSource,
+    subscription: Subscription,
+    updatedRecordIDs: UpdatedRecords,
+    hasUpdatedRecords: boolean,
+  ): ?RequestDescriptor {
+    const {backup, callback, snapshot, stale} = subscription;
+    const hasOverlappingUpdates =
+      hasUpdatedRecords &&
+      hasOverlappingIDs(snapshot.seenRecords, updatedRecordIDs);
+    if (!stale && !hasOverlappingUpdates) {
+      return;
+    }
+    let nextSnapshot: Snapshot =
+      hasOverlappingUpdates || !backup
+        ? RelayReader.read(source, snapshot.selector)
+        : backup;
+    const nextData = recycleNodesInto(snapshot.data, nextSnapshot.data);
+    nextSnapshot = ({
+      data: nextData,
+      isMissingData: nextSnapshot.isMissingData,
+      seenRecords: nextSnapshot.seenRecords,
+      selector: nextSnapshot.selector,
+      missingRequiredFields: nextSnapshot.missingRequiredFields,
+    }: Snapshot);
+    if (__DEV__) {
+      deepFreeze(nextSnapshot);
+    }
+    subscription.snapshot = nextSnapshot;
+    subscription.stale = false;
+    if (nextSnapshot.data !== snapshot.data) {
+      callback(nextSnapshot);
+      return snapshot.selector.owner;
+    }
+  }
+}
+
+module.exports = RelayStoreSubscriptions;