many changes for modules widgets and colors and styling

frontend/src/pages/Planner/Ideas.tsx

@@ -30,7 +30,7 @@ import { createIdeasPageConfig } from '../../config/pages/ideas.config';
 import { useSectorStore } from '../../store/sectorStore';
 import { usePageSizeStore } from '../../store/pageSizeStore';
 import PageHeader from '../../components/common/PageHeader';
-import ThreeWidgetFooter from '../../components/dashboard/ThreeWidgetFooter';
+import StandardThreeWidgetFooter from '../../components/dashboard/StandardThreeWidgetFooter';
 
 export default function Ideas() {
   const toast = useToast();
@@ -483,8 +483,8 @@ export default function Ideas() {
         }}
       />
 
-      {/* Three Widget Footer - Section 3 Layout */}
-      <ThreeWidgetFooter
+      {/* Three Widget Footer - Section 3 Layout with Standardized Workflow Widget */}
+      <StandardThreeWidgetFooter
         submoduleColor="amber"
         pageProgress={{
           title: 'Page Progress',
@@ -503,62 +503,15 @@ export default function Ideas() {
           hint: totalPending > 0
             ? `${totalPending} ideas ready to become tasks`
             : 'All ideas converted!',
+          statusInsight: totalPending > 0
+            ? `Select ideas and queue them to Writer to start content generation.`
+            : totalInTasks > 0
+              ? `Ideas queued. Go to Writer Tasks to generate content.`
+              : `No ideas yet. Generate ideas from Clusters page.`,
         }}
-        moduleStats={{
-          title: 'Planner Module',
-          pipeline: [
-            {
-              fromLabel: 'Keywords',
-              fromValue: clusters.reduce((sum, c) => sum + (c.keywords_count || 0), 0),
-              fromHref: '/planner/keywords',
-              actionLabel: 'Auto Cluster',
-              toLabel: 'Clusters',
-              toValue: clusters.length,
-              toHref: '/planner/clusters',
-              progress: 100,
-              color: 'blue',
-            },
-            {
-              fromLabel: 'Clusters',
-              fromValue: clusters.length,
-              fromHref: '/planner/clusters',
-              actionLabel: 'Generate Ideas',
-              toLabel: 'Ideas',
-              toValue: totalCount,
-              progress: 100,
-              color: 'green',
-            },
-            {
-              fromLabel: 'Ideas',
-              fromValue: totalCount,
-              actionLabel: 'Create Tasks',
-              toLabel: 'Tasks',
-              toValue: ideas.filter(i => i.status === 'queued' || i.status === 'completed').length,
-              toHref: '/writer/tasks',
-              progress: totalCount > 0 ? Math.round((ideas.filter(i => i.status === 'queued' || i.status === 'completed').length / totalCount) * 100) : 0,
-              color: 'amber',
-            },
-          ],
-          links: [
-            { label: 'Keywords', href: '/planner/keywords' },
-            { label: 'Clusters', href: '/planner/clusters' },
-            { label: 'Ideas', href: '/planner/ideas' },
-          ],
-        }}
-        completion={{
-          title: 'Workflow Completion',
-          plannerItems: [
-            { label: 'Keywords Clustered', value: clusters.reduce((sum, c) => sum + (c.keywords_count || 0), 0), color: 'blue' },
-            { label: 'Clusters Created', value: clusters.length, color: 'green' },
-            { label: 'Ideas Generated', value: totalCount, color: 'amber' },
-          ],
-          writerItems: [
-            { label: 'Content Generated', value: ideas.filter(i => i.status === 'completed').length, color: 'blue' },
-            { label: 'Images Created', value: totalImagesCount, color: 'purple' },
-            { label: 'Published', value: 0, color: 'green' },
-          ],
-          analyticsHref: '/account/usage',
-        }}
+        module="planner"
+        showCredits={true}
+        analyticsHref="/account/usage"
       />
 
       {/* Progress Modal for AI Functions */}