I want to be able to upload files from my React Native App for which I need to use createUploadLink but I am facing some problems configuring it.
My current setup looks like this:
import SInfo from "react-native-sensitive-info";import Config from "react-native-config";import { InMemoryCache, ApolloClient } from "apollo-boost";import { createHttpLink } from "apollo-link-http";import { createUploadLink } from "apollo-upload-client";import { WebSocketLink } from "apollo-link-ws";import { setContext } from "apollo-link-context";import { getMainDefinition } from "apollo-utilities";import { split } from "apollo-link";let token: any;const getToken = async () => { if (token != null) { return token; } token = await SInfo.getItem("ACCESS_TOKEN", {}); return token;};export const cache = new InMemoryCache();// Create a WebSocket link:const wsLink = new WebSocketLink({ uri: Config.SUBSCRIPTION_SERVER, options: { reconnect: true, },});const httpLink = createHttpLink({ uri: Config.GRAPHQL_SERVER });const uploadLink = createUploadLink({ uri: Config.GRAPHQL_SERVER });const authLink = setContext(async (_, { headers }) => { await getToken(); return { headers: { ...headers, authorization: token ? `Bearer ${token}` : null, }, };});const linkConcated = authLink.concat(httpLink);// using the ability to split links, you can send data to each link// depending on what kind of operation is being sentconst link = split( // split based on operation type ({ query }) => { const definition = getMainDefinition(query); return ( definition.kind === "OperationDefinition" && definition.operation === "subscription" ); }, wsLink, linkConcated);export const client = new ApolloClient({ link, cache,});I also tried the approach with ApolloLink.from([]) but it is not letting me add it. And also tried replacing it with createHttpLink as I need only one as per my understanding.
I get the following error:
const uploadLink: ApolloLinkArgument of type 'ApolloLink' is not assignable to parameter of type 'ApolloLink | RequestHandler'. Type 'import("/home/musayyab/Desktop/projects/Talent/Native-App/app/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink' is not assignable to type 'import("/home/musayyab/Desktop/projects/Talent/Native-App/app/node_modules/apollo-link/lib/link").ApolloLink'. Types of property 'split' are incompatible. Type '(test: (op: import("/home/musayyab/Desktop/projects/Talent/Native-App/app/node_modules/@apollo/client/link/core/types").Operation) => boolean, left: import("/home/musayyab/Desktop/projects/Talent/Native-App/app/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("/home/musayyab/Desktop/projects/Ta...' is not assignable to type '(test: (op: import("/home/musayyab/Desktop/projects/Talent/Native-App/app/node_modules/apollo-link/lib/types").Operation) => boolean, left: import("/home/musayyab/Desktop/projects/Talent/Native-App/app/node_modules/apollo-link/lib/link").ApolloLink | import("/home/musayyab/Desktop/projects/Talent/Native-App/app/node...'. Types of parameters 'test' and 'test' are incompatible. Types of parameters 'op' and 'op' are incompatible. Property 'toKey' is missing in type 'import("/home/musayyab/Desktop/projects/Talent/Native-App/app/node_modules/@apollo/client/link/core/types").Operation' but required in type 'import("/home/musayyab/Desktop/projects/Talent/Native-App/app/node_modules/apollo-link/lib/types").Operation'.ts(2345)types.d.ts(24, 5): 'toKey' is declared here.I would appreciate any help.