helfer / apollo-link-queue Goto Github PK
View Code? Open in Web Editor NEWA link to queue GraphQL requests when offline
License: MIT License
A link to queue GraphQL requests when offline
License: MIT License
Quick q, does this work in Apollo 3.0?
Hey there,
This is the code.
import QueueLink from "apollo-link-queue";
const queueLink = new QueueLink();
const client = (hostName: string, initialState?: any) => {
return new ApolloClient({
link: ApolloLink.from([
errorLink,
queueLink,
retryLink,
authLink.concat(createUploadLink({ uri: `${hostName}/api/graphql` })),
]),
cache: cache.restore(initialState || {}),
});
};
i am having the following error:
Type 'QueueLink' is not assignable to type 'ApolloLink | RequestHandler'.
Type 'QueueLink' is not assignable to type 'ApolloLink'.
Types of property 'split' are incompatible.
Type '(test: (op: import("/Users/gilga/Projekte/bliks/app/node_modules/apollo-link-queue/node_modules/@apollo/client/link/core/types").Operation) => boolean, left: import("/Users/gilga/Projekte/bliks/app/node_modules/apollo-link-queue/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("/Users/gilga/Pro...' is not assignable to type '(test: (op: import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/types").Operation) => boolean, left: import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/types")....'.
Types of parameters 'left' and 'left' are incompatible.
Type 'import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/types").RequestHandler' is not assignable to type 'import("/Users/gilga/Projekte/bliks/app/node_modules/apollo-link-queue/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("/Users/gilga/Projekte/bliks/app/node_modules/apollo-link-queue/node_modules/@apollo/client/link/core/types").RequestHandler'.
Type 'ApolloLink' is not assignable to type 'ApolloLink | RequestHandler'.
Type 'import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink' is not assignable to type 'import("/Users/gilga/Projekte/bliks/app/node_modules/apollo-link-queue/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink'.
Types of property 'split' are incompatible.
Type '(test: (op: import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/types").Operation) => boolean, left: import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/types")....' is not assignable to type '(test: (op: import("/Users/gilga/Projekte/bliks/app/node_modules/apollo-link-queue/node_modules/@apollo/client/link/core/types").Operation) => boolean, left: import("/Users/gilga/Projekte/bliks/app/node_modules/apollo-link-queue/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("/Users/gilga/Pro...'.
Types of parameters 'left' and 'left' are incompatible.
Type 'import("/Users/gilga/Projekte/bliks/app/node_modules/apollo-link-queue/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("/Users/gilga/Projekte/bliks/app/node_modules/apollo-link-queue/node_modules/@apollo/client/link/core/types").RequestHandler' is not assignable to type 'import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/types").RequestHandler'.
Type 'ApolloLink' is not assignable to type 'ApolloLink | RequestHandler'.
Type 'import("/Users/gilga/Projekte/bliks/app/node_modules/apollo-link-queue/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink' is not assignable to type 'import("/Users/gilga/Projekte/bliks/app/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink'.
Property 'onError' is protected but type 'ApolloLink' is not a class derived from 'ApolloLink'.ts(2322)
The packages:
"@apollo/client": "^3.3.11",
"apollo-link-queue": "^3.1.0",
When i do a pm list | grep apollo-link
i ll get the following:
Any clue?
Thank you :)
If we have a request that is re-requested every 10 seconds, then there will be 6 instances of one request in a minute in the queue. If the variables have not changed, you need to delete duplicates
The typescript definition for Apollolink.from does not allow for the type QueueLink.
// link.d.ts
export declare const from: (links: ApolloLink[]) => ApolloLink;
Is it possible to add in a delay between requests after the queue is opened? I've been able to trace all requests being sent to the server in the correct order but need to create a delay between them since the latter requests depend on the earlier ones.
It'd be great to customize that on a per requests basis.
Hi, I've issue when closed the app and then run again, the data in queue don't persist. Any solutions?
I would like to use this with apollo 3.4.x, but I am getting the following error:
Metro has encountered an error: While trying to resolve module `@apollo/client/utilities` from file `/Users/MY/APP/node_modules/apollo-link-queue/build/dist/QueueLink.js`, the package `/Users/MY/APP/node_modules/apollo-link-queue/node_modules/@apollo/client/utilities/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`/Users/MY/APP/node_modules/apollo-link-queue/node_modules/@apollo/client/utilities/utilities.cjs`. Indeed, none of these files exist:
* /Users/MY/APP/node_modules/apollo-link-queue/node_modules/@apollo/client/utilities/utilities.cjs(.native|.ios.js|.native.js|.js|.ios.json|.native.json|.json|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx)
* /Users/MY/APP/node_modules/apollo-link-queue/node_modules/@apollo/client/utilities/utilities.cjs/index(.native|.ios.js|.native.js|.js|.ios.json|.native.json|.json|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx): /Users/MY/APP/node_modules/metro/src/node-haste/DependencyGraph.js (436:17)
434 |
435 | if (error instanceof InvalidPackageError) {
> 436 | throw new PackageResolutionError({
| ^
437 | packageError: error,
438 | originModulePath: from,
439 | targetModuleName: to
RCTFatal
__28-[RCTCxxBridge handleError:]_block_invoke
_dispatch_call_block_and_release
_dispatch_client_callout
_dispatch_main_queue_drain
_dispatch_main_queue_callback_4CF
__CFRUNLOOP_IS_SERVICING_THE_MAIN_DISPATCH_QUEUE__
__CFRunLoopRun
CFRunLoopRunSpecific
GSEventRunModal
-[UIApplication _run]
UIApplicationMain
main
start_sim
0x0
Is there work to get this to work with the latest version of Apollo?
const httpLinks = middlewareLink.concat(
afterwareLink.concat(httpLink)
);
const link = split(
({ query }) => {
const { kind, operation } = getMainDefinition(query);
return kind === 'OperationDefinition' && operation === 'subscription';
},
webSocketLink,
httpLinks
);
const loggerLink = new ApolloLink((operation, forward) => {
console.log(`loggerLink: ${operation.operationName}`);
return forward(operation).map((result) => {
console.log(`received result from loggerLink: ${operation.operationName}`);
return result;
});
});
const cache = new InMemoryCache();
// const stateLink = withClientState({ ...merge(networkStatusResolver), cache });
const stateLink = withClientState({
cache,
resolvers,
defaults: {
show_type: 'BELOW_15'
}
});
const ApolloClient = apollo.create({
cache,
link: ApolloLink.from([
stateLink,
new RetryLink(),
offlineLink, //Type 'QueueLink' is not assignable to type 'ApolloLink'.
link /*loggerLink*/, /*stateLink*/
]),
```
It would be great to add an option to query batching the queued requests, in this way we can assure the reports are getting executed sequentially, I mean transport level query batching, get all the requests that are queued and send an array of mutations to the server, any thoughs on this?
I would be more than happy to help you figure it out something 👍
I'm curious if you've considered issues with concurrency. Per
https://github.com/apollographql/apollo-cache-asyncstorage/issues/6#issuecomment-358465996 and
apollographql/apollo-link#125 (comment)
When queries get unqueued the headers might be outdated, e.g. a JWT token has expired in the meantime. This can cause the app to log out. How do you suggest to solve this problem?
Hi this looks very promising. However to create a full offline support what is missing is a way to persist the queued queries, so when a user is for example on holiday and doesn’t have internet, the local state of the app Including his mutations will be save when the app is restarted. Would you have any idea how to persist the queued queries, could the operation simply be serialized?
Is is possible to queue only muatations and not queries?
This link looks really interesting :-). I'm working on an app where the user can make several changes to data but the changes are only done locally in the client and not persisted to the server until the user hits a save button. I don't really like this model but it's the way the legacy app works so I'm required to do it this way.
So my scenario is not really offline but offline-ish. But it shares a lot of problems with offline. We could consider the user to be offline until he hits save, then he goes online.
I've got an idea how to solve this. I'm thinking I could make mutations for every change with optimistic updates, the way you are supposed to with apollo (by writing to the store with writeQuery). But since the mutation should not happen until the user hits save, I need to delay them. So apollo-link-queue looks like a good fit :-). However in order to make it work I think I would need two more features:
Having named queues, for example if editing several documents, each document could have it's own named queue (using the document id for the queue name). The queue name could be sent in the context parameter. If there is no queue name then just let the mutation pass. The current close/open methods could set a default queue name instead. So instead of .close()/.open() you could do .defaultQueue("offline")/.defaultQueue().
Having the ability to discard all queued mutations. If the user presses cancel instead of save then the mutations should not be sent to the server at all. At this point it would be nice if the optimistic updates automatically got reverted too, not sure if this could work.
Not sure this would work though. Happy for any thoughts on this!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.