From 46e58bf019988f6be831880bf58df9295ca02190 Mon Sep 17 00:00:00 2001
From: ValueOn AG <p.motsch@valueon.ch>
Date: Wed, 4 Feb 2026 22:10:45 +0100
Subject: [PATCH] billing integration into ai workflow

---
 src/hooks/playground/useDashboardInputForm.ts | 11 ++++++++---
 src/pages/workflows/PlaygroundPage.tsx        |  7 +++----
 2 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/hooks/playground/useDashboardInputForm.ts b/src/hooks/playground/useDashboardInputForm.ts
index 84517fa..8650fdf 100644
--- a/src/hooks/playground/useDashboardInputForm.ts
+++ b/src/hooks/playground/useDashboardInputForm.ts
@@ -30,6 +30,7 @@ export function useDashboardInputForm(instanceId: string) {
   const [optimisticMessage, setOptimisticMessage] = useState<WorkflowMessage | null>(null);
   const [selectedPromptId, setSelectedPromptId] = useState<string | null>(null);
   const [workflowMode, setWorkflowMode] = useState<'Dynamic' | 'Automation' | null>(null);
+  const [selectedProvider, setSelectedProvider] = useState<string>(''); // AI provider selection
   
   const { checkPermission, canView } = usePermissions();
   const [playgroundUIPermission, setPlaygroundUIPermission] = useState<boolean>(false);
@@ -594,7 +595,8 @@ export function useDashboardInputForm(instanceId: string) {
       const requestBody = {
         prompt: trimmedInput,
         listFileId: fileIdsToSend.length > 0 ? fileIdsToSend : undefined,
-        userLanguage: 'en'
+        userLanguage: 'en',
+        preferredProvider: selectedProvider || undefined  // AI provider selection
       };
       
       const result = await startWorkflow(requestBody, workflowOptions);
@@ -636,7 +638,7 @@ export function useDashboardInputForm(instanceId: string) {
         setWorkflowStatusOptimistic('idle');
       }
     }
-  }, [inputValue, pendingFiles, isRunning, workflowId, startingWorkflow, startWorkflow, stopWorkflow, resetWorkflow, refetchWorkflows, selectWorkflowFromContext, selectWorkflow, chatWorkflowPermission, workflowMode, setWorkflowStatusOptimistic]);
+  }, [inputValue, pendingFiles, isRunning, workflowId, startingWorkflow, startWorkflow, stopWorkflow, resetWorkflow, refetchWorkflows, selectWorkflowFromContext, selectWorkflow, chatWorkflowPermission, workflowMode, selectedProvider, setWorkflowStatusOptimistic]);
 
   useEffect(() => {
     const handleWorkflowCleared = () => {
@@ -820,7 +822,10 @@ export function useDashboardInputForm(instanceId: string) {
     allUserFiles: fileContext.files || [],
     handleFileAttach,
     handleFileUploadAndAttach,
-    latestStats
+    latestStats,
+    // AI Provider selection
+    selectedProvider,
+    onProviderSelect: setSelectedProvider
   };
 }
 
diff --git a/src/pages/workflows/PlaygroundPage.tsx b/src/pages/workflows/PlaygroundPage.tsx
index f85a71b..4cf2b8a 100644
--- a/src/pages/workflows/PlaygroundPage.tsx
+++ b/src/pages/workflows/PlaygroundPage.tsx
@@ -58,6 +58,8 @@ export const PlaygroundPage: React.FC = () => {
         deletingFiles,
         previewingFiles,
         downloadingFiles,
+        selectedProvider,
+        onProviderSelect,
     } = hookData;
 
     const { prompts, refetch: refetchPrompts } = usePrompts();
@@ -93,9 +95,6 @@ export const PlaygroundPage: React.FC = () => {
     // Prompts dropdown state
     const [selectedPromptId, setSelectedPromptId] = useState<string>('');
     
-    // AI Provider selection state
-    const [selectedProvider, setSelectedProvider] = useState<string>('');
-    
     // Load prompts on mount
     useEffect(() => {
         refetchPrompts();
@@ -788,7 +787,7 @@ export const PlaygroundPage: React.FC = () => {
                                 </button>
                                 <ProviderSelect
                                     value={selectedProvider}
-                                    onChange={setSelectedProvider}
+                                    onChange={onProviderSelect}
                                     showLabel={false}
                                 />
                                 <VoiceLanguageSelect