This commit is contained in:
IGNY8 VPS (Salman)
2025-11-29 07:20:26 +00:00
parent 341650bddc
commit 4bea79a76d
21 changed files with 443 additions and 1065 deletions

View File

@@ -17,7 +17,8 @@
import React, { useEffect, useMemo, useState } from 'react';
import { Content, fetchImages, ImageRecord } from '../services/api';
import { ArrowLeftIcon, CalendarIcon, TagIcon, FileTextIcon, CheckCircleIcon, XCircleIcon, ClockIcon } from '../icons';
import { ArrowLeftIcon, CalendarIcon, TagIcon, FileTextIcon, CheckCircleIcon, XCircleIcon, ClockIcon, PencilIcon, ImageIcon, BoltIcon } from '../icons';
import { useNavigate } from 'react-router';
interface ContentViewTemplateProps {
content: Content | null;
@@ -430,6 +431,7 @@ const ArticleBody = ({ introHtml, sections, sectionImages, imagesLoading, rawHtm
};
export default function ContentViewTemplate({ content, loading, onBack }: ContentViewTemplateProps) {
const navigate = useNavigate();
const [imageRecords, setImageRecords] = useState<ImageRecord[]>([]);
const [imagesLoading, setImagesLoading] = useState(false);
const [imagesError, setImagesError] = useState<string | null>(null);
@@ -900,6 +902,53 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
) : null}
</div>
{/* Action Buttons - Conditional based on status */}
{content.status && (
<div className="px-8 py-6 bg-gray-50 dark:bg-gray-900/30 border-b border-gray-200 dark:border-gray-700">
<div className="flex items-center gap-4">
{/* Draft status: Show Edit Content + Generate Images */}
{content.status.toLowerCase() === 'draft' && (
<>
<button
onClick={() => navigate(`/sites/${content.site_id}/posts/${content.id}/edit`)}
className="inline-flex items-center gap-2 px-4 py-2 bg-brand-500 hover:bg-brand-600 text-white rounded-lg font-medium transition-colors"
>
<PencilIcon className="w-4 h-4" />
Edit Content
</button>
<button
onClick={() => navigate(`/writer/images?contentId=${content.id}`)}
className="inline-flex items-center gap-2 px-4 py-2 bg-purple-500 hover:bg-purple-600 text-white rounded-lg font-medium transition-colors"
>
<ImageIcon className="w-4 h-4" />
Generate Images
</button>
</>
)}
{/* Review status: Show Edit Content + Publish */}
{content.status.toLowerCase() === 'review' && (
<>
<button
onClick={() => navigate(`/sites/${content.site_id}/posts/${content.id}/edit`)}
className="inline-flex items-center gap-2 px-4 py-2 bg-brand-500 hover:bg-brand-600 text-white rounded-lg font-medium transition-colors"
>
<PencilIcon className="w-4 h-4" />
Edit Content
</button>
<button
onClick={() => navigate(`/writer/published?contentId=${content.id}&action=publish`)}
className="inline-flex items-center gap-2 px-4 py-2 bg-green-500 hover:bg-green-600 text-white rounded-lg font-medium transition-colors"
>
<BoltIcon className="w-4 h-4" />
Publish
</button>
</>
)}
</div>
</div>
)}
{/* Image Status */}
{(content.has_image_prompts || content.has_generated_images) && (
<div className="px-8 py-4 bg-gray-50 dark:bg-gray-900/50 border-b border-gray-200 dark:border-gray-700">