I don't think a middleware is meant to use RSC imports, it's more meant to use @urql/core and query data that way. The @urql/next/rsc imports are meant for server components and @urql/next mainly for React.

Hello, good for this you can use the same makeClient function that passes to the ApolloNextAppProvider:

`'use client'

import { ApolloLink, RequestHandler, split } from '@apollo/client'
import { onError } from '@apollo/client/link/error'
import { GraphQLWsLink } from '@apollo/client/link/subscriptions'
import { getMainDefinition } from '@apollo/client/utilities'

import {
ApolloNextAppProvider,
ApolloClient,
InMemoryCache
} from '@apollo/experimental-nextjs-app-support'

import { createUploadLink } from 'apollo-upload-client'
import { createClient } from 'graphql-ws'

const URL_API_HTTP = ${ process.env.NEXT_PUBLIC_API_URL ?? process.env.API_URL }/graphql

const URL_API_WS = ${ process.env.NEXT_PUBLIC_API_URL_WS ?? process.env.API_URL_WS }/graphql

export function makeClient () {
const uploadLink: unknown = createUploadLink({
uri: ${URL_API_HTTP}/graphql
})

const errorLink = onError(({ graphQLErrors, networkError }) => {
if (graphQLErrors) {
for (const err of graphQLErrors) {
console.error('graphQLErrors', err.message)
}
}

if (networkError) console.error(`[Network error]: ${networkError}`)

})

const combinedLink = ApolloLink.from([
errorLink,
uploadLink as ApolloLink | RequestHandler
])

const splitLink = split(
({ query }) => {
const definition = getMainDefinition(query)
return (
definition.kind === 'OperationDefinition' &&
definition.operation === 'subscription'
)
},
new GraphQLWsLink(
createClient({
url: ${URL_API_WS}/graphql
})
),
combinedLink
)

return new ApolloClient({
uri: URL_API_HTTP,
ssrMode: typeof window === 'undefined',
link: splitLink,
cache: new InMemoryCache(),
connectToDevTools: true
})
}

export function ApolloWrapper ({ children }: React.PropsWithChildren) {
return (

{children}

)
}
`

then in your middleware you can use it like this:

middleware.ts

`
import { NextRequest, NextResponse } from 'next/server'
import { makeClient } from './lib/ApolloWrapper'
import { GET_USER_TOKEN } from './gql/queries/userToken.query'

export async function middleware (req: NextRequest) {
const token = req.cookies.get('accessToken')?.value
const client = makeClient()

const {
      data: { dataWithToken }
    } = await client.query({
      query: GET_USER_TOKEN,
      context: {
        headers: {
          Authorization: `Bearer ${accessToken}`
        }
      }
    })

return NextResponse.next()
}

export const config = {
matcher: ['/', '/login', '/empieza']
}

`