Blog Documentation

The Blog module provides a system for managing and displaying blog posts. It includes features for rendering detailed blog post pages, listing blog posts, handling empty states, and more. The system integrates with a Prisma-based backend for database management.

Features

📄 Blog Post Rendering: Displays detailed blog posts, including title, content, cover image, and publication date. The posts are dynamically fetched based on the URL slug.

🗂️ Category Management: Supports the categorization of blog posts, allowing users to filter posts by category. Blog posts can be linked to specific categories, enhancing content organization.

🌟 Featured Posts: Includes functionality for marking and displaying featured blog posts, which can be highlighted on the main blog page.

📋 Listing Pages: Blog posts can be listed on various pages, including category-specific lists and main blog pages, providing an organized way to browse content.

🏠 Landing Page Blog Posts Section: Displays a selection of blog posts directly on the landing page, giving users immediate access to the latest or most important content.

📝 Draft Blog Posts: Allows blog posts to be saved as drafts, meaning they are not published and not visible to the public.

📝 Content Management: Utilizes server-side rendering (SSR) to fetch and display the most up-to-date content from the database. This ensures that all blog content is rendered efficiently and accurately.

⚙️ Database Integration: Powered by Prisma, the blog system interacts with a database to fetch blog posts, categories, and featured posts.

What's Included

< BlogDetailPage />

The BlogDetailPage component is responsible for rendering a detailed view of a single blog post. It fetches the post data based on the postSlug parameter from the URL.

`BlogDetailPage` Props

Name	Type	Description
`params`	`object`	Contains the `postSlug` used to fetch the blog post.

< BlogPost />

The BlogPost component displays a summary of a single blog post, including its cover image, title, excerpt, and publication date. It also handles linking to the full blog post page.

`BlogPost` Props

Name	Type	Description
`post`	`object`	The blog post data, including title, slug, and cover image.
`featured`	`boolean`	Determines if the post is featured, altering its display style.

< BlogPostDetail />

The BlogPostDetail component is used to render the detailed content of a blog post, including the cover image, title, publication date, and full content.

`BlogPostDetail` Props

Name	Type	Description
`post`	`object`	The detailed blog post data fetched based on the post slug.

< EmptyState />

The EmptyState component displays a message when no blog posts or categories are found. It can also display an action button for creating new content if the user has the necessary permissions.

`EmptyState` Props

Name	Type	Description
`title`	`string`	The title for the content type that is missing (e.g., "Post").
`link`	`string`	A URL for the action button to navigate to a creation form.
`permission`	`boolean`	Determines if the action button should be displayed based on user permissions.

Blog Post Model Schema

The BlogPost model in schema.prisma defines the structure of a blog post in the database. Below are the fields that a BlogPost object can include according to the defined schema:

model BlogPost {
  id             String       @id @unique @default(cuid())
  name           String
  slug           String
  cover          String
  excerpt        String?
  content        String
  draft          Boolean      @default(true)
  featured       Boolean      @default(false)
  createdAt      DateTime     @default(now())
  updatedAt      DateTime?    @updatedAt
  userId         String
  blogCategoryId String
  blogCategory   BlogCategory @relation(fields: [blogCategoryId], references: [id])
  user           User         @relation(fields: [userId], references: [id])
}

Actions

Blog Category Actions

createBlogCategory: Creates a new blog category in the database after checking for the appropriate permissions.
deleteBlogCategory: Deletes an existing blog category based on its ID, following a permission check.
getAllBlogCategories: Retrieves all blog categories, ensuring the user has read permissions.
getBlogCategory: Retrieves a specific blog category by its ID after verifying read permissions.
updateBlogCategory: Updates an existing blog category by its ID after ensuring the user has update permissions.

Blog Post Actions

createBlogPost: Creates a new blog post in the database after checking for the appropriate permissions.
deleteBlogPost: Deletes an existing blog post based on its ID, following a permission check.
getAllBlogPosts: Retrieves all blog posts, optionally filtering by category, ensuring the user has read permissions.
getBlogPost: Retrieves a single blog post based on its slug after verifying read permissions.
updateBlogPost: Updates an existing blog post by its ID after ensuring the user has update permissions.