How to udpate an entry in graphql using variables - graphql

I'm using GraphQL plugin with strapi cms if it matters.
I cannot figure out how to update an existing query using a dynamic variable. My original mutation without using variables:
mutation {
updateExam(input: {
where: {
id: "1234"
},
data: {
questions: "hello"
}
}) {
exam {
questions
}
}
}
I learned that if I would like to create a new entry using variables I should write it like so (answer by David Maze here: How to pass JSON object in grpahql and strapi):
const response = await strap.request('POST', '/graphql', {
data: {
query: `mutation CreateExam($input: CreateExamInput!) {
createExam(input: $input) {
exam { name, desription, time, questions }
}
}`,
variables: {
input: {
name: examInfo.newExamName,
desription: examInfo.newExamDescription,
time: Number(examInfo.newExamTime),
questions: [{ gf: "hello" }],
subjects: [this.state.modalSubjeexisting
}
}
}
});
But how can I update an exising query? Where should I put the
where: {id: "1234"}
How can I provide the existing id of the entry?

I don't know about this strapi cms, but by the way it looks the mutation you have already working, I'd try something like this for the update one:
const response = await strap.request('POST', '/graphql', {
data: {
query: `mutation UpdateExam($input: UpdateExamInput!) {
updateExam(input: $input) {
exam {
questions
}
}
}`,
variables: {
input: {
where: {
id: examInfo.id
},
data: {
questions: [{ gf: "hello" }]
}
}
}
}
});
Give it a try and see if it works.

Related

How to implement a filter on a query in Apollo?

I'm attempting to filter a query by a specific field. I can achieve this in Apollo explorer in dev tools but I can't seem to translate this into code.
The following works in Apollo explorer:
query ListUsersByType($filter: TableUsersFilterInput) {
listUsers(filter: $filter) {
items {
email
id
type
}
}
}
{
"filter": {
"type": {
"eq": "ADMIN"
}
}
}
I am unsure how this translates to the code using the useQuery hook however.
When I try the following it doesn't filter the list at all, it just fetches all of them regardless of type:
const ListUsersByType = gql`
query ListUsersByType($type: TableUsersFilterInput) {
listUsers(filter: $type) {
items {
email
id
type
}
}
}
`
const { data, loading, error } = useQuery(ListUsersByType, {
variables: {
filter: {
type: {
eq: 'ADMIN',
},
},
},
})
What am I missing here?
Your names are not correct
Here you say filter will use the variable type
const ListUsersByType = gql`
query ListUsersByType($type: TableUsersFilterInput) {
listUsers(filter: $type) {
items {
email
id
type
}
}
}
`
And here you pass filter
const { data, loading, error } = useQuery(ListUsersByType, {
variables: {
filter: {
type: {
eq: 'ADMIN',
},
},
},
})
You can
First solution
replace $type by $filter
const ListUsersByType = gql`
query ListUsersByType($filter: TableUsersFilterInput) {
listUsers(filter: $filter) {
items {
email
id
type
}
}
}
`
Second solution
rename the variable filter to type
const { data, loading, error } = useQuery(ListUsersByType, {
variables: {
type: {
type: {
eq: 'ADMIN',
},
},
},
})
My opinion
I let you choose but the first option seems the best

Prisma graphql updateNode mutation

I'm trying to setup the updateNode mutation in graphql with Prisma running on GraphQL-yoga server. Here's the error I'm receiving when I try to run the mutation:
"Variable \"$_v0_data\" got invalid value { data: { name: \"Test\" }, where: { id: \"cjqulnr0yftuh0a71sdkek697\" } }; Field \"data\" is not defined by type CocktailUpdateInput.\nVariable \"$_v0_data\" got invalid value { data: { name: \"Test\" }, where: { id: \"cjqulnr0yftuh0a71sdkek697\" } }; Field \"where\" is not defined by type CocktailUpdateInput."
Here's my mutation resolver:
const Mutation = {
async updateCocktail(parent, args, ctx, info) {
const data = { ...args };
delete data.id;
const where = {id: args.id};
return await ctx.db.mutation.updateCocktail({ data, where }, info);
},
}
datamodel.prisma:
type Cocktail {
id: ID! #unique
name: String!
info: String
glass: Glass
ingredients: [Ingredient]
steps: [Step]
}
schema.graphql
type Mutation {
updateCocktail(data: CocktailUpdateInput!, where: CocktailWhereUniqueInput!): Cocktail
}
and finally here's what I'm trying to execute in playground:
mutation{
updateCocktail(
where: {id: "cjqulnr0y0tuh0a71sdkek697"},
data: {
name: "Test"
}
){
id
name
}
}
If I read your resolver correctly, you resolvers does the following:
Take the args and put them in data (without the id)
Take the id in the args and put it in where
But, in the playground, you give the following args:
args = {
where: {id: "cjqulnr0y0tuh0a71sdkek697"},
data: {
name: "Test"
}
}
They are already well formed! Which means your resolvers is gonna do the step as follow and build the following variables:
data = {
where: {id: "cjqulnr0y0tuh0a71sdkek697"},
data: {
name: "Test"
}
}
where = { id: null }
You can fix this two ways:
1/ Don't rebuild data and where in the resolvers and just pass the args down to prisma
2/ When calling your mutations, give it the args as follow:
updateCocktail(id: "abc", name: "Test") {...}
According to your error, the problem should lie in your playground execution. It is taking your "where" and "data" as data types.
You could try doing something more like this:
mutation UpdateCocktailMutation($data: CocktailUpdateInput!, $where: CocktailWhereUniqueInput!) {
updateCocktail(data: $data, where: $where) {
id
name
}
}
and in your bottom of the playground they have a query variable field.
Fill it will your variable data. Do correct my case sensitivity and naming conventions as I may have missed out on parts of it.

Issues with GraphQL Nested Mutation

I am trying to achieve nesting mutation by adding player name in Team (Parent) and struggling trying to fetch list of player name...
Inside GraphiQL tool (localhost:4000/graphiql), this is the Add Mutation variable that I have included...
mutation AddPlayerToTeam($name: String!, $teamId: ID!){
addPlayerToTeam(player: $name, teamId: $teamId){
id
players{
name
}
}
}
The query variables, adding teamID and name...
{
"teamId": "5aff545371fc930a4c43b2b9",
"name": "John Doe"
}
The result shown...
{
"data": {
"addPlayerToTeam": {
"id": "5b072774e385740c38483111",
"players": []
}
}
}
But I was expecting for player name to show up like this....
{
"data": {
"addPlayerToTeam": {
"id": "5b072774e385740c38483111",
"players": [
{
"name": "John Doe"
}
]
}
}
}
The mutation code...
AddPlayerToTeam: {
type: TeamType,
args: {
name: { type: new GraphQLNonNull(GraphQLString) },
teamId: { type: new GraphQLNonNull(GraphQLID) }
},
resolve(parent, { name, teamId }) {
let addPlayer = new Player({ name, teamId });
return addPlayer.save();
}
},
I've struggled to find reason why I am getting "players": [] instead of "players": [ {"name": "John Doe" } ].
Need I include .then(...) after .save() to get result? Any examples? Your help is appreciated.
BTW, I using mongoDB/mongoose method. Saving them in local mongoDB.
Found solution for this... Thank #andrewingram from graphql.slack for helping. Just include .then(...) to return result.
AddPlayerToTeam: {
type: TeamType,
args: {
name: { type: new GraphQLNonNull(GraphQLString) },
teamId: { type: new GraphQLNonNull(GraphQLID) }
},
async resolve(parent, { name, teamId }) {
let addPlayer = new Player({ name, teamId });
await addPlayer.save();
return Team.findById(teamId);
}
},
or in promise version
resolve(parent, { name, teamId }) {
let addPlayer = new Player({ name, teamId });
return addPlayer.save().then(() => Team.findById(teamId));
}
Hope that help.

I need help understanding Relay OutputFields, getFatQuery

This is the code from official docs of relay, This is for GraphQLAddTodoMutation
const GraphQLAddTodoMutation = mutationWithClientMutationId({
name: 'AddTodo',
inputFields: {
text: { type: new GraphQLNonNull(GraphQLString) },
},
outputFields: {
todoEdge: {
type: GraphQLTodoEdge,
resolve: ({localTodoId}) => {
const todo = getTodo(localTodoId);
return {
cursor: cursorForObjectInConnection(getTodos(), todo),
node: todo,
};
},
},
viewer: {
type: GraphQLUser,
resolve: () => getViewer(),
},
},
mutateAndGetPayload: ({text}) => {
const localTodoId = addTodo(text);
return {localTodoId};
},
});
I think mutateAndGetPayload executes first then outputFields? since it used localTodoId object as parameter, I see localTodoId object returned from mutateAndGetPayload.
and this is the code for relay mutation.please look at the getFatQuery
export default class AddTodoMutation extends Relay.Mutation {
static fragments = {
viewer: () => Relay.QL`
fragment on User {
id,
totalCount,
}
`,
};
getMutation() {
return Relay.QL`mutation{addTodo}`;
}
getFatQuery() {
return Relay.QL`
fragment on AddTodoPayload #relay(pattern: true) {
todoEdge,
viewer {
todos,
totalCount,
},
}
`;
}
getConfigs() {
return [{
type: 'RANGE_ADD',
parentName: 'viewer',
parentID: this.props.viewer.id,
connectionName: 'todos',
edgeName: 'todoEdge',
rangeBehaviors: ({status}) => {
if (status === 'completed') {
return 'ignore';
} else {
return 'append';
}
},
}];
}
getVariables() {
return {
text: this.props.text,
};
}
getOptimisticResponse() {
return {
// FIXME: totalCount gets updated optimistically, but this edge does not
// get added until the server responds
todoEdge: {
node: {
complete: false,
text: this.props.text,
},
},
viewer: {
id: this.props.viewer.id,
totalCount: this.props.viewer.totalCount + 1,
},
};
}
}
I think the todoEdge is from the outputFields from GraphQL? I see a viewer query on it, why does it need to query the viewer? How do I create a getFatQuery? I would really appreciate if someone help me understand this more and about Relay mutation.
mutateAndGetPayload executes then returns the payload to the outputFields
mutationWithClientMutationId
Source-Code
starWarsSchema example
mutationWithClientMutationId
inputFields: defines the input structures for mutation, where the input fields will be wraped with the input values
outputFields: defines the ouptput structure of the fields after the mutation is done which we can view and read
mutateAndGetPayload: this function is the core one to relay mutations, which performs the mutaion logic (such as database operations) and will return the payload to be exposed to output fields of the mutation.
mutateAndGetPayload maps from the input fields to the output fields using the mutation
operation. The first argument it receives is the list of the input parameters, which we can read to perform the mutation action
The object we return from mutateAndGetPayload can be accessed within the output fields
resolve() functions as the first argument.
getFatQuery() is where we represent, using a GraphQL fragment, everything
in our data model that could change as a result of this mutation

GraphQL how to mutate data

I have a basic schema for mutating some data which looks like
const schema = new graphql.GraphQLSchema({
mutation: new graphql.GraphQLObjectType({
name: 'Remove',
fields: {
removeUser: {
type: userType,
args: {
id: { type: graphql.GraphQLString }
},
resolve(_, args) {
const removedData = data[args.id];
delete data[args.id];
return removedData;
},
},
},
})
});
Looking around google I cant find a clear example of the example query which needs to be sent to mutate.
I have tried
POST -
localhost:3000/graphql?query={removeUser(id:"1"){id, name}}
This fails with error:
{
"errors": [
{
"message": "Cannot query field \"removeUser\" on type \"Query\".",
"locations": [
{
"line": 1,
"column": 2
}
]
}
]
}
In order to post requests from the front-end application it is recommended to use apollo-client package. Say i wanted to validate a user login information:
import gql from 'graphql-tag';
import ApolloClient, {createNetworkInterface} from 'apollo-client';
client = new ApolloClient({
networkInterface: createNetworkInterface('http://localhost:3000/graphql')
});
remove(){
client.mutate({
mutation: gql`
mutation remove(
$id: String!
) {
removeUser(
id: $id
){
id,
name
}
}
`,
variables: {
id: "1"
}
}).then((graphQLResult)=> {
const { errors, data } = graphQLResult;
if(!errors && data){
console.log('removed successfully ' + data.id + ' ' + data.name);
}else{
console.log('failed to remove');
}
})
}
More information about apollo-client can be found here
Have you tried using graphiql to query and mutate your schema?
If you'd like to create a POST request manually you might wanna try to struct it in the right form:
?query=mutation{removeUser(id:"1"){id, name}}
(Haven't tried POSTing myself, let me know if you succeeded, i structured this out of the url when using graphiql)
You have to explicitly label your mutation as such, i.e.
mutation {
removeUser(id: "1"){
id,
name
}
}
In GraphQL, if you leave out the mutation keyword, it's just a shorthand for sending a query, i.e. the execution engine will interpret it as
query {
removeUser(id: "1"){
id,
name
}
}
cf. Section 2.3 of the GraphQL Specification
const client = require("../common/gqlClient")();
const {
createContestParticipants,
} = require("../common/queriesAndMutations");
const gql = require("graphql-tag");
const createPartpantGql = async (predictObj) => {
try {
let resp = await client.mutate({
mutation: gql(createContestParticipants),
variables: {
input: {
...predictObj,
},
},
});
let contestParticipantResp = resp.data.createContestParticipants;
return {
success: true,
data: contestParticipantResp,
};
} catch (err) {
console.log(err.message)
console.error(`Error creating the contest`);
return {
success: false,
message: JSON.stringify(err.message),
};
}
};

Resources