How to Subscribe to All GraphQL Mutations in AWS-Amplify Vue Components?

Question

I am trying to subscribe to changes on delete, create and update mutations.

In my GraphQL schema, I created a subscription field that listens to all those mutations with type Subscription { onAll: Task @aws_subscribe(mutations: ["createTask","updateTask","deleteTask"]) }

Now when tried using amplify-vue components, in case of getting back a response :onSubscriptionMsg=SomeFunction(response) I am receiving old list of tasks from response.data.listOfTasks.

So how should I know which mutation was provoked and thus update the data.listOfTasks?

Thanks a heap in advance for answering this question :)

score 0 · Answer 1 · answered Feb 05 '19 at 22:50

A suggestion would be to break apart the subscription into multiple subscriptions (i.e. CreateTaskSubscription, UpdateTaskSubscription, etc.) and that way you would be able to implement your Vue logic separately based on which mutation was invoked - as there is a 1-1 mapping now between subscription and mutation as opposed to the 1-to-many that your onAll subscription has currently.

Some reference docs:

Splitting up subscriptions: https://docs.aws.amazon.com/appsync/latest/devguide/real-time-data.html
Vue handling for each subscription type (go to the API connect section): https://aws-amplify.github.io/docs/js/vue

Thanks for the reply @Ashwani. RIght, 1-to-1 mapping seems to be the solution. But in case of querying on each mutation and updating lists of tasks, how should I add multiple subscriptions? I have checked the example given under Amplify-Vue API section in docs and it shows using ```:subscription``` and ```:subscriptionMsg``` directives. But that is demonstrated for one mutation. How to modify them for multiple mutations? — Waleed93, Feb 06 '19 at 01:08

How to Subscribe to All GraphQL Mutations in AWS-Amplify Vue Components?

1 Answers1