I used this code in my stelve kit app. I want to sent the email to query data from graphql. I try to use this code but it got error.
<script lang="js">
import { gql, operationStore, query, setClient } from '@urql/svelte';
import client from '../client';
setClient(client);
import { userSession } from '../store.js';
let user;
userSession.subscribe((val) => {
user = val;
});
console.log("user = ");
console.log(user.id);
console.log(user.email);
const postsQuery = gql`
query GetAllPosts($size: Int!, $cursor: String, $email: String!) {
GetPostByUsersEmail(_size: $size, _cursor: $cursor, email: $email) {
data {
email
username
posts {
data {
title
}
}
}
}
}
`
const allPosts = operationStore(
postsQuery,
{ size: 100 },
{ requestPolicy: 'network-only' },
{ email: 'test@email.com' }
)
query(allPosts);
console.log(allPosts)
</script>
with schema
type User @auth(primary: "email") {
username: String!
email: String!
posts: [Post!] @relation
}
type Post @protected(membership: "User", rule: ["read", "write", "create"]) {
title: String!
content: String!
author: User!
}
type Query {
listPosts: [Post]
users(username: String!): [User]
posts(title: String!): [Post]
GetPostByUsersEmail(email: String!): [User]
}
I think everthing is good but the data of allPosts is not append and got this error form data of console.log(allPosts)
GraphQLError: Variable '$email' expected value of type 'String!' but value is undefined.
Can anyone help ?
There are several things wrong in your code.
Where your error is concerned, your call to operationStore is badly formatted. The first argument should be your gql-formatted query (which it is), the second argument expects an object containing all your variables, and the third argument expects an options object (requestPolicy, etc.). Yet you attempt to pass your variables in two separate arguments (2nd and 4th). So your call to operationStore should be:
const allPosts = operationStore(
postsQuery,
{ size: 100, email: 'test@email.com' },
{ requestPolicy: 'network-only' },
)
This would fix your initial error. However...
In addition, your client-side query does not match your schema definition. The _size and _cursor variables do not exist in your schema, and you added extraneous data keys in your request that do not match your User and Post schema types. Your query should be:
const postsQuery = gql`
query GetAllPosts($email: String!) {
GetPostByUsersEmail(email: $email) {
email
username
posts {
title
}
}
}
`
And thus your final, amended operationStore call should be:
const allPosts = operationStore(
postsQuery,
{ email: 'test@email.com' },
{ requestPolicy: 'network-only' },
)