Section 1 & 2 - #Migration Run

frontend/src/templates/ContentViewTemplate.tsx

@@ -792,6 +792,12 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
     if (statusLower === 'generated' || statusLower === 'published' || statusLower === 'complete') {
       return 'bg-success-100 text-success-800 dark:bg-success-900/30 dark:text-success-400';
     }
+    if (statusLower === 'approved') {
+      return 'bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-400';
+    }
+    if (statusLower === 'review') {
+      return 'bg-purple-100 text-purple-800 dark:bg-purple-900/30 dark:text-purple-400';
+    }
     if (statusLower === 'pending' || statusLower === 'draft') {
       return 'bg-warning-100 text-warning-800 dark:bg-warning-900/30 dark:text-warning-400';
     }
@@ -801,6 +807,18 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
     return 'bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-300';
   };
 
+  const getStatusLabel = (status: string, hasExternalId?: boolean) => {
+    const statusLower = status.toLowerCase();
+    // Map status to user-friendly labels
+    const statusLabels: Record<string, string> = {
+      'draft': 'Draft',
+      'review': 'In Review',
+      'approved': 'Ready to Publish',
+      'published': hasExternalId ? 'On Site' : 'Approved',
+    };
+    return statusLabels[statusLower] || status.charAt(0).toUpperCase() + status.slice(1);
+  };
+
   return (
     <div className="min-h-screen bg-gray-50 dark:bg-gray-900 py-8">
       <div className="max-w-[1440px] mx-auto px-4 sm:px-6 lg:px-8">
@@ -824,7 +842,7 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
                 <div className="flex items-center gap-3 mb-3">
                   <FileTextIcon className="w-6 h-6" />
                   <span className={`px-3 py-1 rounded-full text-sm font-medium ${getStatusColor(content.status)}`}>
-                    {content.status}
+                    {getStatusLabel(content.status, !!content.external_id)}
                   </span>
                 </div>
                 <h1 className="text-3xl font-bold mb-2">