How to fetch content relationships in a slice

relatedposts.tsx

import { Heading } from "@/components/ui";
import { Content, isFilled } from "@prismicio/client";
import { BlogPostCard } from "@/components/blog";
import { createClient } from "@/prismicio";

const RelatedPosts = async ({ slice }) => {
  const client = createClient();

  // Return ids of related blog posts
  const blogIds: string[] = slice.items.map((item) => {
    if (isFilled.contentRelationship(item.related)) {
      return item.related.id;
    }

    return "";
  });

  // Query posts by id
  const blogs = await client.getByIDs(blogIds);

  return (
    <div className="my-12 first:mt-0 last:mb-0 bg-gray-F7 p-6 rounded-xl">
      <Heading field={slice.primary.title} size="sm" />
      <div className="grid sm:grid-cols-2 gap-4 sm:gap-6 mt-6">
        {blogs.results?.map((item, index) => (
          <BlogPostCard
            key={index}
            post={item}
            size="sm"
            thumbnail="sm"
            padding
            border
            description={false}
            author={false}
          />
        ))}
      </div>
    </div>
  );
};

export default RelatedPosts;