Phase 6
This commit is contained in:
@@ -5,6 +5,7 @@ import ValidationCard from '../../components/common/ValidationCard';
|
||||
import ImageGenerationCard from '../../components/common/ImageGenerationCard';
|
||||
import ImageResultCard from '../../components/common/ImageResultCard';
|
||||
import ImageServiceCard from '../../components/common/ImageServiceCard';
|
||||
import SiteIntegrationsSection from '../../components/integration/SiteIntegrationsSection';
|
||||
import { Modal } from '../../components/ui/modal';
|
||||
import FormModal, { FormField } from '../../components/common/FormModal';
|
||||
import Button from '../../components/ui/button/Button';
|
||||
@@ -1082,6 +1083,9 @@ export default function Integration() {
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Site Integrations Section */}
|
||||
<SiteIntegrationsSection />
|
||||
</div>
|
||||
|
||||
{/* Details Modal */}
|
||||
|
||||
165
frontend/src/pages/Settings/Publishing.tsx
Normal file
165
frontend/src/pages/Settings/Publishing.tsx
Normal file
@@ -0,0 +1,165 @@
|
||||
/**
|
||||
* Publishing Settings Page
|
||||
* Phase 6: Site Integration & Multi-Destination Publishing
|
||||
*/
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import PageMeta from '../../components/common/PageMeta';
|
||||
import { Card } from '../../components/ui/card';
|
||||
import Button from '../../components/ui/button/Button';
|
||||
import Checkbox from '../../components/form/input/Checkbox';
|
||||
import Label from '../../components/form/Label';
|
||||
import PublishingRules, { PublishingRule } from '../../components/publishing/PublishingRules';
|
||||
import { useToast } from '../../components/ui/toast/ToastContainer';
|
||||
import { fetchAPI } from '../../services/api';
|
||||
|
||||
export default function Publishing() {
|
||||
const toast = useToast();
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [saving, setSaving] = useState(false);
|
||||
const [defaultDestinations, setDefaultDestinations] = useState<string[]>(['sites']);
|
||||
const [autoPublishEnabled, setAutoPublishEnabled] = useState(false);
|
||||
const [publishingRules, setPublishingRules] = useState<PublishingRule[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
loadSettings();
|
||||
}, []);
|
||||
|
||||
const loadSettings = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
// TODO: Load from backend API when endpoint is available
|
||||
// For now, use defaults
|
||||
setDefaultDestinations(['sites']);
|
||||
setAutoPublishEnabled(false);
|
||||
setPublishingRules([]);
|
||||
} catch (error: any) {
|
||||
toast.error(`Failed to load settings: ${error.message}`);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleSave = async () => {
|
||||
try {
|
||||
setSaving(true);
|
||||
// TODO: Save to backend API when endpoint is available
|
||||
toast.success('Publishing settings saved successfully');
|
||||
} catch (error: any) {
|
||||
toast.error(`Failed to save settings: ${error.message}`);
|
||||
} finally {
|
||||
setSaving(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleToggleDestination = (destination: string) => {
|
||||
setDefaultDestinations((prev) =>
|
||||
prev.includes(destination)
|
||||
? prev.filter((d) => d !== destination)
|
||||
: [...prev, destination]
|
||||
);
|
||||
};
|
||||
|
||||
const DESTINATIONS = [
|
||||
{ value: 'sites', label: 'IGNY8 Sites' },
|
||||
{ value: 'wordpress', label: 'WordPress' },
|
||||
{ value: 'shopify', label: 'Shopify' },
|
||||
];
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="p-6">
|
||||
<PageMeta title="Publishing Settings" />
|
||||
<div className="flex items-center justify-center h-64">
|
||||
<div className="text-gray-500">Loading...</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="p-6">
|
||||
<PageMeta title="Publishing Settings - IGNY8" />
|
||||
|
||||
<div className="mb-6">
|
||||
<h1 className="text-2xl font-bold text-gray-900 dark:text-white">
|
||||
Publishing Settings
|
||||
</h1>
|
||||
<p className="text-gray-600 dark:text-gray-400 mt-1">
|
||||
Configure default publishing destinations and rules
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-6">
|
||||
{/* Default Destinations */}
|
||||
<Card className="p-6">
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<h2 className="text-lg font-semibold text-gray-900 dark:text-white mb-1">
|
||||
Default Publishing Destinations
|
||||
</h2>
|
||||
<p className="text-sm text-gray-600 dark:text-gray-400">
|
||||
Select default platforms where content will be published
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
{DESTINATIONS.map((dest) => (
|
||||
<div key={dest.value} className="flex items-center gap-3">
|
||||
<Checkbox
|
||||
checked={defaultDestinations.includes(dest.value)}
|
||||
onChange={() => handleToggleDestination(dest.value)}
|
||||
label={dest.label}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
{/* Auto-Publish Settings */}
|
||||
<Card className="p-6">
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<h2 className="text-lg font-semibold text-gray-900 dark:text-white mb-1">
|
||||
Auto-Publish Settings
|
||||
</h2>
|
||||
<p className="text-sm text-gray-600 dark:text-gray-400">
|
||||
Automatically publish content when it's ready
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-3">
|
||||
<Checkbox
|
||||
checked={autoPublishEnabled}
|
||||
onChange={(e) => setAutoPublishEnabled(e.target.checked)}
|
||||
label="Enable auto-publish"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{autoPublishEnabled && (
|
||||
<div className="mt-4 p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg">
|
||||
<p className="text-sm text-blue-800 dark:text-blue-200">
|
||||
When enabled, content will be automatically published to selected destinations
|
||||
when generation is complete.
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
{/* Publishing Rules */}
|
||||
<Card className="p-6">
|
||||
<PublishingRules rules={publishingRules} onChange={setPublishingRules} />
|
||||
</Card>
|
||||
|
||||
{/* Save Button */}
|
||||
<div className="flex justify-end">
|
||||
<Button onClick={handleSave} variant="primary" disabled={saving}>
|
||||
{saving ? 'Saving...' : 'Save Settings'}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user