Refactor GenericNode component
This commit is contained in:
parent
46e5b8b7e3
commit
c917eeec4a
1 changed files with 52 additions and 36 deletions
|
|
@ -138,9 +138,8 @@ export default function GenericNode({
|
|||
const iconColor = nodeColors[types[data.type]];
|
||||
const iconName =
|
||||
iconElement || (data.node?.flow ? "group_components" : name);
|
||||
const iconClassName = `generic-node-icon ${
|
||||
!showNode ? " absolute inset-x-6 h-12 w-12 " : ""
|
||||
}`;
|
||||
const iconClassName = `generic-node-icon ${!showNode ? " absolute inset-x-6 h-12 w-12 " : ""
|
||||
}`;
|
||||
if (iconElement && isEmoji) {
|
||||
return nodeIconFragment(iconElement);
|
||||
} else {
|
||||
|
|
@ -268,7 +267,7 @@ export default function GenericNode({
|
|||
numberOfHandles={handles}
|
||||
showNode={showNode}
|
||||
openAdvancedModal={false}
|
||||
onCloseAdvancedModal={() => {}}
|
||||
onCloseAdvancedModal={() => { }}
|
||||
selected={selected}
|
||||
></NodeToolbarComponent>
|
||||
</NodeToolbar>
|
||||
|
|
@ -390,13 +389,28 @@ export default function GenericNode({
|
|||
})}
|
||||
data={data}
|
||||
color={
|
||||
nodeColors[
|
||||
types[data.node?.template[templateField].type!]
|
||||
] ??
|
||||
nodeColors[
|
||||
data.node?.template[templateField].input_types &&
|
||||
data.node?.template[templateField].input_types!
|
||||
.length > 0
|
||||
? nodeColors[
|
||||
data.node?.template[templateField]
|
||||
.input_types![data.node?.template[templateField]
|
||||
.input_types!.length - 1]
|
||||
] ??
|
||||
nodeColors[
|
||||
types[
|
||||
data.node?.template[templateField]
|
||||
.input_types![data.node?.template[templateField]
|
||||
.input_types!.length - 1]
|
||||
]
|
||||
]
|
||||
: nodeColors[
|
||||
data.node?.template[templateField].type!
|
||||
] ??
|
||||
nodeColors.unknown
|
||||
] ??
|
||||
nodeColors[
|
||||
types[data.node?.template[templateField].type!]
|
||||
] ??
|
||||
nodeColors.unknown
|
||||
}
|
||||
title={getFieldTitle(
|
||||
data.node?.template!,
|
||||
|
|
@ -440,7 +454,7 @@ export default function GenericNode({
|
|||
color={nodeColors[types[data.type]] ?? nodeColors.unknown}
|
||||
title={
|
||||
data.node?.output_types &&
|
||||
data.node.output_types.length > 0
|
||||
data.node.output_types.length > 0
|
||||
? data.node.output_types.join(" | ")
|
||||
: data.type
|
||||
}
|
||||
|
|
@ -479,10 +493,10 @@ export default function GenericNode({
|
|||
<div className="max-h-96 overflow-auto">
|
||||
{typeof validationStatus.params === "string"
|
||||
? `${durationString}\n${validationStatus.params}`
|
||||
.split("\n")
|
||||
.map((line, index) => (
|
||||
<div key={index}>{line}</div>
|
||||
))
|
||||
.split("\n")
|
||||
.map((line, index) => (
|
||||
<div key={index}>{line}</div>
|
||||
))
|
||||
: durationString}
|
||||
</div>
|
||||
)
|
||||
|
|
@ -569,7 +583,7 @@ export default function GenericNode({
|
|||
}}
|
||||
>
|
||||
{(data.node?.description === "" || !data.node?.description) &&
|
||||
nameEditable
|
||||
nameEditable
|
||||
? "Double Click to Edit Description"
|
||||
: data.node?.description}
|
||||
</div>
|
||||
|
|
@ -590,7 +604,7 @@ export default function GenericNode({
|
|||
.map((templateField: string, idx) => (
|
||||
<div key={idx}>
|
||||
{data.node!.template[templateField].show &&
|
||||
!data.node!.template[templateField].advanced ? (
|
||||
!data.node!.template[templateField].advanced ? (
|
||||
<ParameterComponent
|
||||
index={idx.toString()}
|
||||
key={scapedJSONStringfy({
|
||||
|
|
@ -604,25 +618,27 @@ export default function GenericNode({
|
|||
data={data}
|
||||
color={
|
||||
data.node?.template[templateField].input_types &&
|
||||
data.node?.template[templateField].input_types!
|
||||
.length > 0
|
||||
data.node?.template[templateField].input_types!
|
||||
.length > 0
|
||||
? nodeColors[
|
||||
data.node?.template[templateField]
|
||||
.input_types![0]
|
||||
] ??
|
||||
nodeColors[
|
||||
types[
|
||||
data.node?.template[templateField]
|
||||
.input_types![0]
|
||||
]
|
||||
]
|
||||
data.node?.template[templateField]
|
||||
.input_types![data.node?.template[templateField]
|
||||
.input_types!.length - 1]
|
||||
] ??
|
||||
nodeColors[
|
||||
types[
|
||||
data.node?.template[templateField]
|
||||
.input_types![data.node?.template[templateField]
|
||||
.input_types!.length - 1]
|
||||
]
|
||||
]
|
||||
: nodeColors[
|
||||
data.node?.template[templateField].type!
|
||||
] ??
|
||||
nodeColors[
|
||||
types[data.node?.template[templateField].type!]
|
||||
] ??
|
||||
nodeColors.unknown
|
||||
data.node?.template[templateField].type!
|
||||
] ??
|
||||
nodeColors[
|
||||
types[data.node?.template[templateField].type!]
|
||||
] ??
|
||||
nodeColors.unknown
|
||||
}
|
||||
title={getFieldTitle(
|
||||
data.node?.template!,
|
||||
|
|
@ -674,9 +690,9 @@ export default function GenericNode({
|
|||
data={data}
|
||||
color={
|
||||
(data.node?.output_types &&
|
||||
data.node.output_types.length > 0
|
||||
data.node.output_types.length > 0
|
||||
? nodeColors[data.node.output_types[0]] ??
|
||||
nodeColors[types[data.node.output_types[0]]]
|
||||
nodeColors[types[data.node.output_types[0]]]
|
||||
: nodeColors[types[data.type]]) ?? nodeColors.unknown
|
||||
}
|
||||
title={
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue