I'm rendering notifications in my React app upon retries caused by network errors. I wish to clear any such notification if/when a connection is reestablished (a successful retry)
I've used apollo-link-retry
and used a custom attempts
callback to mutate the cache when retry loop begins and when it times out. This works, but the notifications stay on screen when a successful retry occurs, because the callback is not invoked upon successful retry so I have no way to clear the notifications from cache.
I've tried implementing similar logic using apollo-link-error
with similar issue. The link only gets called when an error occurred and a successful retry is not an error.
Here's my configuration of apollo-link-retry
which "almost" works:
const retryLink = new RetryLink({
attempts: (count) => {
let notifyType
let shouldRetry = true
if (count === 1) {
notifyType = 'CONNECTION_RETRY'
shouldRetry = true
} else if (count <= 30) {
shouldRetry = true
} else {
notifyType = 'CONNECTION_TIMEOUT'
shouldRetry = false
}
if (notifyType) {
client.mutate({
mutation: gql`
mutation m($notification: Notification!) {
raiseNotification(notification: $notification) @client
}
`,
variables: {
notification: { type: notifyType }
}
})
}
return shouldRetry
}
})
Maybe I need to implement a custom link to accomplish this? I'm hoping to find a way to leverage the nice retry logic of apollo-link-retry
and additionally emit some state to cache as the logic progresses.
I achieved the desired behavior by doing two things:
Maintain retry count in link context through the
attempts
function:Implement custom link which subscribes to error and completed events further down the link chain and uses the new context field to decide whether notifications should be raised: