Skip to main content


The underlying atom effect for syncing a Recoil atom with a GraphQL subscription. It initializes an atom based on the results of a GraphQL subscription and subscribes to updates from the server.

function graphQLSubscriptionEffect<
TVariables: Variables,
TData: $ReadOnly<{[string]: mixed}>,
T = TData,
TRawResponse = void,
environment: IEnvironment | EnvironmentKey,
subscription: GraphQLSubscription<TVariables, TData, TRawResponse>,
variables: TVariables | null,
mapResponse: TData => T,
}): AtomEffect<T>
  • environment: The Relay Environment or an EnvironmentKey to match with the environment provided with <RecoilRelayEnvironemnt>.
  • subscription: The GraphQL subscription to query.
  • variables: Variables object provided as input to the GraphQL query. If null, then skip query and use the default atom value.
  • mapResponse: Callback to map the query response to the atom value.

const myAtom = atom({
key: 'MyQuery',
effects: [
environment: myEnvironment,
query: graphql`
subscription MyEventSubscription($id: ID!) {
myevent(id: $id) {
variables: {id: 123},