trash models added, first attempt for remainign issues

frontend/src/components/Automation/CurrentProcessingCardV2.tsx

@@ -4,7 +4,7 @@
  * Clean UI without cluttered "Currently Processing" and "Up Next" sections
  */
 import React, { useEffect, useState } from 'react';
-import { automationService, ProcessingState, AutomationRun, PipelineStage } from '../../services/automationService';
+import { automationService, ProcessingState, AutomationRun, PipelineStage, CurrentProcessingResponse } from '../../services/automationService';
 import { useToast } from '../ui/toast/ToastContainer';
 import Button from '../ui/button/Button';
 import IconButton from '../ui/button/IconButton';
@@ -98,6 +98,7 @@ const CurrentProcessingCard: React.FC<CurrentProcessingCardProps> = ({
   pipelineOverview,
 }) => {
   const [processingState, setProcessingState] = useState<ProcessingState | null>(null);
+  const [totalCreditsUsed, setTotalCreditsUsed] = useState<number>(currentRun.total_credits_used);
   const [isPausing, setIsPausing] = useState(false);
   const [isResuming, setIsResuming] = useState(false);
   const [isCancelling, setIsCancelling] = useState(false);
@@ -110,12 +111,21 @@ const CurrentProcessingCard: React.FC<CurrentProcessingCardProps> = ({
 
     const fetchState = async () => {
       try {
-        const state = await automationService.getCurrentProcessing(siteId, runId);
+        const response = await automationService.getCurrentProcessing(siteId, runId);
         if (!isMounted) return;
-        setProcessingState(state);
+        
+        if (response) {
+          // Update processing state from nested state object
+          setProcessingState(response.state);
+          
+          // Update credits from the response
+          if (response.total_credits_used !== undefined) {
+            setTotalCreditsUsed(response.total_credits_used);
+          }
+        }
         
         // If stage completed, trigger update
-        if (state && state.processed_items >= state.total_items && state.total_items > 0) {
+        if (response?.state && response.state.processed_items >= response.state.total_items && response.state.total_items > 0) {
           onUpdate();
         }
       } catch (err) {
@@ -323,7 +333,7 @@ const CurrentProcessingCard: React.FC<CurrentProcessingCardProps> = ({
               <BoltIcon className="w-4 h-4 text-warning-500" />
               <span className="text-xs font-medium text-gray-500 uppercase">Credits</span>
             </div>
-            <span className="text-base font-bold text-warning-600">{currentRun.total_credits_used}</span>
+            <span className="text-base font-bold text-warning-600">{totalCreditsUsed}</span>
           </div>
           
           <div className="bg-white dark:bg-gray-800 rounded-xl px-3 py-2.5 border border-gray-200 dark:border-gray-700 flex items-center justify-between">

frontend/src/components/common/SiteCard.tsx

@@ -5,7 +5,7 @@ import Badge from '../ui/badge/Badge';
 import SiteSetupChecklist from '../sites/SiteSetupChecklist';
 import SiteTypeBadge from '../sites/SiteTypeBadge';
 import { Site } from '../../services/api';
-import { BoxCubeIcon as SettingsIcon, EyeIcon, FileIcon } from '../../icons';
+import { BoxCubeIcon as SettingsIcon, EyeIcon, FileIcon, TrashBinIcon } from '../../icons';
 
 interface SiteCardProps {
   site: Site;
@@ -13,6 +13,7 @@ interface SiteCardProps {
   onToggle: (siteId: number, enabled: boolean) => void;
   onSettings: (site: Site) => void;
   onDetails: (site: Site) => void;
+  onDelete?: (site: Site) => void;
   isToggling?: boolean;
 }
 
@@ -22,6 +23,7 @@ export default function SiteCard({
   onToggle,
   onSettings,
   onDetails,
+  onDelete,
   isToggling = false,
 }: SiteCardProps) {
   const handleToggle = (enabled: boolean) => {
@@ -126,6 +128,16 @@ export default function SiteCard({
           >
             Settings
           </Button>
+          {onDelete && (
+            <Button
+              variant="outline"
+              tone="destructive"
+              size="sm"
+              onClick={() => onDelete(site)}
+              startIcon={<TrashBinIcon className="w-4 h-4" />}
+              title="Delete site"
+            />
+          )}
         </div>
       </div>
     </article>

frontend/src/components/dashboard/AIOperationsWidget.tsx

@@ -20,7 +20,7 @@ export interface AIOperation {
 }
 
 export interface AIOperationsData {
-  period: '7d' | '30d' | '90d';
+  period: 'today' | '7d' | '30d' | '90d';
   operations: AIOperation[];
   totals: {
     count: number;
@@ -32,7 +32,7 @@ export interface AIOperationsData {
 
 interface AIOperationsWidgetProps {
   data: AIOperationsData;
-  onPeriodChange?: (period: '7d' | '30d' | '90d') => void;
+  onPeriodChange?: (period: 'today' | '7d' | '30d' | '90d') => void;
   loading?: boolean;
 }
 
@@ -54,6 +54,7 @@ const operationConfig: Record<string, { label: string; icon: typeof GroupIcon; g
 const defaultConfig = { label: 'Other', icon: BoltIcon, gradient: 'from-gray-500 to-gray-600' };
 
 const periods = [
+  { value: 'today', label: 'Today' },
   { value: '7d', label: '7 days' },
   { value: '30d', label: '30 days' },
   { value: '90d', label: '90 days' },