jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

fix: update Multiselect component to use 'values' prop instead of 'value' (#2640)

Browse source
This commit is contained in:
Gabriel Luiz Freitas Almeida 2024-07-11 17:21:41 -03:00 • committed by GitHub
commit 7d7502744e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 12 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/backend/base/langflow/inputs/inputs.py
View file

@ -304,6 +304,7 @@ class MultiselectInput(BaseInputMixin, ListableInputMixin, DropDownMixin, Metada
field_type: Optional[SerializableFieldTypes] = FieldTypes.TEXT
options: list[str] = Field(default_factory=list)
is_list: bool = Field(default=True, serialization_alias="list")
class FileInput(BaseInputMixin, ListableInputMixin, FileMixin, MetadataTraceMixin):

3
src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
View file

@ -529,6 +529,7 @@ export default function ParameterComponent({
condition={
left === true &&
type === "str" &&
!data.node?.template[name]?.list &&
(data.node?.template[name]?.options ||
data.node?.template[name]?.real_time_refresh)
}
@ -570,7 +571,7 @@ export default function ParameterComponent({
<Multiselect
disabled={disabled}
options={data?.node?.template?.[name]?.options || []}
value={data?.node?.template?.[name]?.value || []}
values={data?.node?.template?.[name]?.value || []}
id={"multiselect-" + name}
onValueChange={handleOnNewValue}
/>

13
src/frontend/src/components/multiselectComponent/index.tsx
View file

@ -109,7 +109,7 @@ interface MultiselectProps<T>
asChild?: boolean;
className?: string;
editNode?: boolean;
value?: T[];
values?: T[];
}
export const Multiselect = forwardRef<
@ -125,18 +125,23 @@ export const Multiselect = forwardRef<
asChild = false,
className,
editNode = false,
value,
values,
...props
},
ref,
) => {
// if elements in values are strings, create the multiselectValue object
// otherwise, use the values as is
const value = values?.map((v) =>
typeof v === "string" ? { label: v, value: v } : v,
);
const [selectedValues, setSelectedValues] = useState<MultiselectValue[]>(
value || [],
);
const [isPopoverOpen, setIsPopoverOpen] = useState(false);
const combinedRef = useMergeRefs<HTMLButtonElement>(ref);
useEffect(() => {
if (!!value && value?.length > 0 && !isEqual(selectedValues, value)) {
setSelectedValues(value);
@ -264,7 +269,7 @@ export const Multiselect = forwardRef<
<CommandList>
<CommandEmpty>No results found.</CommandEmpty>
<CommandGroup>
{options?.map((option) => {
{value?.map((option) => {
const isSelected = !!selectedValues.find(
(sv) => sv.value === option.value,
);