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
  },
})

Nice spotting @ajenkins - I must have missed this due to my setup where I create the client in a component that isn't mounted until after login, glad you found a solution for this!

In the latest version of @urql/exchange-auth, it doesn't getAuth function and I am not able to use Promise inside addAuthToOperation
Do you guys an alternate approach for the latest version @mattfysh @souravjamwal77 ?