minor ui improvements

frontend/src/config/pages/images.config.tsx

@@ -65,19 +65,35 @@ export const createImagesPageConfig = (
       sortable: true,
       sortField: 'content_title',
       width: '250px',
-      render: (_value: string, row: ContentImagesGroup) => (
-        <div>
-          <a
-            href={`/writer/content/${row.content_id}`}
-            className="text-base font-light text-brand-500 hover:text-brand-600 dark:text-brand-400"
-          >
-            {row.content_title}
-          </a>
-          <div className="text-xs text-gray-500 dark:text-gray-400 mt-1">
-            ID: {row.content_id}
+      render: (_value: string, row: ContentImagesGroup) => {
+        const statusColors: Record<string, 'warning' | 'info' | 'success'> = {
+          draft: 'warning',
+          review: 'info',
+          publish: 'success',
+        };
+        const statusLabels: Record<string, string> = {
+          draft: 'Draft',
+          review: 'Review',
+          publish: 'Publish',
+        };
+        
+        return (
+          <div>
+            <a
+              href={`/writer/content/${row.content_id}`}
+              className="text-base font-light text-brand-500 hover:text-brand-600 dark:text-brand-400"
+            >
+              {row.content_title}
+            </a>
+            <div className="text-xs text-gray-500 dark:text-gray-400 mt-1 flex items-center gap-2">
+              <Badge color={statusColors[row.content_status] || 'warning'} size="xs" variant="soft">
+                {statusLabels[row.content_status] || row.content_status}
+              </Badge>
+              <span>ID: {row.content_id}</span>
+            </div>
           </div>
-        </div>
-      ),
+        );
+      },
     },
     {
       key: 'featured_image',