salman/igny8
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

componenets standardization 1

Browse Source
This commit is contained in:
IGNY8 VPS (Salman)
2026-01-01 21:42:04 +00:00
parent c880e24fc0
commit a4691ad2da
95 changed files with 3597 additions and 1745 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
frontend/src/templates/ContentViewTemplate.tsx
View File

@@ -19,6 +19,7 @@ import React, { useEffect, useMemo, useState } from 'react';
import { Content, fetchImages, ImageRecord } from '../services/api';
import { ArrowLeftIcon, CalendarIcon, TagIcon, FileTextIcon, CheckCircleIcon, XCircleIcon, ClockIcon, PencilIcon, ImageIcon, BoltIcon } from '../icons';
import { useNavigate } from 'react-router-dom';
import Button from '../components/ui/button/Button';
interface ContentViewTemplateProps {
content: Content | null;
@@ -759,13 +760,13 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
<h2 className="text-2xl font-semibold text-gray-900 dark:text-white mb-2">Content Not Found</h2>
<p className="text-gray-600 dark:text-gray-400 mb-6">The content you're looking for doesn't exist or has been deleted.</p>
{onBack && (
<button
<Button
variant="primary"
onClick={onBack}
className="inline-flex items-center gap-2 px-4 py-2 bg-brand-500 text-white rounded-lg hover:bg-brand-600 transition-colors"
>
<ArrowLeftIcon className="w-4 h-4" />
Back to Content List
</button>
</Button>
)}
</div>
</div>
@@ -824,13 +825,14 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
<div className="max-w-[1440px] mx-auto px-4 sm:px-6 lg:px-8">
{/* Back Button */}
{onBack && (
<button
<Button
variant="ghost"
onClick={onBack}
className="mb-6 inline-flex items-center gap-2 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-white transition-colors"
className="mb-6"
>
<ArrowLeftIcon className="w-5 h-5" />
<span className="font-medium">Back to Content</span>
</button>
<ArrowLeftIcon className="w-4 h-4" />
Back to Content List
</Button>
)}
{/* Main Content Card */}
@@ -1025,40 +1027,42 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
{/* Draft status: Show Edit Content + Generate Images */}
{content.status.toLowerCase() === 'draft' && (
<>
<button
<Button
variant="primary"
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
</Button>
<Button
variant="primary"
tone="brand"
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>
</Button>
</>
)}
{/* Review status: Show Edit Content + Publish */}
{content.status.toLowerCase() === 'review' && (
<>
<button
<Button
variant="primary"
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
</Button>
<Button
variant="primary"
tone="brand"
onClick={() => navigate(`/writer/published?contentId=${content.id}&action=publish`)}
className="inline-flex items-center gap-2 px-4 py-2 bg-success-500 hover:bg-success-600 text-white rounded-lg font-medium transition-colors"
>
<BoltIcon className="w-4 h-4" />
Publish
</button>
</Button>
</>
)}
</div>

13
frontend/src/templates/FormPageTemplate.tsx
View File

@@ -12,6 +12,7 @@
*/
import React, { ReactNode, useState } from 'react';
import Button from '../components/ui/button/Button';
interface FormSection {
title: string;
@@ -89,21 +90,21 @@ export default function FormPageTemplate({
{(onSave || onCancel) && (
<div className="mt-6 flex items-center justify-end gap-3 rounded-lg border border-gray-200 bg-gray-50 p-4 dark:border-gray-800 dark:bg-white/[0.03]">
{onCancel && (
<button
<Button
onClick={onCancel}
className="rounded-lg border border-gray-200 bg-white px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-gray-50 dark:border-gray-800 dark:bg-gray-900 dark:text-gray-400 dark:hover:bg-white/[0.03]"
variant="outline"
>
{cancelLabel}
</button>
</Button>
)}
{onSave && (
<button
<Button
onClick={handleSave}
disabled={loading || !isDirty}
className="inline-flex items-center justify-center gap-2 rounded-lg bg-brand-500 px-4 py-2.5 text-sm font-medium text-white shadow-theme-xs hover:bg-brand-600 disabled:opacity-50 disabled:cursor-not-allowed"
variant="primary"
>
{loading ? 'Saving...' : saveLabel}
</button>
</Button>
)}
</div>
)}