mirror of
https://github.com/infiniflow/ragflow.git
synced 2026-01-04 03:25:30 +08:00
Fix: Fixed the issue where the drop-down box could not be displayed after selecting a large model #9869 (#10205)
### What problem does this PR solve? Fix: Fixed the issue where the drop-down box could not be displayed after selecting a large model #9869 ### Type of change - [x] Bug Fix (non-breaking change which fixes an issue)
This commit is contained in:
@ -49,6 +49,22 @@ export type SelectWithSearchFlagProps = {
|
||||
placeholder?: string;
|
||||
};
|
||||
|
||||
function findLabelWithoutOptions(
|
||||
options: SelectWithSearchFlagOptionType[],
|
||||
value: string,
|
||||
) {
|
||||
return options.find((opt) => opt.value === value)?.label || '';
|
||||
}
|
||||
|
||||
function findLabelWithOptions(
|
||||
options: SelectWithSearchFlagOptionType[],
|
||||
value: string,
|
||||
) {
|
||||
return options
|
||||
.map((group) => group?.options?.find((item) => item.value === value))
|
||||
.filter(Boolean)[0]?.label;
|
||||
}
|
||||
|
||||
export const SelectWithSearch = forwardRef<
|
||||
React.ElementRef<typeof Button>,
|
||||
SelectWithSearchFlagProps
|
||||
@ -69,6 +85,28 @@ export const SelectWithSearch = forwardRef<
|
||||
const [open, setOpen] = useState<boolean>(false);
|
||||
const [value, setValue] = useState<string>('');
|
||||
|
||||
const selectLabel = useMemo(() => {
|
||||
if (options.every((x) => x.options === undefined)) {
|
||||
return findLabelWithoutOptions(options, value);
|
||||
} else if (options.every((x) => Array.isArray(x.options))) {
|
||||
return findLabelWithOptions(options, value);
|
||||
} else {
|
||||
// Some have options, some don't
|
||||
const optionsWithOptions = options.filter((x) =>
|
||||
Array.isArray(x.options),
|
||||
);
|
||||
const optionsWithoutOptions = options.filter(
|
||||
(x) => x.options === undefined,
|
||||
);
|
||||
|
||||
const label = findLabelWithOptions(optionsWithOptions, value);
|
||||
if (label) {
|
||||
return label;
|
||||
}
|
||||
return findLabelWithoutOptions(optionsWithoutOptions, value);
|
||||
}
|
||||
}, [options, value]);
|
||||
|
||||
const handleSelect = useCallback(
|
||||
(val: string) => {
|
||||
setValue(val);
|
||||
@ -90,16 +128,7 @@ export const SelectWithSearch = forwardRef<
|
||||
useEffect(() => {
|
||||
setValue(val);
|
||||
}, [val]);
|
||||
const selectLabel = useMemo(() => {
|
||||
const optionTemp = options[0];
|
||||
if (optionTemp?.options) {
|
||||
return options
|
||||
.map((group) => group?.options?.find((item) => item.value === value))
|
||||
.filter(Boolean)[0]?.label;
|
||||
} else {
|
||||
return options.find((opt) => opt.value === value)?.label || '';
|
||||
}
|
||||
}, [options, value]);
|
||||
|
||||
return (
|
||||
<Popover open={open} onOpenChange={setOpen}>
|
||||
<PopoverTrigger asChild>
|
||||
|
||||
Reference in New Issue
Block a user