feat(blog): show review feedback in admin

src/views/AdminBlog.tsx

@@ -9,9 +9,11 @@ import { api } from "@/lib/api";
 import type * as Types from "@/lib/types";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog";
 import { Input } from "@/components/ui/input";
 import { Badge } from "@/components/ui/badge";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
+import { Textarea } from "@/components/ui/textarea";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import { useToast } from "@/hooks/use-toast";
 import { formatJalali, resolveErrorMessage } from "@/lib/utils";
@@ -32,6 +34,8 @@ export default function AdminBlog() {
   const [search, setSearch] = useState("");
   const [loading, setLoading] = useState(true);
   const [actingId, setActingId] = useState<number | null>(null);
+  const [changesPost, setChangesPost] = useState<Types.PostListSchema | null>(null);
+  const [changesNote, setChangesNote] = useState("");
 
   const canReview = Boolean(user?.is_staff || user?.is_superuser || user?.can_review_blog_posts);
 
@@ -79,10 +83,10 @@ export default function AdminBlog() {
     }
   };
 
-  const reviewPost = async (postId: number, action: Types.PostReviewSchema["action"]) => {
+  const reviewPost = async (postId: number, action: Types.PostReviewSchema["action"], note?: string) => {
     setActingId(postId);
     try {
-      await api.reviewBlogPost(postId, { action });
+      await api.reviewBlogPost(postId, { action, note });
       await loadPosts();
       toast({ title: action === "publish" ? "نوشته منتشر شد" : "درخواست اصلاح ثبت شد", variant: "success" });
     } catch (error) {
@@ -92,6 +96,24 @@ export default function AdminBlog() {
     }
   };
 
+  const openChangesDialog = (post: Types.PostListSchema) => {
+    setChangesPost(post);
+    setChangesNote("");
+  };
+
+  const closeChangesDialog = () => {
+    if (actingId) return;
+    setChangesPost(null);
+    setChangesNote("");
+  };
+
+  const requestChanges = async () => {
+    if (!changesPost) return;
+    await reviewPost(changesPost.id, "request_changes", changesNote.trim() || undefined);
+    setChangesPost(null);
+    setChangesNote("");
+  };
+
   return (
     <div className="space-y-6" dir="rtl">
       <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
@@ -241,7 +263,7 @@ export default function AdminBlog() {
                             <Button
                               size="sm"
                               variant="outline"
-                              onClick={() => reviewPost(post.id, "request_changes")}
+                              onClick={() => openChangesDialog(post)}
                               disabled={actingId === post.id}
                               aria-label="درخواست اصلاح"
                               className="w-full"
@@ -264,6 +286,45 @@ export default function AdminBlog() {
           )}
         </CardContent>
       </Card>
+
+      <Dialog open={Boolean(changesPost)} onOpenChange={(open) => (open ? undefined : closeChangesDialog())}>
+        <DialogContent className="max-w-xl rounded-3xl" dir="rtl">
+          <DialogHeader className="mt-6 text-right md:text-right">
+            <DialogTitle>درخواست اصلاح نوشته</DialogTitle>
+            <DialogDescription>
+              توضیح کوتاهی بنویسید تا نویسنده بداند چه چیزی باید در نوشته اصلاح شود.
+            </DialogDescription>
+          </DialogHeader>
+          <div className="rounded-2xl border bg-muted/30 p-3 text-right">
+            <p className="text-xs text-muted-foreground">نوشته</p>
+            <p className="mt-1 font-semibold">{changesPost?.title}</p>
+          </div>
+          <form
+            className="space-y-4"
+            onSubmit={(event) => {
+              event.preventDefault();
+              void requestChanges();
+            }}
+          >
+            <Textarea
+              value={changesNote}
+              onChange={(event) => setChangesNote(event.target.value)}
+              placeholder="مثلاً: بخش مقدمه نیاز به منبع دارد، تیترها را واضح‌تر کنید، یا نمونه کد را اصلاح کنید..."
+              className="min-h-36 text-right leading-7"
+              autoFocus
+            />
+            <div className="flex flex-wrap justify-start gap-2">
+              <Button type="submit" disabled={!changesPost || actingId === changesPost.id}>
+                {actingId === changesPost?.id ? <Loader2 className="ml-2 h-4 w-4 animate-spin" /> : null}
+                ثبت درخواست اصلاح
+              </Button>
+              <Button type="button" variant="outline" onClick={closeChangesDialog} disabled={Boolean(actingId)}>
+                انصراف
+              </Button>
+            </div>
+          </form>
+        </DialogContent>
+      </Dialog>
     </div>
   );
 }