Enhance Site Settings with WordPress Integration

- Updated SiteSettings component to include a new 'Integrations' tab for managing WordPress integration.
- Added functionality to load, save, and sync WordPress integration settings.
- Integrated WordPressIntegrationCard and WordPressIntegrationModal for user interaction.
- Implemented URL parameter handling for tab navigation.

frontend/src/services/integration.api.ts

@@ -0,0 +1,146 @@
+/**
+ * Integration API Service
+ * Handles all integration-related API calls
+ */
+import { fetchAPI } from './api';
+
+export interface SiteIntegration {
+  id: number;
+  site: number;
+  platform: 'wordpress' | 'shopify' | 'custom';
+  platform_type: 'cms' | 'ecommerce' | 'custom_api';
+  config_json: Record<string, any>;
+  is_active: boolean;
+  sync_enabled: boolean;
+  last_sync_at?: string;
+  sync_status: 'success' | 'failed' | 'pending';
+  created_at: string;
+  updated_at: string;
+}
+
+export interface CreateIntegrationData {
+  site: number;
+  platform: 'wordpress' | 'shopify' | 'custom';
+  platform_type?: 'cms' | 'ecommerce' | 'custom_api';
+  config_json: Record<string, any>;
+  credentials?: Record<string, string>;
+  is_active?: boolean;
+  sync_enabled?: boolean;
+}
+
+export const integrationApi = {
+  /**
+   * Get all integrations for a site
+   */
+  async getSiteIntegrations(siteId: number): Promise<SiteIntegration[]> {
+    const response = await fetchAPI(`/v1/integration/integrations/?site=${siteId}`);
+    return response?.results || response || [];
+  },
+
+  /**
+   * Get integration by ID
+   */
+  async getIntegration(integrationId: number): Promise<SiteIntegration> {
+    return await fetchAPI(`/v1/integration/integrations/${integrationId}/`);
+  },
+
+  /**
+   * Create new integration
+   */
+  async createIntegration(data: CreateIntegrationData): Promise<SiteIntegration> {
+    return await fetchAPI('/v1/integration/integrations/', {
+      method: 'POST',
+      body: JSON.stringify(data),
+    });
+  },
+
+  /**
+   * Update integration
+   */
+  async updateIntegration(
+    integrationId: number,
+    data: Partial<CreateIntegrationData>
+  ): Promise<SiteIntegration> {
+    return await fetchAPI(`/v1/integration/integrations/${integrationId}/`, {
+      method: 'PATCH',
+      body: JSON.stringify(data),
+    });
+  },
+
+  /**
+   * Delete integration
+   */
+  async deleteIntegration(integrationId: number): Promise<void> {
+    await fetchAPI(`/v1/integration/integrations/${integrationId}/`, {
+      method: 'DELETE',
+    });
+  },
+
+  /**
+   * Test integration connection
+   */
+  async testIntegration(integrationId: number): Promise<{ success: boolean; message: string }> {
+    return await fetchAPI(`/v1/integration/integrations/${integrationId}/test/`, {
+      method: 'POST',
+    });
+  },
+
+  /**
+   * Sync content from integration
+   */
+  async syncIntegration(
+    integrationId: number,
+    syncType: 'full' | 'incremental' = 'incremental'
+  ): Promise<{ success: boolean; message: string; synced_count?: number }> {
+    return await fetchAPI(`/v1/integration/integrations/${integrationId}/sync/`, {
+      method: 'POST',
+      body: JSON.stringify({ sync_type: syncType }),
+    });
+  },
+
+  /**
+   * Get WordPress integration for a site
+   */
+  async getWordPressIntegration(siteId: number): Promise<SiteIntegration | null> {
+    const integrations = await this.getSiteIntegrations(siteId);
+    return integrations.find((i) => i.platform === 'wordpress') || null;
+  },
+
+  /**
+   * Create or update WordPress integration
+   */
+  async saveWordPressIntegration(
+    siteId: number,
+    data: {
+      url: string;
+      username: string;
+      app_password: string;
+      is_active?: boolean;
+      sync_enabled?: boolean;
+    }
+  ): Promise<SiteIntegration> {
+    const existing = await this.getWordPressIntegration(siteId);
+
+    const integrationData: CreateIntegrationData = {
+      site: siteId,
+      platform: 'wordpress',
+      platform_type: 'cms',
+      config_json: {
+        url: data.url,
+        username: data.username,
+      },
+      credentials: {
+        app_password: data.app_password,
+      },
+      is_active: data.is_active ?? true,
+      sync_enabled: data.sync_enabled ?? true,
+    };
+
+    if (existing) {
+      return await this.updateIntegration(existing.id, integrationData);
+    } else {
+      return await this.createIntegration(integrationData);
+    }
+  },
+};
+