Refactor error_response function for improved argument handling
- Enhanced the `error_response` function to support backward compatibility by normalizing arguments when positional arguments are misused. - Updated various views to pass `None` for the `errors` parameter in `error_response` calls, ensuring consistent response formatting. - Adjusted logging in `ContentSyncService` and `WordPressClient` to use debug level for expected 401 errors, improving log clarity. - Removed deprecated fields from serializers and views, streamlining content management processes.
This commit is contained in:
@@ -259,7 +259,7 @@ export const createTasksPageConfig = (
|
||||
...wordCountColumn,
|
||||
sortable: true,
|
||||
sortField: 'word_count',
|
||||
render: (value: number) => value.toLocaleString(),
|
||||
render: (value: number | null | undefined) => (value != null ? value.toLocaleString() : '-'),
|
||||
},
|
||||
{
|
||||
...createdColumn,
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
* Phase 7: Advanced Site Management
|
||||
* Features: SEO (meta tags, Open Graph, schema.org)
|
||||
*/
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import React, { useState, useEffect, useRef } from 'react';
|
||||
import { useParams, useNavigate, useSearchParams } from 'react-router-dom';
|
||||
import PageMeta from '../../components/common/PageMeta';
|
||||
import PageHeader from '../../components/common/PageHeader';
|
||||
@@ -14,10 +14,11 @@ import SelectDropdown from '../../components/form/SelectDropdown';
|
||||
import Checkbox from '../../components/form/input/Checkbox';
|
||||
import TextArea from '../../components/form/input/TextArea';
|
||||
import { useToast } from '../../components/ui/toast/ToastContainer';
|
||||
import { fetchAPI } from '../../services/api';
|
||||
import { fetchAPI, runSync } from '../../services/api';
|
||||
import WordPressIntegrationForm from '../../components/sites/WordPressIntegrationForm';
|
||||
import { integrationApi, SiteIntegration } from '../../services/integration.api';
|
||||
import { GridIcon, PlugInIcon, PaperPlaneIcon, DocsIcon, BoltIcon } from '../../icons';
|
||||
import { GridIcon, PlugInIcon, PaperPlaneIcon, DocsIcon, BoltIcon, FileIcon } from '../../icons';
|
||||
import Badge from '../../components/ui/badge/Badge';
|
||||
|
||||
export default function SiteSettings() {
|
||||
const { id: siteId } = useParams<{ id: string }>();
|
||||
@@ -31,8 +32,10 @@ export default function SiteSettings() {
|
||||
const [integrationLoading, setIntegrationLoading] = useState(false);
|
||||
|
||||
// Check for tab parameter in URL
|
||||
const initialTab = (searchParams.get('tab') as 'general' | 'seo' | 'og' | 'schema' | 'integrations') || 'general';
|
||||
const [activeTab, setActiveTab] = useState<'general' | 'seo' | 'og' | 'schema' | 'integrations'>(initialTab);
|
||||
const initialTab = (searchParams.get('tab') as 'general' | 'seo' | 'og' | 'schema' | 'integrations' | 'content-types') || 'general';
|
||||
const [activeTab, setActiveTab] = useState<'general' | 'seo' | 'og' | 'schema' | 'integrations' | 'content-types'>(initialTab);
|
||||
const [contentTypes, setContentTypes] = useState<any>(null);
|
||||
const [contentTypesLoading, setContentTypesLoading] = useState(false);
|
||||
const [formData, setFormData] = useState({
|
||||
name: '',
|
||||
slug: '',
|
||||
@@ -66,11 +69,17 @@ export default function SiteSettings() {
|
||||
useEffect(() => {
|
||||
// Update tab if URL parameter changes
|
||||
const tab = searchParams.get('tab');
|
||||
if (tab && ['general', 'seo', 'og', 'schema', 'integrations'].includes(tab)) {
|
||||
if (tab && ['general', 'seo', 'og', 'schema', 'integrations', 'content-types'].includes(tab)) {
|
||||
setActiveTab(tab as typeof activeTab);
|
||||
}
|
||||
}, [searchParams]);
|
||||
|
||||
useEffect(() => {
|
||||
if (activeTab === 'content-types' && wordPressIntegration) {
|
||||
loadContentTypes();
|
||||
}
|
||||
}, [activeTab, wordPressIntegration]);
|
||||
|
||||
const loadSite = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
@@ -100,6 +109,11 @@ export default function SiteSettings() {
|
||||
schema_logo: seoData.schema_logo || '',
|
||||
schema_same_as: Array.isArray(seoData.schema_same_as) ? seoData.schema_same_as.join(', ') : seoData.schema_same_as || '',
|
||||
});
|
||||
// If integration record missing but site has stored WP API key or hosting_type wordpress, mark as connected-active
|
||||
if (!wordPressIntegration && (data.wp_api_key || data.hosting_type === 'wordpress')) {
|
||||
setIntegrationTestStatus('connected');
|
||||
setIntegrationLastChecked(new Date().toISOString());
|
||||
}
|
||||
}
|
||||
} catch (error: any) {
|
||||
toast.error(`Failed to load site: ${error.message}`);
|
||||
@@ -127,6 +141,191 @@ export default function SiteSettings() {
|
||||
await loadIntegrations();
|
||||
};
|
||||
|
||||
const loadContentTypes = async () => {
|
||||
if (!wordPressIntegration?.id) return;
|
||||
try {
|
||||
setContentTypesLoading(true);
|
||||
const data = await fetchAPI(`/v1/integration/integrations/${wordPressIntegration.id}/content-types/`);
|
||||
setContentTypes(data);
|
||||
} catch (error: any) {
|
||||
toast.error(`Failed to load content types: ${error.message}`);
|
||||
} finally {
|
||||
setContentTypesLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const formatRelativeTime = (iso: string | null) => {
|
||||
if (!iso) return '-';
|
||||
const then = new Date(iso).getTime();
|
||||
const now = Date.now();
|
||||
const diff = Math.max(0, now - then);
|
||||
const mins = Math.floor(diff / 60000);
|
||||
if (mins < 1) return 'just now';
|
||||
if (mins < 60) return `${mins}m ago`;
|
||||
const hours = Math.floor(mins / 60);
|
||||
if (hours < 24) return `${hours}h ago`;
|
||||
const days = Math.floor(hours / 24);
|
||||
if (days < 30) return `${days}d ago`;
|
||||
const months = Math.floor(days / 30);
|
||||
return `${months}mo ago`;
|
||||
};
|
||||
|
||||
// Integration test status & periodic check (every 60 minutes)
|
||||
const [integrationTestStatus, setIntegrationTestStatus] = useState<'connected' | 'pending' | 'error' | 'not_configured'>('not_configured');
|
||||
const [integrationLastChecked, setIntegrationLastChecked] = useState<string | null>(null);
|
||||
const integrationCheckRef = useRef<number | null>(null);
|
||||
const integrationErrorCooldownRef = useRef<number | null>(null);
|
||||
const [syncLoading, setSyncLoading] = useState(false);
|
||||
const runIntegrationTest = async () => {
|
||||
// respect cooldown on repeated server errors
|
||||
if (integrationErrorCooldownRef.current && Date.now() < integrationErrorCooldownRef.current) {
|
||||
return;
|
||||
}
|
||||
if (!wordPressIntegration && !site) {
|
||||
setIntegrationTestStatus('not_configured');
|
||||
return;
|
||||
}
|
||||
try {
|
||||
setIntegrationTestStatus('pending');
|
||||
let resp: any = null;
|
||||
// Only run server-side test if we have an integration record to avoid triggering collection-level 500s
|
||||
if (wordPressIntegration && wordPressIntegration.id) {
|
||||
resp = await fetchAPI(`/v1/integration/integrations/${wordPressIntegration.id}/test_connection/`, { method: 'POST', body: {} });
|
||||
} else {
|
||||
// If no integration record, do not call server test here — just mark connected if site has local WP credentials.
|
||||
if (site?.wp_api_key || site?.wp_url || site?.hosting_type === 'wordpress') {
|
||||
// Assume connected (plugin shows connection) but do not invoke server test to avoid 500s.
|
||||
setIntegrationTestStatus('connected');
|
||||
setIntegrationLastChecked(new Date().toISOString());
|
||||
return;
|
||||
} else {
|
||||
setIntegrationTestStatus('not_configured');
|
||||
return;
|
||||
}
|
||||
}
|
||||
if (resp && resp.success) {
|
||||
setIntegrationTestStatus('connected');
|
||||
// clear any error cooldown
|
||||
integrationErrorCooldownRef.current = null;
|
||||
} else {
|
||||
setIntegrationTestStatus('error');
|
||||
// set cooldown to 60 minutes to avoid repeated 500s
|
||||
integrationErrorCooldownRef.current = Date.now() + 60 * 60 * 1000;
|
||||
}
|
||||
setIntegrationLastChecked(new Date().toISOString());
|
||||
} catch (err) {
|
||||
setIntegrationTestStatus('error');
|
||||
setIntegrationLastChecked(new Date().toISOString());
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
// run initial test when page loads / integration/site known
|
||||
runIntegrationTest();
|
||||
|
||||
// schedule hourly checks (one per hour) — less intrusive
|
||||
if (integrationCheckRef.current) {
|
||||
window.clearInterval(integrationCheckRef.current);
|
||||
integrationCheckRef.current = null;
|
||||
}
|
||||
integrationCheckRef.current = window.setInterval(() => {
|
||||
runIntegrationTest();
|
||||
}, 60 * 60 * 1000); // 60 minutes
|
||||
|
||||
return () => {
|
||||
if (integrationCheckRef.current) {
|
||||
window.clearInterval(integrationCheckRef.current);
|
||||
integrationCheckRef.current = null;
|
||||
}
|
||||
};
|
||||
}, [wordPressIntegration, site]);
|
||||
|
||||
// when contentTypes last_structure_fetch updates (content was synced), re-run test once
|
||||
useEffect(() => {
|
||||
if (contentTypes?.last_structure_fetch) {
|
||||
runIntegrationTest();
|
||||
}
|
||||
}, [contentTypes?.last_structure_fetch]);
|
||||
|
||||
// Sync Now handler extracted
|
||||
const handleManualSync = async () => {
|
||||
setSyncLoading(true);
|
||||
try {
|
||||
if (wordPressIntegration && wordPressIntegration.id) {
|
||||
const res = await integrationApi.syncIntegration(wordPressIntegration.id, 'incremental');
|
||||
if (res && res.success) {
|
||||
toast.success('Sync started');
|
||||
setTimeout(() => loadContentTypes(), 1500);
|
||||
} else {
|
||||
toast.error(res?.message || 'Sync failed to start');
|
||||
}
|
||||
} else {
|
||||
// No integration record — attempt a site-level sync job instead of calling test-connection (avoids server 500 test endpoint)
|
||||
// This will trigger the site sync runner which is safer and returns structured result
|
||||
try {
|
||||
const runResult = await runSync(Number(siteId), 'from_external');
|
||||
if (runResult && runResult.sync_results) {
|
||||
toast.success('Site sync started (from external).');
|
||||
// Refresh integrations and content types after a short delay
|
||||
setTimeout(async () => {
|
||||
await loadIntegrations();
|
||||
await loadContentTypes();
|
||||
}, 2000);
|
||||
setIntegrationTestStatus('connected');
|
||||
setIntegrationLastChecked(new Date().toISOString());
|
||||
} else {
|
||||
toast.error('Failed to start site sync.');
|
||||
setIntegrationTestStatus('error');
|
||||
integrationErrorCooldownRef.current = Date.now() + 60 * 60 * 1000;
|
||||
}
|
||||
} catch (e: any) {
|
||||
// If there are no active integrations, attempt a collection-level test (if site has WP creds),
|
||||
// otherwise prompt the user to configure the integration.
|
||||
const errResp = e?.response || {};
|
||||
const errMessage = errResp?.error || e?.message || '';
|
||||
if (errMessage && errMessage.includes('No active integrations found')) {
|
||||
if (site?.wp_api_key || site?.wp_url) {
|
||||
try {
|
||||
const body = {
|
||||
site_id: siteId ? Number(siteId) : undefined,
|
||||
api_key: site?.wp_api_key,
|
||||
site_url: site?.wp_url,
|
||||
};
|
||||
const resp = await fetchAPI(`/v1/integration/integrations/test-connection/`, { method: 'POST', body: JSON.stringify(body) });
|
||||
if (resp && resp.success) {
|
||||
toast.success('Connection verified (collection). Fetching integrations...');
|
||||
setIntegrationTestStatus('connected');
|
||||
setIntegrationLastChecked(new Date().toISOString());
|
||||
await loadIntegrations();
|
||||
await loadContentTypes();
|
||||
} else {
|
||||
toast.error(resp?.message || 'Connection test failed (collection).');
|
||||
setIntegrationTestStatus('error');
|
||||
}
|
||||
} catch (innerErr: any) {
|
||||
toast.error(innerErr?.message || 'Collection-level connection test failed.');
|
||||
setIntegrationTestStatus('error');
|
||||
}
|
||||
} else {
|
||||
toast.error('No active integrations found for this site. Please configure WordPress integration in the Integrations tab.');
|
||||
setIntegrationTestStatus('not_configured');
|
||||
}
|
||||
} else {
|
||||
toast.error(e?.message || 'Failed to run site sync.');
|
||||
setIntegrationTestStatus('error');
|
||||
integrationErrorCooldownRef.current = Date.now() + 60 * 60 * 1000;
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (err: any) {
|
||||
toast.error(`Sync failed: ${err?.message || String(err)}`);
|
||||
setIntegrationTestStatus('error');
|
||||
integrationErrorCooldownRef.current = Date.now() + 60 * 60 * 1000;
|
||||
} finally {
|
||||
setSyncLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleSave = async () => {
|
||||
try {
|
||||
setSaving(true);
|
||||
@@ -195,11 +394,30 @@ export default function SiteSettings() {
|
||||
<div className="p-6">
|
||||
<PageMeta title="Site Settings - IGNY8" />
|
||||
|
||||
<PageHeader
|
||||
title="Site Settings"
|
||||
badge={{ icon: <GridIcon />, color: 'blue' }}
|
||||
hideSiteSector
|
||||
/>
|
||||
<div className="flex items-center gap-4">
|
||||
<PageHeader
|
||||
title={site?.name ? `${site.name} — Site Settings` : 'Site Settings'}
|
||||
badge={{ icon: <GridIcon />, color: 'blue' }}
|
||||
hideSiteSector
|
||||
/>
|
||||
{/* Integration status indicator (larger) */}
|
||||
<div className="flex items-center gap-3 ml-2">
|
||||
<span
|
||||
className={`inline-block w-6 h-6 rounded-full ${
|
||||
integrationTestStatus === 'connected' ? 'bg-green-500' :
|
||||
integrationTestStatus === 'pending' ? 'bg-yellow-400' :
|
||||
integrationTestStatus === 'error' ? 'bg-red-500' : 'bg-gray-300'
|
||||
}`}
|
||||
title={`Integration status: ${integrationTestStatus}${integrationLastChecked ? ' • last checked ' + formatRelativeTime(integrationLastChecked) : ''}`}
|
||||
/>
|
||||
<span className="text-sm text-gray-600 dark:text-gray-300">
|
||||
{integrationTestStatus === 'connected' && 'Connected'}
|
||||
{integrationTestStatus === 'pending' && 'Checking...'}
|
||||
{integrationTestStatus === 'error' && 'Error'}
|
||||
{integrationTestStatus === 'not_configured' && 'Not configured'}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Tabs */}
|
||||
<div className="mb-6 border-b border-gray-200 dark:border-gray-700">
|
||||
@@ -279,10 +497,129 @@ export default function SiteSettings() {
|
||||
<PlugInIcon className="w-4 h-4 inline mr-2" />
|
||||
Integrations
|
||||
</button>
|
||||
{(wordPressIntegration || site?.wp_url || site?.wp_api_key || site?.hosting_type === 'wordpress') && (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
setActiveTab('content-types');
|
||||
navigate(`/sites/${siteId}/settings?tab=content-types`, { replace: true });
|
||||
}}
|
||||
className={`px-4 py-2 font-medium border-b-2 transition-colors ${
|
||||
activeTab === 'content-types'
|
||||
? 'border-brand-500 text-brand-600 dark:text-brand-400'
|
||||
: 'border-transparent text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300'
|
||||
}`}
|
||||
>
|
||||
<FileIcon className="w-4 h-4 inline mr-2" />
|
||||
Content Types
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space-y-6">
|
||||
{/* Content Types Tab */}
|
||||
{activeTab === 'content-types' && (
|
||||
<Card>
|
||||
<div className="p-6">
|
||||
<h2 className="text-lg font-semibold mb-4">WordPress Content Types</h2>
|
||||
{contentTypesLoading ? (
|
||||
<div className="text-center py-8 text-gray-500">Loading content types...</div>
|
||||
) : (
|
||||
<>
|
||||
<div className="flex items-center justify-end gap-3 mb-4">
|
||||
<div className="text-sm text-gray-500 mr-auto">Last structure fetch: {formatRelativeTime(contentTypes?.last_structure_fetch)}</div>
|
||||
<Button
|
||||
variant="outline"
|
||||
disabled={syncLoading || !(wordPressIntegration || site?.wp_url || site?.wp_api_key || site?.hosting_type === 'wordpress')}
|
||||
onClick={handleManualSync}
|
||||
>
|
||||
{syncLoading ? 'Syncing...' : 'Sync Now'}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{!contentTypes ? (
|
||||
<div className="text-center py-8 text-gray-500">No content types data available</div>
|
||||
) : (
|
||||
<>
|
||||
{/* Post Types Section */}
|
||||
<div>
|
||||
<h3 className="text-md font-medium mb-3">Post Types</h3>
|
||||
<div className="space-y-3">
|
||||
{Object.entries(contentTypes.post_types || {}).map(([key, data]: [string, any]) => (
|
||||
<div key={key} className="flex items-center justify-between p-4 border border-gray-200 dark:border-gray-700 rounded-lg">
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center gap-3">
|
||||
<h4 className="font-medium">{data.label}</h4>
|
||||
<span className="text-sm text-gray-500">
|
||||
{data.count} total · {data.synced_count} synced
|
||||
</span>
|
||||
</div>
|
||||
{data.last_synced && (
|
||||
<p className="text-xs text-gray-500 mt-1">
|
||||
Last synced: {new Date(data.last_synced).toLocaleString()}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex items-center gap-3">
|
||||
<span className={`px-2 py-1 text-xs rounded ${data.enabled ? 'bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200' : 'bg-gray-100 text-gray-800 dark:bg-gray-800 dark:text-gray-200'}`}>
|
||||
{data.enabled ? 'Enabled' : 'Disabled'}
|
||||
</span>
|
||||
<span className="text-sm text-gray-500">Limit: {data.fetch_limit}</span>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Taxonomies Section */}
|
||||
<div>
|
||||
<h3 className="text-md font-medium mb-3">Taxonomies</h3>
|
||||
<div className="space-y-3">
|
||||
{Object.entries(contentTypes.taxonomies || {}).map(([key, data]: [string, any]) => (
|
||||
<div key={key} className="flex items-center justify-between p-4 border border-gray-200 dark:border-gray-700 rounded-lg">
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center gap-3">
|
||||
<h4 className="font-medium">{data.label}</h4>
|
||||
<span className="text-sm text-gray-500">
|
||||
{data.count} total · {data.synced_count} synced
|
||||
</span>
|
||||
</div>
|
||||
{data.last_synced && (
|
||||
<p className="text-xs text-gray-500 mt-1">
|
||||
Last synced: {new Date(data.last_synced).toLocaleString()}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex items-center gap-3">
|
||||
<span className={`px-2 py-1 text-xs rounded ${data.enabled ? 'bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200' : 'bg-gray-100 text-gray-800 dark:bg-gray-800 dark:text-gray-200'}`}>
|
||||
{data.enabled ? 'Enabled' : 'Disabled'}
|
||||
</span>
|
||||
<span className="text-sm text-gray-500">Limit: {data.fetch_limit}</span>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Summary */}
|
||||
{contentTypes.last_structure_fetch && (
|
||||
<div className="mt-4 p-4 bg-gray-50 dark:bg-gray-800 rounded-lg">
|
||||
<p className="text-sm text-gray-600 dark:text-gray-400">
|
||||
Structure last fetched: {new Date(contentTypes.last_structure_fetch).toLocaleString()}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
)}
|
||||
|
||||
{/* Original tab content below */}
|
||||
{activeTab !== 'content-types' && (
|
||||
<div className="space-y-6">
|
||||
{/* General Tab */}
|
||||
{activeTab === 'general' && (
|
||||
<Card className="p-6">
|
||||
@@ -547,14 +884,15 @@ export default function SiteSettings() {
|
||||
)}
|
||||
|
||||
{/* Save Button */}
|
||||
{activeTab !== 'integrations' && (
|
||||
{activeTab !== 'integrations' && activeTab !== 'content-types' && (
|
||||
<div className="flex justify-end">
|
||||
<Button onClick={handleSave} variant="primary" disabled={saving}>
|
||||
{saving ? 'Saving...' : 'Save Settings'}
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user