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

Add file input component to IOInputField and update IOView to use new input structure

Browse source
This commit is contained in:
anovazzi1 2024-01-26 14:52:00 -03:00
commit ff112cfd34
2 changed files with 24 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/frontend/src/components/IOInputField/index.tsx
View file

@ -17,6 +17,9 @@ export default function IOInputField({
onChange={updateValue} onChange={updateValue}
/> />
); );
case "fileInput":
return <div></div>;
default: default:
return ( return (
<Textarea <Textarea

45
src/frontend/src/components/IOview/index.tsx
View file

@ -41,17 +41,17 @@ export default function IOView(): JSX.Element {
<IconComponent name="Variable" className=" file-component-variable" /> <IconComponent name="Variable" className=" file-component-variable" />
<span className="file-component-variables-span text-md">Inputs</span> <span className="file-component-variables-span text-md">Inputs</span>
</div> </div>
{inputIds {inputs
.filter((input) => extractTypeFromLongId(input) !== "ChatInput") .filter((input) => input.type !== "ChatInput")
.map((inputId, index) => { .map((input, index) => {
const node: NodeType = nodes.find((node) => node.id === inputId)!; const node: NodeType = nodes.find((node) => node.id === input.id)!;
return ( return (
<div className="file-component-accordion-div" key={index}> <div className="file-component-accordion-div" key={index}>
<AccordionComponent <AccordionComponent
trigger={ trigger={
<div className="file-component-badge-div"> <div className="file-component-badge-div">
<Badge variant="gray" size="md"> <Badge variant="gray" size="md">
{inputId} {input.id}
</Badge> </Badge>
<div <div
className="-mb-1" className="-mb-1"
@ -62,27 +62,24 @@ export default function IOView(): JSX.Element {
</div> </div>
} }
key={index} key={index}
keyValue={inputId} keyValue={input.id}
> >
<div className="file-component-tab-column"> <div className="file-component-tab-column">
<IOInputField {node && (
value={ <IOInputField
nodes.find((node) => node.id === inputId)?.data.node value={node.data.node!.template.value.value}
.template.value.value inputType={input.type}
} updateValue={(e) => {
inputType={ e.target.value;
inputs.find((input) => input.id === inputId)?.type! if (node) {
} let newNode = cloneDeep(node);
updateValue={(e) => { newNode.data.node!.template["value"].value =
e.target.value; e.target.value;
if (node) { setNode(node.id, newNode);
let newNode = cloneDeep(node); }
newNode.data.node!.template["value"].value = }}
e.target.value; />
setNode(node.id, newNode); )}
}
}}
/>
</div> </div>
</AccordionComponent> </AccordionComponent>
</div> </div>