From 987af7c0e75d29a1cdaf70cd20828ae1605f1c00 Mon Sep 17 00:00:00 2001
From: mukimovd <41473651-mukimovd@users.noreply.replit.com>
Date: Thu, 1 May 2025 03:37:15 +0000
Subject: [PATCH] Add a dedicated blog section to share articles and engage
 with readers

Implements blog listing, detail, and creation pages with necessary components and types.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: cbacfb18-842a-4116-a907-18c0105ad8ec
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/39b5c689-6e8a-4d5a-9792-69cc81a56534/10041482-d9af-42cb-9c5d-d331b0904c5e.jpg
---
 client/src/App.tsx                   |  3 +++
 client/src/lib/types.ts              |  1 +
 client/src/pages/blog/BlogCreate.tsx | 11 +++++++----
 3 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/client/src/App.tsx b/client/src/App.tsx
index 7451a88..9fcfeaf 100644
--- a/client/src/App.tsx
+++ b/client/src/App.tsx
@@ -29,6 +29,9 @@ function Router() {
       <Route path="/collections/create" component={CreateCollection} />
       <Route path="/profile" component={Profile} />
       <Route path="/submit" component={Submit} />
+      <Route path="/blog" component={BlogList} />
+      <Route path="/blog/create" component={BlogCreate} />
+      <Route path="/blog/:slug" component={BlogDetail} />
       <Route component={NotFound} />
     </Switch>
   );
diff --git a/client/src/lib/types.ts b/client/src/lib/types.ts
index 37f919f..74dc9c7 100644
--- a/client/src/lib/types.ts
+++ b/client/src/lib/types.ts
@@ -110,6 +110,7 @@ export interface BlogPostWithDetails {
   tags?: Tag[];
   commentCount?: number;
   likeCount?: number;
+  comments?: CommentWithUser[];
 }
 
 export interface BlogPostListItem {
diff --git a/client/src/pages/blog/BlogCreate.tsx b/client/src/pages/blog/BlogCreate.tsx
index 742bf90..63a5b48 100644
--- a/client/src/pages/blog/BlogCreate.tsx
+++ b/client/src/pages/blog/BlogCreate.tsx
@@ -17,8 +17,7 @@ import { apiRequest, queryClient } from "@/lib/queryClient";
 import { useState } from "react";
 import { useMutation, useQuery } from "@tanstack/react-query";
 import { useToast } from "@/hooks/use-toast";
-import { insertBlogPostSchema } from "@shared/schema";
-import { Tag } from "@/lib/types";
+import { insertBlogPostSchema, Tag } from "@shared/schema";
 
 const blogPostSchema = insertBlogPostSchema.extend({
   tags: z.array(z.number()).optional(),
@@ -82,7 +81,7 @@ export default function BlogCreate() {
     defaultValues: {
       title: "",
       content: "",
-      excerpt: "",
+      excerpt: "", // Using empty string instead of null
       authorId: 1, // Mock user ID for demo
       tags: [],
     },
@@ -206,7 +205,11 @@ export default function BlogCreate() {
                       <Textarea
                         placeholder="Provide a short summary of your article (will appear in previews)"
                         className="resize-y h-20"
-                        {...field}
+                        value={field.value || ""}
+                        onChange={field.onChange}
+                        onBlur={field.onBlur}
+                        name={field.name}
+                        ref={field.ref}
                       />
                     </FormControl>
                     <FormDescription>