BlogArticlePage renders no article body for 3 of the 4 blog posts because content is only defined on one

[Jagadeeshftw]

Description

src/features/blog/data/blogPosts.ts defines four posts total: featuredPost plus three entries in recentPosts (future-of-decentralized-development, cross-chain-collaboration, incentivizing-quality-contributions). Only featuredPost has a content field populated:

export const featuredPost: BlogPost = {
  ...
  content:
    'Grainlify connects talented open-source developers with innovative Web3 ' +
    ...
}

export const recentPosts: BlogPost[] = [
  {
    id: 1,
    slug: 'future-of-decentralized-development',
    title: 'The Future of Decentralized Development',
    excerpt: 'Exploring how blockchain technology is transforming...',
    date: 'December 20, 2024',
    readTime: '6 min read',
    category: 'Innovation',
    icon: '🚀',
    // no `content`
  },
  ...

src/features/blog/pages/BlogArticlePage.tsx (the /dashboard/blog/:slug route rendered when a user clicks any BlogPostCard) only renders a body paragraph when content is present:

{post.content && (
  <p className={...}>
    {post.content}
  </p>
)}

So clicking through to any of the three recentPosts articles from the blog listing (BlogPage.tsx → RecentPostsGrid → BlogPostCard) lands on a page showing only the title, date/read-time metadata, and the same short excerpt already shown on the listing card — no actual article body. The type for content in src/features/blog/types/index.ts is z.string().optional(), so this isn't a type error, but from a product standpoint three of the app's four blog articles are effectively broken deep links: a reader who clicks "Read More" gets nothing they hadn't already read on the listing page.

Requirements

• Populate a content field for each of the three recentPosts entries currently missing one, so every post reachable via BlogPostCard/FeaturedPost has a real article body.
• Alternatively (if full article bodies aren't ready yet), suppress the "Read More" affordance / route entirely for posts lacking content rather than linking to an effectively-empty article page.

Suggested execution

1. Fork the repo and create a branch: git checkout -b fix/blog-posts-missing-content
2. Add a content value to each of the three recentPosts entries in blogPosts.ts (or wire real content once available).
3. Alternatively, in BlogPostCard.tsx/FeaturedPost.tsx, only render the "Read More" link when post.content is present, and add a schema-level guard (see PENDING_FEATURES.md-style validation) ensuring future posts can't ship without one if it's meant to be required.
4. Add a test asserting BlogArticlePage renders a non-empty body for every slug present in blogPosts.ts.

Example commit message

fix: give every blog post real article content (or hide Read More when missing)

Acceptance criteria

• Every post reachable from the blog listing has a non-empty article body on its detail page, or its "Read More" affordance is suppressed.
• A test enumerates blogPosts.ts entries and asserts each either has content or is not linked as a full article.

Security notes

None; this is a content-completeness issue with no security surface.

Guidelines

• Minimum 95% test coverage
• Timeframe: 96 hours

[1nonlypiece]

Hi Maintainers 👋,

I’d like to apply for this issue.

I have hands-on experience with Next.js frontend development as well as Stellar smart contracts using Rust (Soroban). I’m comfortable working with Figma designs, integrating APIs/wallets on the frontend, and implementing, testing, and optimizing smart contracts on Stellar.

I can follow the project guidelines, communicate progress clearly, and deliver clean, well-tested code within the expected timeline.

Looking forward to contributing to the project 🚀
Thanks!

[Jagadeeshftw]

Assigned @1nonlypiece! Go ahead and open a PR referencing this issue (Closes #893) when ready. t.me/+vTbe0hOUKrFhNTJl