Hello, when attempting to fetch data using getAllByType, I'm receiving an empty array as the result.
And fix for this?
I could be wrong, but I believe if you changed it to ‘blog’ and not ‘Blog’ you would get a different result.
Did you really want to fetch all like that or just a single post? Based on your const blogPost, I’d wager you just wanted one. perhaps getByUID might better serve you?
I still get an empty array sadly.
In your project go to /customtypes/blog/index.json and look at what the ID is for that custom type.
You'll want to copy the ID exactly. The label is what is displayed in Prismic but the ID is what you'll want to use when using const blog = await client.getAllByType("blog");
{
"id": "blog",
"label": "Blog",
...
}
@nathan Nathan,
I too suggested this. He is apparently still getting an empty array. I suggest we probe a little deeper...
So @justin.berghahn, is your GitHub repo and prismic repo public? Would you share your GH link so we can see what you see?
We'd like to help you sort this out...
It says that id is blog, so thats the strange part of it.
Yes no worries i'll send it here, thank you for your time both of you!
1 Like
Hi Justin,
I ran this and it looks to be working just fine:
import { Metadata } from 'next'
import { SliceZone } from '@prismicio/react'
import { createClient } from '@/prismicio'
import { components } from '@/slices'
export default async function Page() {
const client = createClient()
const page = await client.getSingle('homepage')
const blogs = await client.getAllByType('blog')
console.log('BLOGS +++++> ', blogs)
return <SliceZone slices={page.data.slices} components={components} />
}
export async function generateMetadata(): Promise<Metadata> {
const client = createClient()
const page = await client.getSingle('homepage')
return {
title: page.data.meta_title,
description: page.data.meta_description,
}
}
And what was logged in my terminal (not the browser console) was this (some items redacted in case they're "sensitive"):
BLOGS +++++> [
{
id: 'REDACTED',
uid: 'blog-post-3',
url: null,
type: 'blog',
href: 'REDACTED',
tags: [],
first_publication_date: '2023-10-31T15:25:44+0000',
last_publication_date: '2023-11-02T02:48:08+0000',
slugs: [],
linked_documents: [],
lang: 'en-gb',
alternate_languages: [],
data: {
title: [Array],
category: 'sharepoint',
name: 'REDACTED',
avatar: [Object],
reading_time: 56,
content: [Array],
image: [Object]
}
},
{
id: 'REDACTED',
uid: 'blog-post-2',
url: null,
type: 'blog',
href: 'REDACTED',
tags: [],
first_publication_date: '2023-10-31T15:25:06+0000',
last_publication_date: '2023-11-02T02:47:53+0000',
slugs: [],
linked_documents: [],
lang: 'en-gb',
alternate_languages: [],
data: {
title: [Array],
category: 'forms',
name: 'REDACTED',
avatar: [Object],
reading_time: 12,
content: [Array],
image: [Object]
}
},
{
id: 'REDACTED',
uid: 'blog-post-4',
url: null,
type: 'blog',
href: 'REDACTED',
tags: [],
first_publication_date: '2023-10-31T15:26:39+0000',
last_publication_date: '2023-11-02T02:48:20+0000',
slugs: [],
linked_documents: [],
lang: 'en-gb',
alternate_languages: [],
data: {
title: [Array],
category: 'microsoft',
name: 'REDACTED',
avatar: [Object],
reading_time: 31,
content: [Array],
image: [Object]
}
},
{
id: 'REDACTED',
uid: 'blog-post-1',
url: null,
type: 'blog',
href: 'REDACTED',
tags: [],
first_publication_date: '2023-10-31T15:18:55+0000',
last_publication_date: '2023-11-02T02:47:40+0000',
slugs: [],
linked_documents: [],
lang: 'en-gb',
alternate_languages: [],
data: {
title: [Array],
category: 'cloudnetwork',
name: 'REDACTED',
avatar: [Object],
reading_time: 12,
content: [Array],
image: [Object]
}
}
]
1 Like
BTW: Your layout file was barking at me 
(see my comments in the code)
export async function generateMetadata(): Promise<Metadata> {
const client = createClient();
const settings = await client.getSingle("settings");
return {
title: settings.data.site_title || "REDACTED",
// the line below should have settings.data.meta_description
description: settings.data.description || "REDACTED",
openGraph: {
// og_image is an object, you need to pass an OR empty string in case og_image is empty
// images: [settings.data.og_image.url || ''],
images: [settings.data.og_image],
},
}
}
OR... try this:
if (isFilled.image(settings.data.og_image)) {
return {
title: settings.data.site_title || 'REDACTED',
description:
settings.data.meta_description || 'REDACTED',
openGraph: {
images: [settings.data.og_image.url],
},
}
}
return {
title: settings.data.site_title || 'REDACTED',
description:
settings.data.meta_description || 'REDACTED',
}
Thank you a lot, i accidentally imported createClient wrong thats why it didn't work in my slicer file!
@justin.berghahn
Now that I know you're having troubles in a specific file, I can help better.
I'm looking at your BlogLast slice and I see that you have your data fetching happening outside of your slice (component) AND your slice is not an async function. See below for help:
import { createClient } from '@/prismicio'; // important that you grab the right one
/**
* Component for "BlogLast" Slices.
*/
const BlogLast = async ({ slice }: BlogLastProps) => {
const client = createClient()
const blogs = await client.getAllByType('blog')
console.log('BLOGS +++++> ', blogs)
return (
<Bounded
className="bg-black"
data-slice-type={slice.slice_type}
data-slice-variation={slice.variation}
>
<PrismicRichText components={components} field={slice.primary.heading} />
<Button className="font-heading" field={slice.primary.button_link}>
<>{slice.primary.button_text}</>
</Button>
</Bounded>
)
}
export default BlogLastNot an expert, but I wonder... if the intention of this slice is to display the most recent blog post... might it be better to use
const blogs = await client.getByType('blog', {
orderings: {
field: 'document.first_publication_date',
direction: 'desc',
},
page: 1,
pageSize: 1,
})