fix: pass ownerTenantId to LLMLabel and related components for improved model fetching (#16800)

web/src/components/llm-select/llm-label.tsx

@@ -1,16 +1,30 @@
+import { useFetchAllAddedModels } from '@/hooks/use-llm-request';
 import { parseModelValue } from '@/utils/llm-util';
 import { memo } from 'react';
 import { LlmIcon } from '../svg-icon';
 
 interface IProps {
   value?: string;
+  ownerTenantId?: string;
 }
 
-export const LLMLabel = ({ value }: IProps) => {
+export const LLMLabel = ({ value, ownerTenantId }: IProps) => {
+  const { data: models } = useFetchAllAddedModels(undefined, ownerTenantId);
+
   const parsed = value ? parseModelValue(value) : null;
-  const modelName = parsed?.model_name;
-  const instanceName = parsed?.model_instance;
-  const iconName = parsed ? parsed.model_provider : '';
+
+  let modelName = parsed?.model_name;
+  let instanceName = parsed?.model_instance;
+  let iconName = parsed ? parsed.model_provider : '';
+
+  if (!modelName && value) {
+    const model = models.find((m) => m.model_id === value);
+    if (model) {
+      modelName = model.name;
+      instanceName = model.instance_name;
+      iconName = model.provider_name;
+    }
+  }
 
   if (!modelName) return null;
 

web/src/components/llm-select/next.tsx

@@ -66,7 +66,7 @@ const NextInnerLLMSelect = forwardRef<
               data-testid={triggerTestId}
             >
               <SelectValue placeholder={t('common.pleaseSelect')}>
-                <LLMLabel value={value} />
+                <LLMLabel value={value} ownerTenantId={ownerTenantId} />
               </SelectValue>
             </SelectTrigger>
           </PopoverTrigger>

web/src/pages/agent/canvas/node/card.tsx

@@ -21,6 +21,7 @@ import { useFetchAllAddedModels } from '@/hooks/use-llm-request';
 import { cn } from '@/lib/utils';
 import { parseModelValue } from '@/utils/llm-util';
 import { PropsWithChildren, useMemo } from 'react';
+import { useOwnerTenantId } from '../../context';
 
 export function CardWithForm() {
   return (
@@ -81,7 +82,11 @@ export function LabelCard({ children, className, ...props }: LabelCardProps) {
 }
 
 export function LLMLabelCard({ llmId }: { llmId?: string }) {
-  const { data: allAddedModels } = useFetchAllAddedModels();
+  const ownerTenantId = useOwnerTenantId();
+  const { data: allAddedModels } = useFetchAllAddedModels(
+    undefined,
+    ownerTenantId,
+  );
 
   const isValidLlm = useMemo(() => {
     if (!llmId) return false;
@@ -96,14 +101,15 @@ export function LLMLabelCard({ llmId }: { llmId?: string }) {
       );
     }
 
-    return false;
+    // value is a plain model_id rather than the composite string
+    return allAddedModels.some((m) => m.model_id === llmId);
   }, [allAddedModels, llmId]);
 
   return (
     <LabelCard
       className={isValidLlm ? '' : 'bg-state-error-5 border-state-error border'}
     >
-      <LLMLabel value={llmId}></LLMLabel>
+      <LLMLabel value={llmId} ownerTenantId={ownerTenantId}></LLMLabel>
     </LabelCard>
   );
 }

web/src/pages/agent/form/compilation-form/index.tsx

@@ -7,6 +7,7 @@ import { memo } from 'react';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { initialCompilationValues } from '../../constant/pipeline';
+import { useOwnerTenantId } from '../../context';
 import { useFormValues } from '../../hooks/use-form-values';
 import { useWatchFormChange } from '../../hooks/use-watch-form-change';
 import { INextOperatorForm } from '../../interface';
@@ -25,6 +26,7 @@ const outputList = buildOutputList(initialCompilationValues.outputs);
 
 const CompilationForm = ({ node }: INextOperatorForm) => {
   const defaultValues = useFormValues(initialCompilationValues, node);
+  const ownerTenantId = useOwnerTenantId();
 
   const form = useForm<CompilationFormSchemaType>({
     defaultValues,
@@ -36,7 +38,7 @@ const CompilationForm = ({ node }: INextOperatorForm) => {
   return (
     <Form {...form}>
       <FormWrapper>
-        <LargeModelFormField></LargeModelFormField>
+        <LargeModelFormField ownerTenantId={ownerTenantId}></LargeModelFormField>
         <CompilationTemplateFormField name="compilation_template_group_ids"></CompilationTemplateFormField>
         <Output list={outputList}></Output>
       </FormWrapper>

web/src/pages/next-chats/chat/chat-box/next-multiple-chat-box.tsx

@@ -184,6 +184,7 @@ const ChatCard = forwardRef(function ChatCard(
               <LargeModelFormFieldWithoutFilter
                 triggerTestId="chat-detail-multimodel-card-model-select"
                 optionTestIdPrefix="chat-detail-llm-option-"
+                ownerTenantId={currentDialog?.tenant_id}
               ></LargeModelFormFieldWithoutFilter>
             </Form>
           </div>

web/src/pages/next-chats/chat/llm-select-form.tsx

@@ -29,7 +29,7 @@ export function LLMSelectForm() {
 
   return (
     <Form {...form}>
-      <LargeModelFormFieldWithoutFilter></LargeModelFormFieldWithoutFilter>
+      <LargeModelFormFieldWithoutFilter ownerTenantId={data?.tenant_id}></LargeModelFormFieldWithoutFilter>
     </Form>
   );
 }