urql + auth-exchange + aws-amplify

client.js

import { makeOperation } from '@urql/svelte'
import { authExchange } from '@urql/exchange-auth'
import { Auth } from 'aws-amplify'
import produce from 'immer'
import { set } from 'lodash'

const amplifyAuthExchange = authExchange({
  addAuthToOperation: ({ authState, operation }) => {
    if (!authState?.token) {
      return operation
    }
    const newContext = produce(operation.context, context => {
      set(context, 'fetchOptions.headers.Authorization', authState.token)
    })
    return makeOperation(operation.kind, operation, newContext)
  },
  willAuthError: ({ authState }) => {
    try {
      const [,payload] = authState.token.split('.')
      const { exp } = JSON.parse(Buffer.from(payload, 'base64'))
      return exp * 1000 < Date.now()
    } catch(e) {
      return true
    }
  },
  didAuthError: ({ error }) =>
    error.graphQLErrors.some(e => e.message === 'Unauthorized'),
  getAuth: async () => {
    const session = await Auth.currentSession()
    if (session) {
      // defines the authState elsewhere
      return {
        token: session.getAccessToken().getJwtToken(),
      }
    }
    Auth.signOut()
    return null
  },
})