I have this query that works
async find(ctx) {
let { _start, _limit } = ctx.request.query;
console.log(ctx.request.query)
_limit ? 0 : (_limit = 10);
const entities = await strapi.services["course-series"].find({});
return entities.map((entity) => {
// Do I sort them here or in the url query (and how)
entity.courses = entity.courses.slice(_start, _limit);
return sanitizeEntity(entity, { model: strapi.models["course-series"] });
});
}
The idea is that I can load 10 courses from each series at first and then get the next 10...
I just realized that the first 10 I am getting are not the recent ones.
As I commented // Do I sort them here or in the url query (and how)
What version of Strapi do you use?
What does this line do strapi.services["course-series"].find({})? How did you build this find method in the service? What does it do? Does it accept params?
Personally I'd do something like that (assuming you're working with Strapi version > 4:
const entities = await strapi.entityService.findMany('api::course-series.course-series', {
fields: [/* list the course-series fields you want to populate */],
populate: {
courses: {
fields: [/* list the course fields you want to populate */],
sort: 'createdAt:desc', // You can use id, publishedAt or updatedAt here, depends on your sorting prefrences
offset: _start,
limit: _limit // I must admit I haven't tested `offset` and `limit` on the populated related field
}
}
})
// ...the rest of your code, if needed
Read more about Entity Service API here.
Doing it the way you did it, you will always first retrieve the full list of courses for each course-series, and then run costly operations like mapping (the lesser of 2 evils) and above all sorting.
Related
I am fairly new to Apollo and Graphql and I quite don't know what I am doing wrong. I will try to explain my problem with some simplified code but if I am missing some information please let me know and I will update it.
I have an Apollo client instance consuming an external (Directus CMS) graphql API not modifiable by me.
The thing is I am querying a paginated (infinite scroll) of posts with offset and limit variables and the data returned is correct. I am using the following typePolicy in order to merge results arrays in my inMemoryCache. This code is from an example in the Apollo Docs:
posts {
const merged = existing ? existing.slice(0) : [];
const postIdToIndex = Object.create(null);
if (existing) {
existing.forEach((post, index) => {
postIdToIndex[readField("id", post)] = index;
});
}
incoming.forEach((post) => {
const id = readField("id", post);
const index = postIdToIndex[id];
if (typeof index === "number") {
// Merge the new post data with the existing post data.
merged[index] = mergeObjects(merged[index], post);
} else {
// First time we've seen this post in this array.
postIdToIndex[id] = merged.length;
merged.push(post);
}
});
return merged;
}
and this is a simplified version of my query:
query($offset: Int $limit: Int) {
posts(limit: $limit offset: $offset) {
id
name
}
}
With this merge function and query I get my pagination right and everything loads correctly. But when I try to query a single instance of post that queries also additional fields from it with the following query:
query($offset: Int $limit: Int $post_id: Int) {
posts(filter:{id:{_eq: $post_id}}) {
id
name
other_data
}
}
This returns undefined constantly when using useQuery() although i can see that is coming through my merge funtion and merging objects with the mergeObjects() function. If I use a fetchPolicy of no-cache in this query, the data returns correctly so it has something to do with the cache.
I hope someone can lead me in the right direction so I can fix this problem.
Thank you everyone in advance!!
I'm attempting to load information about a type in 2 steps (since the info I'm asking for in secondQuery will take some time to load):
Component:
const MyComponent = ({startDate}) => {
const firstQuery = useQuery(
GET_INFO_PART_ONE,
{
variables: {startDate}
}
);
const secondQuery = useQuery(
GET_INFO_PART_TWO,
{
variables: {startDate}
}
);
}
Queries:
export const GET_INFO_PART_ONE = gql`
query getInfoPartOne(
$startDate: DateTime!
) {
infoPageResults(
startDate: $startDate
) {
edges {
info {
infoID
infoFieldOne
infoFieldTwo
infoFieldThree
}
}
}
}
`;
export const GET_INFO_PART_TWO = gql`
query getInfoPartTwo(
$startDate: DateTime!
) {
infoPageResults(
startDate: $startDate
) {
edges {
info {
infoID
infoFieldFour{
netRate
}
}
}
}
}
`;
When I do this and both queries resolve, the cache's ROOT_QUERY includes the data as I would expect it, with infoPageResults containing an array of edges where each edge's info __typename includes the fields specified in the GET_INFO_PART_ONE and GET_INFO_PART_TWO queries. I would then expect firstQuery.data.infoPageResults.edges in the above component to include the fields loaded from the second query.
The Problem
After both firstQuery and secondQuery are finished loading, firstQuery.data.infoPageResults.edges does not contain the fields loaded by secondQuery, even though the cached values look as I would expect them.
Is there something obvious I'm misunderstanding about how the query hooks work?
Is there a better strategy for loading additional fields onto a _typename in 2 steps?
Just caches what was queried ... no node entries cached (additionally, separately - as cache is normalizing cache), because no id field (required by default as unique entry id) ... it can be customized to use infoID for info type (see docs).
Properly cached node (info) entries can be used to display node details (from 1st query) on 2nd query result rendering list ... using additional 'cache-only' policy queries (info node by id) in subcomponents (react).
Start with more standard example/tutorial to explore possibilities.
update
No, data fetched separately are accessible separately ... it's not cache problem and not querying problem...
1st query won't return fields/properties fetched in 2nd query ... by design;
list rendered using 1st result won't be refreshed when 2nd query result will arrive ... if doesn't contain ref/not consume 2nd data;
You can use/pass both data in parallel or combine them (in immutable way) before passing to some view component ('Presentational and Container Component Pattern') ... list can be rendered using one prop and updated when 2nd prop changes.
I'm just getting started with gatsby and graphql and I've started using prismic as a cms. I cannot figure out how to perform nested queries, avoiding overfetching. I don't even know if it would be possible or if it's more just me thinking of the problem in SQL terms.
I have two custom types on prismic which are related using a content relationship. These are Productions which have many People through a repeatable group of fields. The result I want is to have a page (the home) which shows the latest production with the list of people who starred in it, and another page with each person from people and all their roles in every production.
I managed to do this by fetching all the people in the home page and the required production and filtering the returned data in the frontend via javascript. However, I really feel that this way is not ideal since it requires to fetch all the people and not only the ones required for my page.
allPrismicProduction(
limit: 1
sort: { fields: [last_publication_date], order: DESC }
) {
edges {
node {
data {
casting {
...castingData
}
}
}
}
}
allPrismicPerson {
edges {
node {
id
data {
name {
text
}
photo {
url
}
}
}
}
}
}
const productions = data.allPrismicProduction.edges
const people = data.allPrismicPerson.edges
const sortedprods = []
productions.forEach(el => {
let castings = el.node.data.casting.map(cast => cast.person.uid)
castings.forEach(casting =>{
people.filter(person => {
if(castings.indexOf(person.node.uid) > -1){
return person
}
sortedprods.push({
production: el.node,
people: relpeople,
})
})
})
So what I do is I fetch all people and then filter them according to the uids found in the productions returned by the query.
I would like to know if it is possible, or otherwise what would be a better way to achieve this, how to limit overfetching by making it possible to only fetch the people who's uid is present in the productions given by the first part of the query.
Is this way of thinking compatible with graphql?
I managed to solve this by looking around a bit more in the other issues of gatsby-source-prismic on github.
The related-content node can be queried using the following structure:
{
allPrismicMyContentType {
edges {
node {
data {
my_relations {
relation {
document {
data {
where in data you can access all the properties of the type needed.
In this way one can do a single query to get all related content on prismic
This works fine
query QryTopics {
topics {
nodes {
name
topicId
count
}
}
}
But I want a filtered result. I'm new to graphql but I see a param on this collection called 'where', after 'first', 'last', 'after' etc... How can I use that? Its type is 'RootTopicsTermArgs' which is likely something autogenerated from my schema. It has fields, one of which is 'childless' of Boolean. What I'm trying to do, is return only topics (a custom taxonomy in Wordpress) which have posts tagged with them. Basically it prevents me from doing this on the client.
data.data.topics.nodes.filter(n => n.count !== null)
Can anyone direct me to a good example of using where args with a collection? I have tried every permutation of syntax I could think of. Inlcuding
topics(where:childless:true)
topics(where: childless: 'true')
topics(where: new RootTopicsTermArgs())
etc...
Obviously those are all wrong.
If a custom taxonomy, such as Topics, is registered to "show_in_graphql" and is part of your Schema you can query using arguments like so:
query Topics {
topics(where: {childless: true}) {
edges {
node {
id
name
}
}
}
}
Additionally, you could use a static query combined with variables, like so:
query Topics($where:RootTopicsTermArgs!) {
topics(where:$where) {
edges {
node {
id
name
}
}
}
}
$variables = {
"where": {
"childless": true
}
};
One thing I would recommend is using a GraphiQL IDE, such as https://github.com/skevy/graphiql-app, which will help with validating your queries by providing hints as you type, and visual indicators of invalid queries.
You can see an example of using arguments to query terms here: https://playground.wpgraphql.com/#/connections-and-arguments
I have a problem sorting the data in my redux-store.
My store looks like this:
state = {
ids: [1,2,3,4, /*...*/],
entities: {
1: {
id: 1,
time: 50
}
//...
}
};
In my reducer function I want to sort the ids, in this way my data will always be sorted and ready to use, without needing to sort it every time:
case LOAD_LIST_SUCCESS:
return Object.assign({}, state,
{ids: [state.ids, ...action.payload.normalized.result].sort()}, //Here is my problem...
{entities: [...state.entities, ...action.payload.normalized.entities.items});
How can I sort the ids array by the entities time property?
To sort by the time property, you would need to do something more advanced with the sort function.
I've made a quick example:
[state.ids, ...action.payload.normalized.result].sort((id1, id2) => {
const entity1 = state.entities[id1]
const entity2 = state.entities[id2]
if (entity1.time < entity2.time) {
return -1
}
if (entity1.time > entity2.time) {
return 1
}
return 0
})
However, this approach will not take into account any normalized entities attached to the current action because the state's entities list will have not been updated yet, so you might need to assign the new state to a variable, then sort the ids based on the entities in the new state, and THEN return it as the result of the LOAD_LIST_SUCCESS case.