fix: selection styles

src/pages/llmodels/forms/lora-list-item.tsx

@@ -12,13 +12,17 @@ import useQueryModelLoraList, {
 import loraSelectionStyles from '../style/lora-selection.less';
 
 interface LoraListItemProps {
-  item: { value: any[]; lora_name: string };
+  item: { value: any[]; lora_name: string; source: string };
   base: string;
   defaultDataList: LoraOptionGroup[];
   selectedRepoNames: Set<string>;
   duplicateNames: Set<string>;
   validated: boolean;
-  onChange: (partial: { value?: any[]; lora_name?: string }) => void;
+  onChange: (partial: {
+    value?: any[];
+    lora_name?: string;
+    source?: string;
+  }) => void;
 }
 
 const LoraListItem: React.FC<LoraListItemProps> = ({
@@ -77,8 +81,9 @@ const LoraListItem: React.FC<LoraListItemProps> = ({
     debouncedSearch(q);
   };
 
-  const handleCascaderChange = (value: any) => {
-    onChange({ value: value || [] });
+  const handleCascaderChange = (value: any, selectedOptions?: any[]) => {
+    const leaf = selectedOptions?.[selectedOptions.length - 1];
+    onChange({ value: value || [], source: leaf?.source || '' });
   };
 
   const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
@@ -97,19 +102,18 @@ const LoraListItem: React.FC<LoraListItemProps> = ({
     validated && (nameEmpty || isDuplicate) ? ('error' as const) : 'success';
 
   const displayRender = (labels: any[]) => {
+    const left =
+      typeof labels[0] === 'string' ? labels[0].replace(/\/+$/, '') : labels[0];
+    const right =
+      typeof labels[1] === 'string' ? labels[1].replace(/^\/+/, '') : labels[1];
+    const content = (
+      <span>
+        {left}/{right}
+      </span>
+    );
     return (
-      <AutoTooltip
-        ghost
-        maxWidth={300}
-        title={
-          <span>
-            {labels[0]} / {labels[1]}
-          </span>
-        }
-      >
-        <span>
-          {labels[0]} / {labels[1]}
-        </span>
+      <AutoTooltip ghost maxWidth={300} title={content}>
+        {content}
       </AutoTooltip>
     );
   };

src/pages/llmodels/forms/model-lora-list.tsx

@@ -6,7 +6,7 @@ import { FormData, LoraListItem } from '../config/types';
 import useQueryModelLoraList from '../services/use-query-lora-list';
 import LoraItem from './lora-list-item';
 
-type ItemValue = { value: any[]; lora_name: string };
+type ItemValue = { value: any[]; lora_name: string; source: string };
 
 const ModelLoraList = () => {
   const intl = useIntl();
@@ -37,7 +37,8 @@ const ModelLoraList = () => {
             it.source && it.lora_repo_name
               ? [it.source, it.lora_repo_name]
               : [],
-          lora_name: it.lora_name || ''
+          lora_name: it.lora_name || '',
+          source: it.source || ''
         }))
       );
     }
@@ -56,6 +57,30 @@ const ModelLoraList = () => {
     prevBaseRef.current = base;
   }, [base]);
 
+  useEffect(() => {
+    if (!defaultDataList.length) return;
+    const groupByRepo: Record<string, string> = {};
+    defaultDataList.forEach((group) => {
+      group.children.forEach((child) => {
+        groupByRepo[child.value] = group.value;
+      });
+    });
+    setItemList((prev) => {
+      let changed = false;
+      const next = prev.map((it) => {
+        const repo = it.value?.[1];
+        if (!repo) return it;
+        const groupValue = groupByRepo[repo];
+        if (groupValue && groupValue !== it.value[0]) {
+          changed = true;
+          return { ...it, value: [groupValue, repo] };
+        }
+        return it;
+      });
+      return changed ? next : prev;
+    });
+  }, [defaultDataList]);
+
   const selectedRepoNames = useMemo(() => {
     return new Set(
       itemList.map((it) => it.value?.[1]).filter(Boolean) as string[]
@@ -78,7 +103,9 @@ const ModelLoraList = () => {
   const syncFormField = (newItemList: ItemValue[]) => {
     const newFormList = newItemList
       .map((it) => ({
-        source: (it.value?.[0] || '') as 'huggingface' | 'model_scope',
+        source: (it.source || it.value?.[0] || '') as
+          | 'huggingface'
+          | 'model_scope',
         lora_repo_name: it.value?.[1] || '',
         lora_name: it.lora_name || ''
       }))
@@ -103,7 +130,7 @@ const ModelLoraList = () => {
   };
 
   const handleAdd = () => {
-    const newItemList = [...itemList, { value: [], lora_name: '' }];
+    const newItemList = [...itemList, { value: [], lora_name: '', source: '' }];
     setItemList(newItemList);
     syncFormField(newItemList);
   };