Hi, glad to see somebody else ! In the meantime i’ve found a solution, it works but it might not be the best, see my handler.
I’m working on some kind of newspaper where some company can make an account and pay the newspaper to sponsor some post (this way the newspaper does not rely on annoying ads) and I need to display a list of sponsored posts in the user page that payed for these posts.
To link some users to certain posts in wp i’ve used a relation acf fields, so when journalist create posts it can choose a users in a dropdown list. The selected user then appear in the acf field of that post. I’ve added some code in wp to be able to filter these posts and return them. After that I’ve created a custom handler to get those fields, and managed to find a way to loop trough them but it does not work very well, for some reasons it does not retrieve the featured_media of sponsored posts
const EntrepriseHandler = {
name: "EntrepriseMeta",
priority: 5,
pattern: "posts",
func: async ({ route, params, state, libraries, link }) => {
const { api } = libraries.source;
console.log("entreprise", route);
// 1. fetch the data you want from the endpoint page
const response = await api.get({
endpoint: "posts",
params: {
//per_page: 20, // To make sure you get all of them
meta_key: "nom_enteprise"
},
});
// 2. get an array with each item in json format
const items = await response.json();
const reducedPost= items.reduce((acc, item) => ({ ...acc, [item.id]: item }), {})
// 3. add data to source
const addPost = state.source.post
//state.source.post[link].isEntreprise = true;
Object.assign(addPost, {
reducedPost,
});
},
};
export default EntrepriseHandler;
This is a heavily modified Chakra Ui theme. With the .reduce() method it works, I’m able to loop trough that post list (and posts are returned in the state as objects rather than array of objects)
But for some reasons featured_media returned by the formatPostData() methods (from the theme) does not return featured_media. Maybe it’s because reduce methods is not the best approach ?
here is the updated part of archive-page.js (also using infinite scroll if that matters)
const entreprise = state.source.post.reducedPost
const entrepriseArray = Object.values(entreprise)
return (
<Box as="section" >
{/* display taxonomy page*/}
{data.isTaxonomy && data.isCategory && notShow && (
(...)
)}
{data.isTag && <TagHeader state={state} />}
(...)
<Box
padding={{ base: "17px 14px 14px 14px", lg: "40px" }}
bg={checkBg(data)}
width={{ lg: "80%" }}
maxWidth="1200px"
mx="auto"
h="100%"
>
{/* Iterate over the items of the list. */}
{isStoriesClicked === "parrain" ? (
<SimpleGrid columns={{ base: 1, md: 2 }} spacing="5px">
{entrepriseArray
//.filter((el) => el.id[authorByUrl])
.map(({ type, id }) => {
const item = state.source.post.toast[id];
return (
<ArchiveItem
isAuthor={data.isAuthor}
key={item.id}
item={item}
/>
);
})}
</SimpleGrid>
)
Thanks for your help !!
