Fix workflow welcome card selection

Author: andybraren

components/frontend/src/app/projects/[name]/sessions/[sessionName]/components/welcome-experience.tsx

@@ -116,6 +116,7 @@ export function WelcomeExperience({
   }, [isSetupTypingComplete, hasRealMessages]);
 
   const handleWorkflowSelect = (workflowId: string) => {
+    console.log('[WelcomeExperience] Workflow selected:', workflowId);
     setSelectedWorkflowId(workflowId);
     onWorkflowSelect(workflowId);
     onUserInteraction();
@@ -139,6 +140,18 @@ export function WelcomeExperience({
       return 0; // Keep original order for items in the same category
     });
 
+  // Debug logging to trace workflow rendering
+  useEffect(() => {
+    if (enabledWorkflows.length > 0) {
+      console.log('[WelcomeExperience] Enabled workflows:', enabledWorkflows.map((w, idx) => ({
+        index: idx,
+        id: w.id,
+        name: w.name,
+        description: w.description?.substring(0, 50) + '...'
+      })));
+    }
+  }, [enabledWorkflows]);
+
   // Filter workflows based on search query (for dropdown - includes all workflows)
   const filteredWorkflows = ootbWorkflows.filter((workflow) => {
     if (!workflowSearch) return true;
@@ -247,19 +260,12 @@ export function WelcomeExperience({
                 }}
               >
                 <CardContent className="p-3 space-y-1">
-                  <div className="flex items-center justify-between">
-                    <h3 className={cn(
-                      "text-sm font-semibold",
-                      selectedWorkflowId !== null && selectedWorkflowId !== workflow.id && "text-muted-foreground/60"
-                    )}>
-                      {workflow.name}
-                    </h3>
-                    {selectedWorkflowId === workflow.id && (
-                      <Badge variant="outline" className="bg-green-50 text-green-700 border-green-200">
-                        Selected
-                      </Badge>
-                    )}
-                  </div>
+                  <h3 className={cn(
+                    "text-sm font-semibold",
+                    selectedWorkflowId !== null && selectedWorkflowId !== workflow.id && "text-muted-foreground/60"
+                  )}>
+                    {workflow.name}
+                  </h3>
                   <p className={cn(
                     "text-xs line-clamp-2",
                     selectedWorkflowId !== null && selectedWorkflowId !== workflow.id

components/frontend/src/app/projects/[name]/sessions/[sessionName]/hooks/use-workflow-management.ts

@@ -97,6 +97,8 @@ export function useWorkflowManagement({
 
   // Handle workflow selection change
   const handleWorkflowChange = useCallback((value: string, ootbWorkflows: WorkflowConfig[], onCustom: () => void) => {
+    console.log('[WorkflowManagement] handleWorkflowChange called with:', value);
+    console.log('[WorkflowManagement] Available workflows:', ootbWorkflows.map(w => ({ id: w.id, name: w.name })));
     setSelectedWorkflow(value);
 
     if (value === "none") {
@@ -111,6 +113,7 @@ export function useWorkflowManagement({
 
     // Find the selected workflow from OOTB workflows
     const workflow = ootbWorkflows.find(w => w.id === value);
+    console.log('[WorkflowManagement] Found workflow:', workflow ? { id: workflow.id, name: workflow.name } : 'NOT FOUND');
     if (!workflow) {
       errorToast(`Workflow ${value} not found`);
       return null;