Reuse ApolloClient function for both query and mutation

Question

Trying to re-use the same ApolloClient function for both query and mutation request. Just stuck on TypeScript issue. I'm just trying to pass via props what reqType to use.

There is an error in client[clientReq] so when hovering i get message:

const client: ApolloClient<NormalizedCacheObject>
This expression is not callable.
  Each member of the union type '(<T = any, TVariables = OperationVariables>(options: QueryOptions<TVariables, T>) => Promise<ApolloQueryResult<T>>) | (<TData = any, TVariables = OperationVariables, TContext = DefaultContext, TCache extends ApolloCache<...> = ApolloCache<...>>(options: MutationOptions<...>) => Promise<...>)' has signatures, but none of those signatures are compatible with each other.ts(2349)

import { ApolloClient, InMemoryCache } from '@apollo/client/core'
import type { DocumentNode } from 'graphql'

const client = new ApolloClient({
  uri: 'https://48p1r2roz4.sse.codesandbox.io',
  cache: new InMemoryCache(),
})

export const req = async ({
  query,
  reqType,
}: {
  query: DocumentNode
  reqType: 'query' | 'mutation'
}) => {
  const clientReq = reqType === 'query' ? 'query' : 'mutate'

  const { data, errors } = await client[clientReq]({
    [reqType]: query,
  })
}

The code works but would like to solve this message problem.