relay-runtime 20.1.1 → 21.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (334) hide show
  1. package/experimental.d.ts +34 -0
  2. package/experimental.js +1 -1
  3. package/experimental.js.flow +11 -11
  4. package/handlers/RelayDefaultHandlerProvider.d.ts +12 -0
  5. package/handlers/connection/ConnectionHandler.d.ts +51 -0
  6. package/handlers/connection/ConnectionHandler.js.flow +5 -5
  7. package/handlers/connection/ConnectionInterface.d.ts +40 -0
  8. package/handlers/connection/ConnectionInterface.js.flow +1 -1
  9. package/handlers/connection/MutationHandlers.d.ts +17 -0
  10. package/index.d.ts +274 -0
  11. package/index.js +1 -1
  12. package/index.js.flow +125 -62
  13. package/lib/experimental.js +3 -3
  14. package/lib/index.js +105 -57
  15. package/lib/multi-actor-environment/ActorIdentifier.js +2 -2
  16. package/lib/multi-actor-environment/MultiActorEnvironment.js +3 -1
  17. package/lib/mutations/commitMutation.js +8 -8
  18. package/lib/mutations/validateMutation.js +4 -4
  19. package/lib/query/GraphQLTag.js +3 -3
  20. package/lib/query/fetchQuery.js +15 -3
  21. package/lib/store/DataChecker.js +38 -4
  22. package/lib/store/NormalizationEngine.js +373 -0
  23. package/lib/store/OperationExecutor.js +172 -113
  24. package/lib/store/RelayConcreteVariables.js +1 -1
  25. package/lib/store/RelayErrorTrie.js +2 -2
  26. package/lib/store/RelayExperimentalGraphResponseTransform.js +8 -8
  27. package/lib/store/RelayModernEnvironment.js +26 -19
  28. package/lib/store/RelayModernRecord.js +18 -8
  29. package/lib/store/RelayModernSelector.js +9 -9
  30. package/lib/store/RelayModernStore.js +152 -43
  31. package/lib/store/RelayPublishQueue.js +1 -1
  32. package/lib/store/RelayReader.js +76 -38
  33. package/lib/store/RelayRecordSource.js +6 -0
  34. package/lib/store/RelayReferenceMarker.js +2 -1
  35. package/lib/store/RelayResponseNormalizer.js +88 -55
  36. package/lib/store/RelayStoreSubscriptions.js +34 -10
  37. package/lib/store/RelayStoreUtils.js +8 -1
  38. package/lib/store/ResolverFragments.js +2 -2
  39. package/lib/store/live-resolvers/LiveResolverCache.js +25 -9
  40. package/lib/store/observeFragmentExperimental.js +17 -1
  41. package/lib/store/observeQueryExperimental.js +2 -2
  42. package/lib/subscription/requestSubscription.js +3 -3
  43. package/lib/util/RelayError.js +3 -0
  44. package/lib/util/RelayFeatureFlags.js +6 -2
  45. package/lib/util/RelayReplaySubject.js +4 -4
  46. package/lib/util/handlePotentialSnapshotErrors.js +2 -2
  47. package/lib/util/stableCopy.js +2 -2
  48. package/llm-docs/api-reference/entrypoint-apis/entrypoint-container.mdx +38 -0
  49. package/llm-docs/api-reference/entrypoint-apis/load-entrypoint.mdx +77 -0
  50. package/llm-docs/api-reference/entrypoint-apis/use-entrypoint-loader.mdx +99 -0
  51. package/llm-docs/api-reference/graphql/graphql-directives.mdx +378 -0
  52. package/llm-docs/api-reference/hooks/_use-lazy-load-query-extra.mdx +16 -0
  53. package/llm-docs/api-reference/hooks/load-query.mdx +84 -0
  54. package/llm-docs/api-reference/hooks/relay-environment-provider.mdx +78 -0
  55. package/llm-docs/api-reference/hooks/use-client-query.mdx +65 -0
  56. package/llm-docs/api-reference/hooks/use-fragment.mdx +69 -0
  57. package/llm-docs/api-reference/hooks/use-lazy-load-query.mdx +62 -0
  58. package/llm-docs/api-reference/hooks/use-mutation.mdx +94 -0
  59. package/llm-docs/api-reference/hooks/use-pagination-fragment.mdx +166 -0
  60. package/llm-docs/api-reference/hooks/use-prefetchable-forward-pagination-fragment.mdx +134 -0
  61. package/llm-docs/api-reference/hooks/use-preloaded-query.mdx +84 -0
  62. package/llm-docs/api-reference/hooks/use-query-loader.mdx +95 -0
  63. package/llm-docs/api-reference/hooks/use-refetchable-fragment.mdx +122 -0
  64. package/llm-docs/api-reference/hooks/use-relay-environment.mdx +37 -0
  65. package/llm-docs/api-reference/hooks/use-subscription.mdx +66 -0
  66. package/llm-docs/api-reference/relay-resolvers/docblock-format.mdx +321 -0
  67. package/llm-docs/api-reference/relay-resolvers/runtime-functions.mdx +94 -0
  68. package/llm-docs/api-reference/relay-runtime/commit-mutation.mdx +65 -0
  69. package/llm-docs/api-reference/relay-runtime/fetch-query.mdx +118 -0
  70. package/llm-docs/api-reference/relay-runtime/field-logger.mdx +170 -0
  71. package/llm-docs/api-reference/relay-runtime/observe-fragment.mdx +92 -0
  72. package/llm-docs/api-reference/relay-runtime/relay-environment.mdx +53 -0
  73. package/llm-docs/api-reference/relay-runtime/request-subscription.mdx +54 -0
  74. package/llm-docs/api-reference/relay-runtime/runtime-configuration.mdx +52 -0
  75. package/llm-docs/api-reference/relay-runtime/store.mdx +734 -0
  76. package/llm-docs/api-reference/relay-runtime/wait-for-fragment-data.mdx +89 -0
  77. package/llm-docs/api-reference/types/CacheConfig.mdx +8 -0
  78. package/llm-docs/api-reference/types/Disposable.mdx +4 -0
  79. package/llm-docs/api-reference/types/GraphQLSubscriptionConfig.mdx +17 -0
  80. package/llm-docs/api-reference/types/MutationConfig.mdx +31 -0
  81. package/llm-docs/api-reference/types/SelectorStoreUpdater.mdx +6 -0
  82. package/llm-docs/api-reference/types/UploadableMap.mdx +3 -0
  83. package/llm-docs/community/learning-resources.mdx +64 -0
  84. package/llm-docs/debugging/declarative-mutation-directives.mdx +34 -0
  85. package/llm-docs/debugging/disallowed-id-types-error.mdx +43 -0
  86. package/llm-docs/debugging/inconsistent-typename-error.mdx +47 -0
  87. package/llm-docs/debugging/relay-devtools.mdx +73 -0
  88. package/llm-docs/debugging/why-null.mdx +116 -0
  89. package/llm-docs/editor-support.mdx +55 -0
  90. package/llm-docs/error-reference/unknown-field.mdx +36 -0
  91. package/llm-docs/getting-started/babel-plugin.mdx +31 -0
  92. package/llm-docs/getting-started/compiler-config.mdx +25 -0
  93. package/llm-docs/getting-started/compiler.mdx +98 -0
  94. package/llm-docs/getting-started/lint-rules.mdx +87 -0
  95. package/llm-docs/getting-started/production.mdx +30 -0
  96. package/llm-docs/getting-started/quick-start.mdx +216 -0
  97. package/llm-docs/glossary/glossary.mdx +1040 -0
  98. package/llm-docs/guided-tour/list-data/advanced-pagination.mdx +157 -0
  99. package/llm-docs/guided-tour/list-data/connections.mdx +81 -0
  100. package/llm-docs/guided-tour/list-data/pagination.mdx +193 -0
  101. package/llm-docs/guided-tour/list-data/rendering-connections.mdx +112 -0
  102. package/llm-docs/guided-tour/list-data/streaming-pagination.mdx +87 -0
  103. package/llm-docs/guided-tour/managing-data-outside-react/retaining-queries.mdx +51 -0
  104. package/llm-docs/guided-tour/refetching/refetching-queries-with-different-data.mdx +337 -0
  105. package/llm-docs/guided-tour/refetching/refreshing-queries.mdx +350 -0
  106. package/llm-docs/guided-tour/rendering/environment.mdx +59 -0
  107. package/llm-docs/guided-tour/rendering/error-states.mdx +295 -0
  108. package/llm-docs/guided-tour/rendering/fragments.mdx +354 -0
  109. package/llm-docs/guided-tour/rendering/loading-states.mdx +245 -0
  110. package/llm-docs/guided-tour/rendering/queries.mdx +261 -0
  111. package/llm-docs/guided-tour/rendering/variables.mdx +233 -0
  112. package/llm-docs/guided-tour/reusing-cached-data/fetch-policies.mdx +56 -0
  113. package/llm-docs/guided-tour/reusing-cached-data/filling-in-missing-data.mdx +102 -0
  114. package/llm-docs/guided-tour/reusing-cached-data/introduction.mdx +22 -0
  115. package/llm-docs/guided-tour/reusing-cached-data/presence-of-data.mdx +93 -0
  116. package/llm-docs/guided-tour/reusing-cached-data/rendering-partially-cached-data.mdx +175 -0
  117. package/llm-docs/guided-tour/reusing-cached-data/staleness-of-data.mdx +116 -0
  118. package/llm-docs/guided-tour/updating-data/client-only-data.mdx +115 -0
  119. package/llm-docs/guided-tour/updating-data/graphql-mutations.mdx +334 -0
  120. package/llm-docs/guided-tour/updating-data/graphql-subscriptions.mdx +279 -0
  121. package/llm-docs/guided-tour/updating-data/imperatively-modifying-linked-fields.mdx +511 -0
  122. package/llm-docs/guided-tour/updating-data/imperatively-modifying-store-data-legacy.mdx +142 -0
  123. package/llm-docs/guided-tour/updating-data/imperatively-modifying-store-data.mdx +275 -0
  124. package/llm-docs/guided-tour/updating-data/introduction.mdx +25 -0
  125. package/llm-docs/guided-tour/updating-data/local-data-updates.mdx +71 -0
  126. package/llm-docs/guided-tour/updating-data/typesafe-updaters-faq.mdx +83 -0
  127. package/llm-docs/guided-tour/updating-data/updating-connections.mdx +592 -0
  128. package/llm-docs/guides/alias-directive.mdx +160 -0
  129. package/llm-docs/guides/catch-directive.mdx +167 -0
  130. package/llm-docs/guides/client-schema-extensions.mdx +208 -0
  131. package/llm-docs/guides/codemods.mdx +79 -0
  132. package/llm-docs/guides/data-driven-dependencies/client-3d.mdx +255 -0
  133. package/llm-docs/guides/data-driven-dependencies/configuration.mdx +127 -0
  134. package/llm-docs/guides/data-driven-dependencies/introduction.mdx +39 -0
  135. package/llm-docs/guides/data-driven-dependencies/server-3d.mdx +664 -0
  136. package/llm-docs/guides/document-comparison.mdx +106 -0
  137. package/llm-docs/guides/graphql-server-specification.mdx +453 -0
  138. package/llm-docs/guides/network-layer.mdx +69 -0
  139. package/llm-docs/guides/persisted-queries.mdx +328 -0
  140. package/llm-docs/guides/relay-resolvers/context.mdx +99 -0
  141. package/llm-docs/guides/relay-resolvers/defining-fields.mdx +151 -0
  142. package/llm-docs/guides/relay-resolvers/defining-types.mdx +164 -0
  143. package/llm-docs/guides/relay-resolvers/deprecated.mdx +27 -0
  144. package/llm-docs/guides/relay-resolvers/derived-fields.mdx +127 -0
  145. package/llm-docs/guides/relay-resolvers/descriptions.mdx +44 -0
  146. package/llm-docs/guides/relay-resolvers/enabling.mdx +41 -0
  147. package/llm-docs/guides/relay-resolvers/errors.mdx +64 -0
  148. package/llm-docs/guides/relay-resolvers/field-arguments.mdx +63 -0
  149. package/llm-docs/guides/relay-resolvers/introduction.mdx +62 -0
  150. package/llm-docs/guides/relay-resolvers/limitations.mdx +30 -0
  151. package/llm-docs/guides/relay-resolvers/live-fields.mdx +164 -0
  152. package/llm-docs/guides/relay-resolvers/return-types.mdx +161 -0
  153. package/llm-docs/guides/relay-resolvers/suspense.mdx +41 -0
  154. package/llm-docs/guides/required-directive.mdx +240 -0
  155. package/llm-docs/guides/semantic-nullability.mdx +93 -0
  156. package/llm-docs/guides/testing-relay-components.mdx +642 -0
  157. package/llm-docs/guides/testing-relay-with-preloaded-queries.mdx +160 -0
  158. package/llm-docs/guides/throw-on-field-error-directive.mdx +58 -0
  159. package/llm-docs/guides/type-emission.mdx +414 -0
  160. package/llm-docs/home.mdx +32 -0
  161. package/llm-docs/principles-and-architecture/architecture-overview.mdx +24 -0
  162. package/llm-docs/principles-and-architecture/compiler-architecture.mdx +106 -0
  163. package/llm-docs/principles-and-architecture/runtime-architecture.mdx +249 -0
  164. package/llm-docs/principles-and-architecture/thinking-in-graphql.mdx +309 -0
  165. package/llm-docs/principles-and-architecture/thinking-in-relay.mdx +104 -0
  166. package/llm-docs/principles-and-architecture/videos.mdx +50 -0
  167. package/llm-docs/tutorial/arrays-lists.mdx +126 -0
  168. package/llm-docs/tutorial/fragments-1.mdx +487 -0
  169. package/llm-docs/tutorial/graphql.mdx +172 -0
  170. package/llm-docs/tutorial/interfaces-polymorphism.mdx +161 -0
  171. package/llm-docs/tutorial/intro.mdx +58 -0
  172. package/llm-docs/tutorial/mutations-updates.mdx +624 -0
  173. package/llm-docs/tutorial/organizing-mutations-queries-and-subscriptions.mdx +13 -0
  174. package/llm-docs/tutorial/queries-1.mdx +267 -0
  175. package/llm-docs/tutorial/queries-2.mdx +389 -0
  176. package/llm-docs/tutorial/refetchable-fragments.mdx +352 -0
  177. package/multi-actor-environment/ActorIdentifier.d.ts +17 -0
  178. package/multi-actor-environment/ActorIdentifier.js.flow +2 -2
  179. package/multi-actor-environment/ActorSpecificEnvironment.js.flow +15 -15
  180. package/multi-actor-environment/ActorUtils.js.flow +1 -1
  181. package/multi-actor-environment/MultiActorEnvironment.d.ts +123 -0
  182. package/multi-actor-environment/MultiActorEnvironment.js.flow +32 -24
  183. package/multi-actor-environment/MultiActorEnvironmentTypes.d.ts +225 -0
  184. package/multi-actor-environment/MultiActorEnvironmentTypes.js.flow +6 -6
  185. package/multi-actor-environment/index.d.ts +14 -0
  186. package/multi-actor-environment.d.ts +8 -0
  187. package/mutations/RelayDeclarativeMutationConfig.d.ts +70 -0
  188. package/mutations/RelayDeclarativeMutationConfig.js.flow +9 -9
  189. package/mutations/RelayRecordProxy.js.flow +8 -11
  190. package/mutations/RelayRecordSourceMutator.js.flow +4 -4
  191. package/mutations/RelayRecordSourceProxy.js.flow +4 -4
  192. package/mutations/RelayRecordSourceSelectorProxy.js.flow +6 -6
  193. package/mutations/applyOptimisticMutation.d.ts +25 -0
  194. package/mutations/applyOptimisticMutation.js.flow +2 -2
  195. package/mutations/commitLocalUpdate.d.ts +10 -0
  196. package/mutations/commitMutation.d.ts +48 -0
  197. package/mutations/commitMutation.js.flow +21 -17
  198. package/mutations/createUpdatableProxy.js.flow +19 -19
  199. package/mutations/readUpdatableFragment.js.flow +3 -3
  200. package/mutations/readUpdatableQuery.js.flow +3 -3
  201. package/mutations/validateMutation.js.flow +7 -7
  202. package/network/RelayNetwork.d.ts +12 -0
  203. package/network/RelayNetworkTypes.d.ts +145 -0
  204. package/network/RelayNetworkTypes.js.flow +18 -18
  205. package/network/RelayObservable.d.ts +197 -0
  206. package/network/RelayObservable.js.flow +32 -30
  207. package/network/RelayQueryResponseCache.d.ts +16 -0
  208. package/network/RelayQueryResponseCache.js.flow +3 -3
  209. package/network/wrapNetworkWithLogObserver.js.flow +1 -1
  210. package/package.json +2 -1
  211. package/query/GraphQLTag.d.ts +45 -0
  212. package/query/GraphQLTag.js.flow +22 -10
  213. package/query/fetchQuery.d.ts +21 -0
  214. package/query/fetchQuery.js.flow +23 -10
  215. package/query/fetchQueryInternal.d.ts +26 -0
  216. package/query/fetchQueryInternal.js.flow +4 -4
  217. package/query/fetchQuery_DEPRECATED.d.ts +17 -0
  218. package/query/fetchQuery_DEPRECATED.js.flow +1 -1
  219. package/store/ClientID.d.ts +14 -0
  220. package/store/DataChecker.js.flow +51 -15
  221. package/store/NormalizationEngine.js.flow +782 -0
  222. package/store/OperationExecutor.d.ts +51 -0
  223. package/store/OperationExecutor.js.flow +204 -98
  224. package/store/RelayConcreteVariables.js.flow +5 -5
  225. package/store/RelayErrorTrie.js.flow +12 -12
  226. package/store/RelayExperimentalGraphResponseHandler.js.flow +3 -3
  227. package/store/RelayExperimentalGraphResponseTransform.js.flow +10 -10
  228. package/store/RelayModernEnvironment.d.ts +97 -0
  229. package/store/RelayModernEnvironment.js.flow +58 -43
  230. package/store/RelayModernFragmentSpecResolver.js.flow +1 -1
  231. package/store/RelayModernOperationDescriptor.d.ts +28 -0
  232. package/store/RelayModernOperationDescriptor.js.flow +1 -1
  233. package/store/RelayModernRecord.d.ts +92 -0
  234. package/store/RelayModernRecord.js.flow +44 -20
  235. package/store/RelayModernSelector.d.ts +123 -0
  236. package/store/RelayModernSelector.js.flow +21 -21
  237. package/store/RelayModernStore.d.ts +57 -0
  238. package/store/RelayModernStore.js.flow +219 -58
  239. package/store/RelayOperationTracker.d.ts +29 -0
  240. package/store/RelayOperationTracker.js.flow +2 -2
  241. package/store/RelayOptimisticRecordSource.js.flow +2 -2
  242. package/store/RelayPublishQueue.js.flow +29 -20
  243. package/store/RelayReader.js.flow +129 -57
  244. package/store/RelayRecordSource.d.ts +26 -0
  245. package/store/RelayRecordSource.js.flow +10 -0
  246. package/store/RelayRecordState.d.ts +28 -0
  247. package/store/RelayRecordState.js.flow +1 -1
  248. package/store/RelayReferenceMarker.js.flow +5 -4
  249. package/store/RelayResponseNormalizer.d.ts +28 -0
  250. package/store/RelayResponseNormalizer.js.flow +130 -62
  251. package/store/RelayStoreSubscriptions.js.flow +52 -8
  252. package/store/RelayStoreTypes.d.ts +1327 -0
  253. package/store/RelayStoreTypes.js.flow +371 -278
  254. package/store/RelayStoreUtils.d.ts +86 -0
  255. package/store/RelayStoreUtils.js.flow +16 -8
  256. package/store/ResolverCache.js.flow +2 -2
  257. package/store/ResolverFragments.d.ts +43 -0
  258. package/store/ResolverFragments.js.flow +22 -14
  259. package/store/StoreInspector.js.flow +7 -8
  260. package/store/ViewerPattern.d.ts +11 -0
  261. package/store/cloneRelayHandleSourceField.js.flow +1 -1
  262. package/store/cloneRelayScalarHandleSourceField.js.flow +1 -1
  263. package/store/createFragmentSpecResolver.d.ts +16 -0
  264. package/store/createRelayContext.js.flow +1 -1
  265. package/store/createRelayLoggingContext.js.flow +4 -4
  266. package/store/defaultGetDataID.js.flow +2 -2
  267. package/store/isRelayModernEnvironment.d.ts +8 -0
  268. package/store/isRelayModernEnvironment.js.flow +4 -2
  269. package/store/live-resolvers/LiveResolverCache.js.flow +55 -20
  270. package/store/live-resolvers/LiveResolverSuspenseSentinel.js.flow +3 -3
  271. package/store/live-resolvers/getOutputTypeRecordIDs.js.flow +1 -1
  272. package/store/live-resolvers/isLiveStateValue.js.flow +2 -2
  273. package/store/live-resolvers/resolverDataInjector.d.ts +27 -0
  274. package/store/live-resolvers/resolverDataInjector.js.flow +8 -5
  275. package/store/observeFragmentExperimental.d.ts +46 -0
  276. package/store/observeFragmentExperimental.js.flow +50 -21
  277. package/store/observeQueryExperimental.d.ts +30 -0
  278. package/store/observeQueryExperimental.js.flow +5 -5
  279. package/store/readInlineData.d.ts +19 -0
  280. package/store/readInlineData.js.flow +5 -5
  281. package/store/waitForFragmentExperimental.d.ts +49 -0
  282. package/store/waitForFragmentExperimental.js.flow +3 -3
  283. package/subscription/requestSubscription.d.ts +27 -0
  284. package/subscription/requestSubscription.js.flow +10 -10
  285. package/util/JSResourceTypes.flow.js.flow +4 -4
  286. package/util/NormalizationNode.d.ts +235 -0
  287. package/util/NormalizationNode.js.flow +127 -123
  288. package/util/ReaderNode.d.ts +264 -0
  289. package/util/ReaderNode.js.flow +156 -151
  290. package/util/RelayConcreteNode.d.ts +120 -0
  291. package/util/RelayConcreteNode.js.flow +32 -32
  292. package/util/RelayError.d.ts +13 -0
  293. package/util/RelayError.js.flow +4 -1
  294. package/util/RelayFeatureFlags.d.ts +40 -0
  295. package/util/RelayFeatureFlags.js.flow +21 -1
  296. package/util/RelayProfiler.d.ts +121 -0
  297. package/util/RelayProfiler.js.flow +1 -1
  298. package/util/RelayReplaySubject.d.ts +25 -0
  299. package/util/RelayReplaySubject.js.flow +3 -3
  300. package/util/RelayRuntimeTypes.d.ts +59 -0
  301. package/util/RelayRuntimeTypes.js.flow +36 -33
  302. package/util/createPayloadFor3DField.d.ts +17 -0
  303. package/util/createPayloadFor3DField.js.flow +9 -5
  304. package/util/deepFreeze.d.ts +8 -0
  305. package/util/deepFreeze.js.flow +2 -2
  306. package/util/getFragmentIdentifier.d.ts +10 -0
  307. package/util/getFragmentIdentifier.js.flow +1 -1
  308. package/util/getPaginationMetadata.d.ts +20 -0
  309. package/util/getPaginationMetadata.js.flow +1 -1
  310. package/util/getPaginationVariables.d.ts +20 -0
  311. package/util/getPaginationVariables.js.flow +1 -1
  312. package/util/getPendingOperationsForFragment.d.ts +18 -0
  313. package/util/getPendingOperationsForFragment.js.flow +2 -2
  314. package/util/getRefetchMetadata.d.ts +19 -0
  315. package/util/getRefetchMetadata.js.flow +6 -5
  316. package/util/getRelayHandleKey.d.ts +8 -0
  317. package/util/getRequestIdentifier.d.ts +17 -0
  318. package/util/getValueAtPath.d.ts +8 -0
  319. package/util/getValueAtPath.js.flow +3 -3
  320. package/util/handlePotentialSnapshotErrors.d.ts +14 -0
  321. package/util/handlePotentialSnapshotErrors.js.flow +5 -5
  322. package/util/isEmptyObject.js.flow +1 -1
  323. package/util/isPromise.d.ts +8 -0
  324. package/util/isPromise.js.flow +2 -2
  325. package/util/isScalarAndEqual.d.ts +8 -0
  326. package/util/isScalarAndEqual.js.flow +1 -1
  327. package/util/recycleNodesInto.d.ts +8 -0
  328. package/util/recycleNodesInto.js.flow +2 -2
  329. package/util/registerEnvironmentWithDevTools.js.flow +1 -1
  330. package/util/shallowFreeze.js.flow +1 -1
  331. package/util/stableCopy.d.ts +8 -0
  332. package/util/stableCopy.js.flow +5 -5
  333. package/util/withProvidedVariables.d.ts +19 -0
  334. package/util/withProvidedVariables.js.flow +14 -10
@@ -0,0 +1,65 @@
1
+ ---
2
+ id: commit-mutation
3
+ title: commitMutation
4
+ slug: /api-reference/commit-mutation/
5
+ description: API reference for commitMutation, which imperatively executes a mutation
6
+ keywords:
7
+ - mutation
8
+ ---
9
+
10
+ import DocsRating from '@site/src/core/DocsRating';
11
+ import {OssOnly, FbInternalOnly} from 'docusaurus-plugin-internaldocs-fb/internal';
12
+ import MutationConfig from '../types/MutationConfig.mdx';
13
+ import Disposable from '../types/Disposable.mdx';
14
+
15
+ ## `commitMutation`
16
+
17
+ Imperatively execute a mutation.
18
+
19
+ See also the [`useMutation`](../use-mutation/) API and [Guide to Updating Data](../../guided-tour/updating-data/introduction.mdx).
20
+
21
+ ```js
22
+ import type {FeedbackLikeMutation} from 'FeedbackLikeMutation.graphql';
23
+ const React = require('React');
24
+
25
+ const {graphql, commitMutation} = require('react-relay');
26
+
27
+ function likeFeedback(environment: IEnvironment): Disposable {
28
+ return commitMutation<FeedbackLikeMutation>(environment, {
29
+ mutation: graphql`
30
+ mutation FeedbackLikeMutation($input: FeedbackLikeData!) {
31
+ feedback_like(data: $input) {
32
+ feedback {
33
+ id
34
+ viewer_does_like
35
+ like_count
36
+ }
37
+ }
38
+ }
39
+ `,
40
+ variables: {
41
+ input: {
42
+ id: '123',
43
+ },
44
+ },
45
+ });
46
+ }
47
+ ```
48
+
49
+ ### Arguments
50
+
51
+ * `environment`: `IEnvironment`. A Relay environment.
52
+ * `config`: [`MutationConfig<TMutation>`](#type-mutationconfigtmutationconfig-mutationparameters).
53
+
54
+ <MutationConfig />
55
+
56
+
57
+ ### Return Value
58
+
59
+ * A [`Disposable`](#interface-disposable) which:
60
+ * If called before the request completes, will cancel and revert any optimistic updates and prevent the `onComplete` and `onError` callbacks from being executed. It will not necessarily cancel any network request. Will cause the `onUnsubscribe` callback to be called.
61
+ * If called after the initial request completes, will do nothing.
62
+
63
+ <Disposable />
64
+
65
+ <DocsRating />
@@ -0,0 +1,118 @@
1
+ ---
2
+ id: fetch-query
3
+ title: fetchQuery
4
+ slug: /api-reference/fetch-query/
5
+ description: API reference for fetchQuery, which imperatively fetches data for a query and returns an observable
6
+ keywords:
7
+ - observable
8
+ - query
9
+ - fetch
10
+ ---
11
+
12
+ import DocsRating from '@site/src/core/DocsRating';
13
+ import {OssOnly, FbInternalOnly} from 'docusaurus-plugin-internaldocs-fb/internal';
14
+
15
+ ## `fetchQuery`
16
+
17
+ If you want to fetch a query outside of React, you can use the `fetchQuery` function from `react-relay`:
18
+
19
+ ```js
20
+ // You should prefer passing an environment that was returned from useRelayEnvironment()
21
+ const MyEnvironment = require('MyEnvironment');
22
+ const {fetchQuery} = require('react-relay');
23
+
24
+ fetchQuery(
25
+ environment,
26
+ graphql`
27
+ query AppQuery($id: ID!) {
28
+ user(id: $id) {
29
+ name
30
+ }
31
+ }
32
+ `,
33
+ {id: 4},
34
+ )
35
+ .subscribe({
36
+ start: () => {...},
37
+ complete: () => {...},
38
+ error: (error) => {...},
39
+ next: (data) => {...}
40
+ });
41
+ ```
42
+
43
+ ### Arguments
44
+
45
+ * `environment`: A Relay Environment instance to execute the request on. If you're starting this request somewhere within a React component, you probably want to use the environment you obtain from using [`useRelayEnvironment`](../use-relay-environment/).
46
+ * `query`: GraphQL query to fetch, specified using a `graphql` template literal.
47
+ * `variables`: Object containing the variable values to fetch the query. These variables need to match GraphQL variables declared inside the query.
48
+ * `options`: *_[Optional]_* options object
49
+ * `networkCacheConfig`: *_[Optional]_ *Object containing cache config options
50
+ * `force`: Boolean value. If true, will bypass the network response cache. Defaults to true.
51
+ * `fetchPolicy`: *_[Optional]_* Determines whether `fetchQuery` should reuse data that is already available in the local Relay store. Must be one of the following values:
52
+ * `"network-only"`: *(default)* Always issue a network request, regardless of what is in the store.
53
+ * `"store-or-network"`: Reuse data from the store if the full query is available locally; otherwise, issue a network request.
54
+
55
+ The `"store-and-network"` and `"store-only"` fetch policies are **not supported** by `fetchQuery`, because it is designed around issuing a single network request and returning the response.
56
+
57
+ ### Flow Type Parameters
58
+
59
+ * `TQuery`: Type parameter that should correspond to the Flow type for the specified query. This type is available to import from the the auto-generated file: `<query_name>.graphql.js`. It will ensure that the type of the data provided by the observable matches the shape of the query, and enforces that the `variables` passed as input to `fetchQuery` match the type of the variables expected by the query.
60
+
61
+ ### Return Value
62
+
63
+ * `observable`: Returns an observable instance. To start the request, `subscribe` or `toPromise` must be called on the observable. Exposes the following methods:
64
+ * `subscribe`: Function that can be called to subscribe to the observable for the network request. Keep in mind that this subscribes you only to the fetching of the query, not to any subsequent changes to the data within the Relay Store.
65
+ * Arguments:
66
+ * `observer`: Object that specifies observer functions for different events occurring on the network request observable. May specify the following event handlers as keys in the observer object:
67
+ * `start`: Function that will be called when the network requests starts. It will receive a single `subscription` argument, which represents the subscription on the network observable.
68
+ * `complete`: Function that will be called if and when the network request completes successfully.
69
+ * `next`: Function that will be called every time a payload is received from the network. It will receive a single `data` argument, which represents a snapshot of the query data read from the Relay store at the moment a payload was received from the server.
70
+ * `error`: Function that will be called if an error occurs during the network request. It will receive a single `error` argument, containing the error that occurred.
71
+ * `unsubscribe`: Function that will be called whenever the subscription is unsubscribed. It will receive a single `subscription` argument, which represents the subscription on the network observable.
72
+ * Return Value:
73
+ * `subscription`: Object representing a subscription to the observable. Calling `subscription.unsubscribe()` will cancel the network request.
74
+ * `toPromise`:
75
+ * Return Value:
76
+ * `promise`: Returns a promise that will resolve when the first network response is received from the server. If the request fails, the promise will reject. Cannot be cancelled.
77
+
78
+ <FbInternalOnly>
79
+
80
+ :::info
81
+ The `next` function may be called multiple times when using Relay's [Incremental Data Delivery](../../guides/incremental-data-delivery/) capabilities to receive multiple payloads from the server.
82
+ :::
83
+
84
+ </FbInternalOnly>
85
+
86
+ ### Behavior
87
+
88
+ * `fetchQuery` will automatically save the fetched data to the in-memory Relay store, and notify any components subscribed to the relevant data.
89
+ * `fetchQuery` will **NOT** retain the data for the query, meaning that it is not guaranteed that the data will remain saved in the Relay store at any point after the request completes. If you wish to make sure that the data is retained outside of the scope of the request, you need to call `environment.retain()` directly on the query to ensure it doesn't get deleted. See our section on [Controlling Relay's GC Policy](../../guided-tour/reusing-cached-data/presence-of-data) for more details.
90
+ * `fetchQuery` will automatically de-dupe identical network requests (same query and variables) that are in flight at the same time, and that were initiated with `fetchQuery`.
91
+
92
+
93
+ ### Behavior with `.toPromise()`
94
+
95
+ If desired, you can convert the request into a Promise using `**.toPromise()**`. Note that toPromise will start the query and return a Promise that will resolve when the *first* piece of data returns from the server and *cancel further processing*. That means any deferred or 3D data in the query may not be processed. **We generally recommend against using toPromise() for this reason.**
96
+
97
+ ```js
98
+ const {fetchQuery} = require('react-relay');
99
+
100
+ fetchQuery(
101
+ environment,
102
+ graphql`
103
+ query AppQuery($id: ID!) {
104
+ user(id: $id) {
105
+ name
106
+ }
107
+ }
108
+ `,
109
+ {id: 4},
110
+ )
111
+ .toPromise() // NOTE: don't use, this can cause data to be missing!
112
+ .then(data => {...})
113
+ .catch(error => {...};
114
+ ```
115
+
116
+ * `toPromise` Returns a promise that will resolve when the first network response is received from the server. If the request fails, the promise will reject. Cannot be cancelled.
117
+
118
+ <DocsRating />
@@ -0,0 +1,170 @@
1
+ ---
2
+ id: field-logger
3
+ title: relayFieldLogger
4
+ slug: /api-reference/field-logger/
5
+ description: API reference for the `relayFieldLogger` Environment config option
6
+ keywords:
7
+ - environment
8
+ - logging
9
+ - error
10
+ ---
11
+
12
+ Relay includes a number of features that allow for granular handling of field errors:
13
+
14
+ - [`@required`](../../guides/required-directive.mdx) provides declarative handling of field nullability
15
+ - [`@catch`](../../guides/catch-directive.mdx) allows you to explicitly handle field errors
16
+ - [`@throwOnFieldError`](../../guides/throw-on-field-error-directive.mdx) lets you treat field errors as exceptions
17
+ - [Relay Resolvers](../../guides/relay-resolvers/introduction.mdx) coerce thrown exceptions to null, matching the GraphQL spec
18
+
19
+ In each of these cases, field errors are handled by Relay. However, it can still be important to track that these errors are occurring in your app, and monitor or resolve them. To enable this, the Relay Environment can be configured with a `relayFieldLogger`. This logger is a function which is called with events each time Relay handles a field-level error.
20
+
21
+ Providing a field logger looks something like this:
22
+ ```ts
23
+ import {Environment} from "relay-runtime";
24
+
25
+ const environment = new Environment({
26
+ relayFieldLogger: (event) => {
27
+ switch(event.kind) {
28
+ case "missing_expected_data.log":
29
+ // ...
30
+ break;
31
+ // ... handle other events
32
+ }
33
+ },
34
+ network: // ...
35
+ store: // ...
36
+ });
37
+ ```
38
+
39
+ ## Event Types
40
+
41
+ The Field Logger currently can receive the following events:
42
+
43
+ ## Missing Expected Data Log
44
+
45
+ Data which Relay expected to be in the store (because it was requested by the parent query/mutation/subscription) was missing. This can happen due to graph relationship changes observed by other queries/mutations, or imperative updates that don't provide all needed data.
46
+
47
+ See [Graph Relationship Changes](../../debugging/why-null/#graph-relationship-change).
48
+
49
+ In this case Relay will render with the referenced field as `undefined`.
50
+
51
+ :::note
52
+ This may break with the type contract of Relay's generated types.
53
+ :::
54
+
55
+ To turn this into a hard error for a given fragment/query, you can use [`@throwOnFieldError`](../../guides/throw-on-field-error-directive/)
56
+
57
+ ```ts
58
+ export type MissingExpectedDataLogEvent = {
59
+ +kind: 'missing_expected_data.log',
60
+ +owner: string,
61
+ +fieldPath: string,
62
+ };
63
+ ```
64
+
65
+ ## Missing Expected Data Throw
66
+
67
+ Data which Relay expected to be in the store (because it was requested by the parent query/mutation/subscription) was missing. This can happen due to graph relationship changes observed by other queries/mutations, or imperative updates that don't provide all needed data.
68
+
69
+ See [Graph Relationship Changes](../../debugging/why-null/#graph-relationship-change).
70
+
71
+
72
+ This event is called `.throw` because the missing data was encountered in a
73
+ query/fragment/mutation with [`@throwOnFieldError`](../../guides/throw-on-field-error-directive/)
74
+
75
+ Relay will throw immediately after logging this event. If you wish to
76
+ customize the error being thrown, you may throw your own error.
77
+
78
+ :::note
79
+ Only throw on this event if `handled` is false. Errors that have been handled by a `@catch` directive or by making a resolver null will have `handled: true` and should not trigger a throw.
80
+ :::
81
+
82
+ ```ts
83
+ export type MissingExpectedDataThrowEvent = {
84
+ +kind: 'missing_expected_data.throw',
85
+ +owner: string,
86
+ +fieldPath: string,
87
+ +handled: boolean,
88
+ };
89
+ ```
90
+
91
+ The `fieldPath` property is a `.` separated string containing the path from the query/mutation/fragment root to the field which was missing. Note that there are some cases where we are missing data that is not strictly a field. In those cases the path will end with one of these segments:
92
+
93
+ 1. `path.to.<record>` An edge points to an ID that is not present in the Relay store
94
+ 2. `path.to.<abstract-type-hint>` A virtual field inserted by the Relay compiler to detect if a type condition holds is missing from the Relay store
95
+
96
+ ## Missing Required Field Log
97
+
98
+ A field was marked as [@required(action: LOG)](../../guides/required-directive.mdx#action) but was null or missing in the store.
99
+
100
+ ```ts
101
+ export type MissingRequiredFieldLogEvent = {
102
+ +kind: 'missing_required_field.log',
103
+ +owner: string,
104
+ +fieldPath: string,
105
+ };
106
+ ```
107
+
108
+ ## Missing Required Field Throw
109
+
110
+ A field was marked as [@required(action: THROW)](../../guides/required-directive.mdx#action) but was null or missing in the store.
111
+
112
+ Relay will throw immediately after logging this event. If you wish to customize the error being thrown, you may throw your own error.
113
+
114
+ :::note
115
+ Only throw on this event if `handled` is false. Errors that have been
116
+ handled by a `@catch` directive or by making a resolver null will have
117
+ `handled: true` and should not trigger a throw.
118
+ :::
119
+
120
+ ```ts
121
+ export type MissingRequiredFieldThrowEvent = {
122
+ +kind: 'missing_required_field.throw',
123
+ +owner: string,
124
+ +fieldPath: string,
125
+ +handled: boolean,
126
+ };
127
+ ```
128
+
129
+ ## Relay Resolver Error
130
+
131
+
132
+ A [Relay Resolver](../../guides/relay-resolvers/introduction.mdx) that is currently being read threw a JavaScript error when it was last evaluated. By default, the value has been coerced to null and passed to the product code.
133
+
134
+ If [`@throwOnFieldError`](../../guides/throw-on-field-error-directive.mdx) was used on the parent query/fragment/mutation, you will also receive a runtime exception when the field is read.
135
+
136
+ :::note
137
+ Only throw on this event if `handled` is false. Errors that have been handled by a `@catch` directive or by making a resolver null will have `handled: true` and should not trigger a throw.
138
+
139
+ ```ts
140
+ export type RelayResolverErrorEvent = {
141
+ +kind: 'relay_resolver.error',
142
+ +owner: string,
143
+ +fieldPath: string,
144
+ +error: Error,
145
+ +shouldThrow: boolean,
146
+ +handled: boolean,
147
+ };
148
+ ```
149
+
150
+ ## GraphQL Payload Field Error
151
+
152
+
153
+ A field being read by Relay was marked as being in an error state by the [GraphQL response](https://spec.graphql.org/October2021/#sec-Errors.Field-errors)
154
+
155
+ If the field's parent query/fragment/mutation was annotated with [`@throwOnFieldError`](../../guides/throw-on-field-error-directive.mdx) and no [`@catch`](../../guides/catch-directive.mdx) directive was used to catch the error, Relay will throw an error immediately after logging this event.
156
+
157
+ :::note
158
+ Only throw on this event if `handled` is false. Errors that have been handled by a `@catch` directive or by making a resolver null will have `handled: true` and should not trigger a throw.
159
+ :::
160
+
161
+ ```ts
162
+ export type RelayFieldPayloadErrorEvent = {
163
+ +kind: 'relay_field_payload.error',
164
+ +owner: string,
165
+ +fieldPath: string,
166
+ +error: TRelayFieldError,
167
+ +shouldThrow: boolean,
168
+ +handled: boolean,
169
+ };
170
+ ```
@@ -0,0 +1,92 @@
1
+ ---
2
+ id: observe-fragment
3
+ title: observeFragment
4
+ slug: api-reference/observe-fragment
5
+ description: Read the value of a fragment and observe its state and value over time
6
+ keywords:
7
+ - observable
8
+ - fragment
9
+ ---
10
+
11
+ import DocsRating from '@site/src/core/DocsRating';
12
+
13
+ :::warning
14
+ `observeFragment` is still an experimental API. It currently has some limitations and may evolve slightly during this phase.
15
+ :::
16
+
17
+ ## `observeFragment`
18
+
19
+ In some cases it can be useful to define data that you wish to read using a GraphQL fragment, but then consume it outside of React render function. `observeFragment` allows you to consume the state and value of a fragment as it changes over time. This includes loading and error states as well as changes to the data as it gets updated by local updates, mutations or updates to Relay's normalized store from other queries.
20
+
21
+ To read a fragment's data just once, see [`waitForFragmentData`](./wait-for-fragment-data.mdx).
22
+
23
+ :::caution
24
+ When using `observeFragment` with a plural fragment, the current implementation notifies the subscription multiple times if a store update impacting multiple list items gets published. Since the notifications happen synchronously, it is advised to debounce for a tick and only use the last payload for batching.
25
+ :::
26
+
27
+ ### Example
28
+
29
+ ```ts
30
+ import {observeFragment} from "relay-runtime/experimental";
31
+ import { useEffect } from "react";
32
+ import { useFragment } from "react-relay";
33
+ import { graphql } from "relay-runtime";
34
+
35
+ function MyComponent({ key }) {
36
+ const user = useFragment(
37
+ graphql`
38
+ fragment UserFragment on User {
39
+ ...TitleFragment
40
+ }
41
+ `,
42
+ key,
43
+ );
44
+
45
+ // Update the title as the user's name changes without triggering rerenders.
46
+ useEffect(() => {
47
+ const subscription = observeFragment(
48
+ graphql`
49
+ fragment TitleFragment on User {
50
+ name
51
+ }
52
+ `,
53
+ user,
54
+ ).subscribe({
55
+ next: (result) => {
56
+ switch(result.kind) {
57
+ case "loading":
58
+ window.title = "...loading";
59
+ break;
60
+ case "error":
61
+ window.title = "Oops, we hit an error";
62
+ break;
63
+ case "ok":
64
+ window.title = `Welcome ${result.value.name}`;
65
+ break;
66
+ }
67
+ }
68
+ });
69
+ return () => {
70
+ subscription.unsubscribe();
71
+ };
72
+ }, [user]);
73
+
74
+ return <div>Check out the document title!</div>;
75
+ }
76
+ ```
77
+
78
+ ### Arguments
79
+
80
+ * `environment`: `IEnvironment`. A Relay environment.
81
+ * `fragment`: GraphQL fragment specified using a `graphql` template literal.
82
+ * `fragmentReference`: The *fragment reference* is an opaque Relay object that Relay uses to read the data for the fragment from the store; more specifically, it contains information about which particular object instance the data should be read from.
83
+ * The type of the fragment reference can be imported from the generated Flow types, from the file `<fragment_name>.graphql.js`, and can be used to declare the type of your `Props`. The name of the fragment reference type will be: `<fragment_name>$key`. We use our [lint rule](https://github.com/relayjs/eslint-plugin-relay) to enforce that the type of the fragment reference prop is correctly declared.
84
+
85
+ ### Return Value
86
+
87
+ * An [`Observable`](../../glossary/glossary.mdx#observable) which returns a discriminated union modeling the three possible states in which a fragment's data might be:
88
+ * `{state: 'ok', value: T}` - When data is available the state is `'ok'`. `T` is the data defined in the fragment.
89
+ * `{state: 'error': error: Error}` - When the fragment is in an error state either due to network level errors, [`@throwOnFieldError`](../../guides/throw-on-field-error-directive.mdx) or [`@required(action: THROW)`](../../guides/required-directive.mdx) field errors.
90
+ * `{state: 'loading'}` - When the parent request, or current `@defer` payload is still in flight, or a [`@live` Relay Resolver](../../guides/relay-resolvers/live-fields.mdx) being read is in a suspended state.
91
+
92
+ <DocsRating />
@@ -0,0 +1,53 @@
1
+ ---
2
+ id: relay-environment
3
+ title: Relay Environment
4
+ slug: /api-reference/relay-runtime/relay-environment
5
+ description: Setting up a Relay Environment
6
+ ---
7
+
8
+ The core of Relay's runtime is the `Environment`. The environment knows how to make requests to your GraphQL server and contains the `Store`, Relay's normalized data cache. Generally your application will construct a single environment which is configured to fetch data from your server, and then expose that environment to all of your components via `RelayEnvironmentProvider`.
9
+
10
+ ## Creating an Environment
11
+
12
+ To create your environment you must provide two key pieces, a [`Network`](../../guides/network-layer.mdx) and a [`Store`](store.mdx).
13
+
14
+ The `Network` is responsible for making requests to your GraphQL server. The `Store` holds the normalized data cache.
15
+
16
+ A minimal implementation of an environment might look like this:
17
+
18
+ ```ts title="RelayEnvironment.js"
19
+ import { Environment, Store, RecordSource, Network, FetchFunction } from "relay-runtime";
20
+
21
+ const HTTP_ENDPOINT = "https://graphql.org/graphql/";
22
+
23
+ const fetchGraphQL: FetchFunction = async (request, variables) => {
24
+ const resp = await fetch(HTTP_ENDPOINT, {
25
+ method: "POST",
26
+ headers: { "Content-Type": "application/json" },
27
+ body: JSON.stringify({ query: request.text, variables }),
28
+ });
29
+ if (!resp.ok) {
30
+ throw new Error("Response failed.");
31
+ }
32
+ return await resp.json();
33
+ };
34
+
35
+ export const environment = new Environment({
36
+ store: new Store(new RecordSource({})),
37
+ network: Network.create(fetchGraphQL),
38
+ });
39
+ ```
40
+
41
+ ## Advanced Configuration
42
+
43
+ The Relay environment accepts a number of additional configuration options when it is created. These options are all optional, but can be used to customize the behavior of the environment.
44
+
45
+ Notable options include:
46
+
47
+ * `log` - A function that will be called with telemetry events. See the types for [`LogEvent`](https://github.com/facebook/relay/blob/0414c9ad0744483e349e07defcb6d70a52cf8b3c/packages/relay-runtime/store/RelayStoreTypes.js#L799) for a full list of events and their fields.
48
+ * [`missingFieldHandlers`](../../guided-tour/reusing-cached-data/filling-in-missing-data.mdx) - A list of handlers that will be called when a field is missing from the store. This can be used to enable fulfilling queries to fields like `Query.node` from cache.
49
+ * `getDataID` - A function that will be called to generate a unique ID for a given object. This can be used to customize the way that Relay generates IDs for objects if your server does not implement the [Global Object Identification spec](https://graphql.org/learn/global-object-identification/).
50
+ * [`relayFieldLogger`](./field-logger.mdx) - A function that will be called when Relay encounters a field-level error.
51
+ * `deferDeduplicatedFields` - When set to `true`, this option prevents Relay from throwing an error when missing fields are received in a deferred response. This is required for the [latest](https://github.com/graphql/defer-stream-wg/discussions/69) `@defer` spec proposal, which does not send duplicate fields in deferred responses. While Relay does not yet attempt to support the latest spec proposal, this option allows users to transform responses into a format that Relay can accept.
52
+
53
+ For a full list of options, inspect the [provided TypeScript types](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/relay-runtime/lib/store/RelayModernEnvironment.d.ts#L26-L43).
@@ -0,0 +1,54 @@
1
+ ---
2
+ id: request-subscription
3
+ title: requestSubscription
4
+ slug: /api-reference/request-subscription/
5
+ description: API reference for requestSubscription, which imperatively establishes a GraphQL subscription
6
+ keywords:
7
+ - subscription
8
+ ---
9
+
10
+ import DocsRating from '@site/src/core/DocsRating';
11
+ import {OssOnly, FbInternalOnly} from 'docusaurus-plugin-internaldocs-fb/internal';
12
+ import GraphQLSubscriptionConfig from '../types/GraphQLSubscriptionConfig.mdx';
13
+ import Disposable from '../types/Disposable.mdx';
14
+
15
+ ## `requestSubscription`
16
+
17
+ Imperative API for establishing a GraphQL Subscription.
18
+ See also the [`useSubscription`](../use-subscription/) API and the [Guide to Updating Data](../../guided-tour/updating-data/introduction.mdx).
19
+ ```js
20
+ import {graphql, requestSubscription} from 'react-relay';
21
+
22
+ const subscription = graphql`
23
+ subscription UserDataSubscription($input: InputData!) {
24
+ # ...
25
+ }
26
+ `;
27
+
28
+ function createSubscription(environment: IEnvironment): Disposable {
29
+ return requestSubscription(environment, {
30
+ subscription,
31
+ variables: {input: {userId: '4'}},
32
+ });
33
+ }
34
+ ```
35
+
36
+ ### Arguments
37
+
38
+ * `environment`: A Relay Environment
39
+ * `config`: `GraphQLSubscriptionConfig`
40
+
41
+ <GraphQLSubscriptionConfig />
42
+
43
+ ### Return Type
44
+
45
+ * A [`Disposable`](#interface-disposable) that clears the subscription.
46
+
47
+ <Disposable />
48
+
49
+ ### Behavior
50
+
51
+ * Imperatively establish a subscription.
52
+ * See the [GraphQL Subscriptions Guide](../../guided-tour/updating-data/graphql-subscriptions/) for a more detailed explanation of how to work with subscriptions.
53
+
54
+ <DocsRating />
@@ -0,0 +1,52 @@
1
+ ---
2
+ id: runtime-config
3
+ title: Runtime Configuration
4
+ slug: /api-reference/runtime-config/
5
+ description: Configuring the Relay Runtime
6
+ keywords:
7
+ - feature flags
8
+ - configuration
9
+ ---
10
+
11
+ ## ConnectionInterface
12
+
13
+ If your server's implementation of the Connection Spec differs from the default interface you will need to configure the Relay Runtime to expect the connection type and field names used in your schema. This is done by updating the global ConnectionInterface instance exported by Relay:
14
+
15
+ :::note
16
+ You will also need to update your [Relay Compiler Config](../../getting-started/compiler-config/#ConnectionInterface) with these same values at the path `schemaConfig.connectionInterface`.
17
+ :::
18
+
19
+ ```ts title="/src/ConfigureRelay.ts"
20
+ import { ConnectionInterface } from 'relay-runtime';
21
+
22
+ // Note: This must match the values configured in the Relay compiler config.
23
+ ConnectionInterface.inject({
24
+ END_CURSOR: 'end_cursor',
25
+ HAS_NEXT_PAGE: 'has_next_page',
26
+ HAS_PREV_PAGE: 'has_previous_page',
27
+ START_CURSOR: 'start_cursor',
28
+ PAGE_INFO: 'page_info',
29
+ NODE: 'node',
30
+ CURSOR: 'cursor',
31
+ EDGES: 'edges',
32
+ PAGE_INFO_TYPE: 'PageInfo',
33
+ });
34
+ ```
35
+
36
+ ## Feature Flags
37
+
38
+ :::warning
39
+ Feature Flags are used for enabling and configuring unstable Relay features, **regular use of Relay should not need to modify runtime feature flags**. They are documented here for purely informational purposes
40
+ :::
41
+
42
+ Relay has a number of runtime options called "Feature Flags". In general, these are used for enabling experimental features which are not yet stable and thus not yet enabled by default.
43
+
44
+ Feature flags in the Relay Runtime are implemented as a global mutable object. To set/configure a feature flag, import that object and mutate it. If you do this in the module scope, the updates will apply before Relay looks at them.
45
+
46
+ ```ts title="/src/ConfigureRelay.ts"
47
+ import { RelayFeatureFlags } from 'relay-runtime';
48
+
49
+ RelayFeatureFlags.ENABLE_SOME_EXPERIMENT = true;
50
+ ```
51
+
52
+ You can find the full list of feature flags [here](https://github.com/facebook/relay/blob/203d8b10e9144a37466b8a72edbe6add48f64e7d/packages/relay-runtime/util/RelayFeatureFlags.js#L4), but keep in mind that **feature flags may change arbitrarily between versions of Relay**.