update templateName variable to templateField

This commit is contained in:
anovazzi1 2023-08-08 20:59:28 -03:00
commit 9b523ad11c
4 changed files with 128 additions and 128 deletions

View file

@ -159,18 +159,18 @@ export default function GenericNode({
<> <>
{Object.keys(data.node.template) {Object.keys(data.node.template)
.filter((templateName) => templateName.charAt(0) !== "_") .filter((templateField) => templateField.charAt(0) !== "_")
.map((templateName: string, idx) => ( .map((templateField: string, idx) => (
<div key={idx}> <div key={idx}>
{data.node.template[templateName].show && {data.node.template[templateField].show &&
!data.node.template[templateName].advanced ? ( !data.node.template[templateField].advanced ? (
<ParameterComponent <ParameterComponent
key={ key={
(data.node.template[templateName].input_types?.join( (data.node.template[templateField].input_types?.join(
";" ";"
) ?? data.node.template[templateName].type) + ) ?? data.node.template[templateField].type) +
"|" + "|" +
templateName + templateField +
"|" + "|" +
data.id data.id
} }
@ -178,39 +178,39 @@ export default function GenericNode({
setData={setData} setData={setData}
color={ color={
nodeColors[ nodeColors[
types[data.node.template[templateName].type] types[data.node.template[templateField].type]
] ?? ] ??
nodeColors[data.node.template[templateName].type] ?? nodeColors[data.node.template[templateField].type] ??
nodeColors.unknown nodeColors.unknown
} }
title={ title={
data.node.template[templateName].display_name data.node.template[templateField].display_name
? data.node.template[templateName].display_name ? data.node.template[templateField].display_name
: data.node.template[templateName].name : data.node.template[templateField].name
? toTitleCase(data.node.template[templateName].name) ? toTitleCase(data.node.template[templateField].name)
: toTitleCase(templateName) : toTitleCase(templateField)
} }
info={data.node.template[templateName].info} info={data.node.template[templateField].info}
name={templateName} name={templateField}
tooltipTitle={ tooltipTitle={
data.node.template[templateName].input_types?.join( data.node.template[templateField].input_types?.join(
"\n" "\n"
) ?? data.node.template[templateName].type ) ?? data.node.template[templateField].type
} }
required={data.node.template[templateName].required} required={data.node.template[templateField].required}
id={ id={
(data.node.template[templateName].input_types?.join( (data.node.template[templateField].input_types?.join(
";" ";"
) ?? data.node.template[templateName].type) + ) ?? data.node.template[templateField].type) +
"|" + "|" +
templateName + templateField +
"|" + "|" +
data.id data.id
} }
left={true} left={true}
type={data.node.template[templateName].type} type={data.node.template[templateField].type}
optionalHandle={ optionalHandle={
data.node.template[templateName].input_types data.node.template[templateField].input_types
} }
/> />
) : ( ) : (

View file

@ -230,60 +230,60 @@ export default function CodeTabsComponent({
<TableBody className="p-0"> <TableBody className="p-0">
{Object.keys(node["data"]["node"]["template"]) {Object.keys(node["data"]["node"]["template"])
.filter( .filter(
(templateName) => (templateField) =>
templateName.charAt(0) !== "_" && templateField.charAt(0) !== "_" &&
node.data.node.template[templateName] node.data.node.template[templateField]
.show && .show &&
(node.data.node.template[templateName] (node.data.node.template[templateField]
.type === "str" || .type === "str" ||
node.data.node.template[templateName] node.data.node.template[templateField]
.type === "bool" || .type === "bool" ||
node.data.node.template[templateName] node.data.node.template[templateField]
.type === "float" || .type === "float" ||
node.data.node.template[templateName] node.data.node.template[templateField]
.type === "code" || .type === "code" ||
node.data.node.template[templateName] node.data.node.template[templateField]
.type === "prompt" || .type === "prompt" ||
node.data.node.template[templateName] node.data.node.template[templateField]
.type === "file" || .type === "file" ||
node.data.node.template[templateName] node.data.node.template[templateField]
.type === "int") .type === "int")
) )
.map((templateName, index) => { .map((templateField, index) => {
return ( return (
<TableRow <TableRow
key={index} key={index}
className="h-10 dark:border-b-muted" className="h-10 dark:border-b-muted"
> >
<TableCell className="p-0 text-center text-sm text-foreground"> <TableCell className="p-0 text-center text-sm text-foreground">
{templateName} {templateField}
</TableCell> </TableCell>
<TableCell className="p-0 text-xs text-foreground"> <TableCell className="p-0 text-xs text-foreground">
<div className="m-auto w-[250px]"> <div className="m-auto w-[250px]">
{node.data.node.template[ {node.data.node.template[
templateName templateField
].type === "str" && ].type === "str" &&
!node.data.node.template[ !node.data.node.template[
templateName templateField
].options ? ( ].options ? (
<div className="mx-auto"> <div className="mx-auto">
{node.data.node.template[ {node.data.node.template[
templateName templateField
].list ? ( ].list ? (
<InputListComponent <InputListComponent
editNode={true} editNode={true}
disabled={false} disabled={false}
value={ value={
!node.data.node.template[ !node.data.node.template[
templateName templateField
].value || ].value ||
node.data.node.template[ node.data.node.template[
templateName templateField
].value === "" ].value === ""
? [""] ? [""]
: node.data.node : node.data.node
.template[ .template[
templateName templateField
].value ].value
} }
onChange={(target) => { onChange={(target) => {
@ -293,7 +293,7 @@ export default function CodeTabsComponent({
newInputList[ newInputList[
index index
].data.node.template[ ].data.node.template[
templateName templateField
].value = target; ].value = target;
return newInputList; return newInputList;
}); });
@ -301,18 +301,18 @@ export default function CodeTabsComponent({
node["data"]["id"], node["data"]["id"],
target, target,
node.data.node.template[ node.data.node.template[
templateName templateField
] ]
); );
}} }}
/> />
) : node.data.node.template[ ) : node.data.node.template[
templateName templateField
].multiline ? ( ].multiline ? (
<ShadTooltip <ShadTooltip
content={tweaks.buildContent( content={tweaks.buildContent(
node.data.node.template[ node.data.node.template[
templateName templateField
].value ].value
)} )}
> >
@ -323,16 +323,16 @@ export default function CodeTabsComponent({
value={ value={
!node.data.node !node.data.node
.template[ .template[
templateName templateField
].value || ].value ||
node.data.node node.data.node
.template[ .template[
templateName templateField
].value === "" ].value === ""
? "" ? ""
: node.data.node : node.data.node
.template[ .template[
templateName templateField
].value ].value
} }
onChange={(target) => { onChange={(target) => {
@ -342,7 +342,7 @@ export default function CodeTabsComponent({
newInputList[ newInputList[
index index
].data.node.template[ ].data.node.template[
templateName templateField
].value = target; ].value = target;
return newInputList; return newInputList;
}); });
@ -351,7 +351,7 @@ export default function CodeTabsComponent({
target, target,
node.data.node node.data.node
.template[ .template[
templateName templateField
] ]
); );
}} }}
@ -364,20 +364,20 @@ export default function CodeTabsComponent({
disabled={false} disabled={false}
password={ password={
node.data.node.template[ node.data.node.template[
templateName templateField
].password ?? false ].password ?? false
} }
value={ value={
!node.data.node.template[ !node.data.node.template[
templateName templateField
].value || ].value ||
node.data.node.template[ node.data.node.template[
templateName templateField
].value === "" ].value === ""
? "" ? ""
: node.data.node : node.data.node
.template[ .template[
templateName templateField
].value ].value
} }
onChange={(target) => { onChange={(target) => {
@ -387,7 +387,7 @@ export default function CodeTabsComponent({
newInputList[ newInputList[
index index
].data.node.template[ ].data.node.template[
templateName templateField
].value = target; ].value = target;
return newInputList; return newInputList;
}); });
@ -395,7 +395,7 @@ export default function CodeTabsComponent({
node["data"]["id"], node["data"]["id"],
target, target,
node.data.node.template[ node.data.node.template[
templateName templateField
] ]
); );
}} }}
@ -403,14 +403,14 @@ export default function CodeTabsComponent({
)} )}
</div> </div>
) : node.data.node.template[ ) : node.data.node.template[
templateName templateField
].type === "bool" ? ( ].type === "bool" ? (
<div className="ml-auto"> <div className="ml-auto">
{" "} {" "}
<ToggleShadComponent <ToggleShadComponent
enabled={ enabled={
node.data.node.template[ node.data.node.template[
templateName templateField
].value ].value
} }
setEnabled={(e) => { setEnabled={(e) => {
@ -420,7 +420,7 @@ export default function CodeTabsComponent({
newInputList[ newInputList[
index index
].data.node.template[ ].data.node.template[
templateName templateField
].value = e; ].value = e;
return newInputList; return newInputList;
}); });
@ -428,7 +428,7 @@ export default function CodeTabsComponent({
node["data"]["id"], node["data"]["id"],
e, e,
node.data.node.template[ node.data.node.template[
templateName templateField
] ]
); );
}} }}
@ -437,19 +437,19 @@ export default function CodeTabsComponent({
/> />
</div> </div>
) : node.data.node.template[ ) : node.data.node.template[
templateName templateField
].type === "file" ? ( ].type === "file" ? (
<ShadTooltip <ShadTooltip
content={tweaks.buildContent( content={tweaks.buildContent(
!node.data.node.template[ !node.data.node.template[
templateName templateField
].value || ].value ||
node.data.node.template[ node.data.node.template[
templateName templateField
].value === "" ].value === ""
? "" ? ""
: node.data.node.template[ : node.data.node.template[
templateName templateField
].value ].value
)} )}
> >
@ -459,7 +459,7 @@ export default function CodeTabsComponent({
disabled={false} disabled={false}
value={ value={
node.data.node.template[ node.data.node.template[
templateName templateField
].value ?? "" ].value ?? ""
} }
onChange={( onChange={(
@ -467,26 +467,26 @@ export default function CodeTabsComponent({
) => {}} ) => {}}
fileTypes={ fileTypes={
node.data.node.template[ node.data.node.template[
templateName templateField
].fileTypes ].fileTypes
} }
suffixes={ suffixes={
node.data.node.template[ node.data.node.template[
templateName templateField
].suffixes ].suffixes
} }
onFileChange={( onFileChange={(
value: any value: any
) => { ) => {
node.data.node.template[ node.data.node.template[
templateName templateField
].file_path = value; ].file_path = value;
}} }}
></InputFileComponent> ></InputFileComponent>
</div> </div>
</ShadTooltip> </ShadTooltip>
) : node.data.node.template[ ) : node.data.node.template[
templateName templateField
].type === "float" ? ( ].type === "float" ? (
<div className="mx-auto"> <div className="mx-auto">
<FloatComponent <FloatComponent
@ -494,14 +494,14 @@ export default function CodeTabsComponent({
editNode={true} editNode={true}
value={ value={
!node.data.node.template[ !node.data.node.template[
templateName templateField
].value || ].value ||
node.data.node.template[ node.data.node.template[
templateName templateField
].value === "" ].value === ""
? "" ? ""
: node.data.node.template[ : node.data.node.template[
templateName templateField
].value ].value
} }
onChange={(target) => { onChange={(target) => {
@ -511,7 +511,7 @@ export default function CodeTabsComponent({
newInputList[ newInputList[
index index
].data.node.template[ ].data.node.template[
templateName templateField
].value = target; ].value = target;
return newInputList; return newInputList;
}); });
@ -519,17 +519,17 @@ export default function CodeTabsComponent({
node["data"]["id"], node["data"]["id"],
target, target,
node.data.node.template[ node.data.node.template[
templateName templateField
] ]
); );
}} }}
/> />
</div> </div>
) : node.data.node.template[ ) : node.data.node.template[
templateName templateField
].type === "str" && ].type === "str" &&
node.data.node.template[ node.data.node.template[
templateName templateField
].options ? ( ].options ? (
<div className="mx-auto"> <div className="mx-auto">
<Dropdown <Dropdown
@ -537,7 +537,7 @@ export default function CodeTabsComponent({
apiModal={true} apiModal={true}
options={ options={
node.data.node.template[ node.data.node.template[
templateName templateField
].options ].options
} }
onSelect={(target) => { onSelect={(target) => {
@ -547,7 +547,7 @@ export default function CodeTabsComponent({
newInputList[ newInputList[
index index
].data.node.template[ ].data.node.template[
templateName templateField
].value = target; ].value = target;
return newInputList; return newInputList;
}); });
@ -555,26 +555,26 @@ export default function CodeTabsComponent({
node["data"]["id"], node["data"]["id"],
target, target,
node.data.node.template[ node.data.node.template[
templateName templateField
] ]
); );
}} }}
value={ value={
!node.data.node.template[ !node.data.node.template[
templateName templateField
].value || ].value ||
node.data.node.template[ node.data.node.template[
templateName templateField
].value === "" ].value === ""
? "" ? ""
: node.data.node.template[ : node.data.node.template[
templateName templateField
].value ].value
} }
></Dropdown> ></Dropdown>
</div> </div>
) : node.data.node.template[ ) : node.data.node.template[
templateName templateField
].type === "int" ? ( ].type === "int" ? (
<div className="mx-auto"> <div className="mx-auto">
<IntComponent <IntComponent
@ -582,14 +582,14 @@ export default function CodeTabsComponent({
editNode={true} editNode={true}
value={ value={
!node.data.node.template[ !node.data.node.template[
templateName templateField
].value || ].value ||
node.data.node.template[ node.data.node.template[
templateName templateField
].value === "" ].value === ""
? "" ? ""
: node.data.node.template[ : node.data.node.template[
templateName templateField
].value ].value
} }
onChange={(target) => { onChange={(target) => {
@ -599,7 +599,7 @@ export default function CodeTabsComponent({
newInputList[ newInputList[
index index
].data.node.template[ ].data.node.template[
templateName templateField
].value = target; ].value = target;
return newInputList; return newInputList;
}); });
@ -607,26 +607,26 @@ export default function CodeTabsComponent({
node["data"]["id"], node["data"]["id"],
target, target,
node.data.node.template[ node.data.node.template[
templateName templateField
] ]
); );
}} }}
/> />
</div> </div>
) : node.data.node.template[ ) : node.data.node.template[
templateName templateField
].type === "prompt" ? ( ].type === "prompt" ? (
<ShadTooltip <ShadTooltip
content={tweaks.buildContent( content={tweaks.buildContent(
!node.data.node.template[ !node.data.node.template[
templateName templateField
].value || ].value ||
node.data.node.template[ node.data.node.template[
templateName templateField
].value === "" ].value === ""
? "" ? ""
: node.data.node.template[ : node.data.node.template[
templateName templateField
].value ].value
)} )}
> >
@ -636,15 +636,15 @@ export default function CodeTabsComponent({
disabled={false} disabled={false}
value={ value={
!node.data.node.template[ !node.data.node.template[
templateName templateField
].value || ].value ||
node.data.node.template[ node.data.node.template[
templateName templateField
].value === "" ].value === ""
? "" ? ""
: node.data.node : node.data.node
.template[ .template[
templateName templateField
].value ].value
} }
onChange={(target) => { onChange={(target) => {
@ -654,7 +654,7 @@ export default function CodeTabsComponent({
newInputList[ newInputList[
index index
].data.node.template[ ].data.node.template[
templateName templateField
].value = target; ].value = target;
return newInputList; return newInputList;
}); });
@ -662,7 +662,7 @@ export default function CodeTabsComponent({
node["data"]["id"], node["data"]["id"],
target, target,
node.data.node.template[ node.data.node.template[
templateName templateField
] ]
); );
}} }}
@ -670,17 +670,17 @@ export default function CodeTabsComponent({
</div> </div>
</ShadTooltip> </ShadTooltip>
) : node.data.node.template[ ) : node.data.node.template[
templateName templateField
].type === "code" ? ( ].type === "code" ? (
<ShadTooltip <ShadTooltip
content={tweaks.buildContent( content={tweaks.buildContent(
tweaks.getValue( tweaks.getValue(
node.data.node.template[ node.data.node.template[
templateName templateField
].value, ].value,
node.data, node.data,
node.data.node.template[ node.data.node.template[
templateName templateField
] ]
) )
)} )}
@ -691,15 +691,15 @@ export default function CodeTabsComponent({
editNode={true} editNode={true}
value={ value={
!node.data.node.template[ !node.data.node.template[
templateName templateField
].value || ].value ||
node.data.node.template[ node.data.node.template[
templateName templateField
].value === "" ].value === ""
? "" ? ""
: node.data.node : node.data.node
.template[ .template[
templateName templateField
].value ].value
} }
onChange={(target) => { onChange={(target) => {
@ -709,7 +709,7 @@ export default function CodeTabsComponent({
newInputList[ newInputList[
index index
].data.node.template[ ].data.node.template[
templateName templateField
].value = target; ].value = target;
return newInputList; return newInputList;
}); });
@ -717,7 +717,7 @@ export default function CodeTabsComponent({
node["data"]["id"], node["data"]["id"],
target, target,
node.data.node.template[ node.data.node.template[
templateName templateField
] ]
); );
}} }}
@ -725,7 +725,7 @@ export default function CodeTabsComponent({
</div> </div>
</ShadTooltip> </ShadTooltip>
) : node.data.node.template[ ) : node.data.node.template[
templateName templateField
].type === "Any" ? ( ].type === "Any" ? (
"-" "-"
) : ( ) : (

View file

@ -184,16 +184,16 @@ const ApiModal = forwardRef(
flow["data"]["nodes"].forEach((node) => { flow["data"]["nodes"].forEach((node) => {
Object.keys(node["data"]["node"]["template"]) Object.keys(node["data"]["node"]["template"])
.filter( .filter(
(templateName) => (templateField) =>
templateName.charAt(0) !== "_" && templateField.charAt(0) !== "_" &&
node.data.node.template[templateName].show && node.data.node.template[templateField].show &&
(node.data.node.template[templateName].type === "str" || (node.data.node.template[templateField].type === "str" ||
node.data.node.template[templateName].type === "bool" || node.data.node.template[templateField].type === "bool" ||
node.data.node.template[templateName].type === "float" || node.data.node.template[templateField].type === "float" ||
node.data.node.template[templateName].type === "code" || node.data.node.template[templateField].type === "code" ||
node.data.node.template[templateName].type === "prompt" || node.data.node.template[templateField].type === "prompt" ||
node.data.node.template[templateName].type === "file" || node.data.node.template[templateField].type === "file" ||
node.data.node.template[templateName].type === "int") node.data.node.template[templateField].type === "int")
) )
.map((n, i) => { .map((n, i) => {
arrNodesWithValues.push(node["id"]); arrNodesWithValues.push(node["id"]);

View file

@ -9,17 +9,17 @@ import { classNames } from "../../../../utils/utils";
export default function NodeToolbarComponent({ data, setData, deleteNode }) { export default function NodeToolbarComponent({ data, setData, deleteNode }) {
const [nodeLength, setNodeLength] = useState( const [nodeLength, setNodeLength] = useState(
Object.keys(data.node.template).filter( Object.keys(data.node.template).filter(
(templateName) => (templateField) =>
templateName.charAt(0) !== "_" && templateField.charAt(0) !== "_" &&
data.node.template[templateName].show && data.node.template[templateField].show &&
(data.node.template[templateName].type === "str" || (data.node.template[templateField].type === "str" ||
data.node.template[templateName].type === "bool" || data.node.template[templateField].type === "bool" ||
data.node.template[templateName].type === "float" || data.node.template[templateField].type === "float" ||
data.node.template[templateName].type === "code" || data.node.template[templateField].type === "code" ||
data.node.template[templateName].type === "prompt" || data.node.template[templateField].type === "prompt" ||
data.node.template[templateName].type === "file" || data.node.template[templateField].type === "file" ||
data.node.template[templateName].type === "Any" || data.node.template[templateField].type === "Any" ||
data.node.template[templateName].type === "int") data.node.template[templateField].type === "int")
).length ).length
); );