fix(GenericNode/index.tsx): fix initial state of inputName to be false instead of true for better user experience
refactor(GenericNode/index.tsx): refactor tooltip div structure to improve readability and add pencil icon if node has flow refactor(GenericNode/index.tsx): refactor color logic to use typesContext instead of accessing types directly refactor(GenericNode/index.tsx): refactor output type title logic to use ternary operator for better readability refactor(GenericNode/index.tsx): refactor validation status params rendering to use ternary operator for better readability refactor(GenericNode/index.tsx): refactor generic node description rendering to use ternary operator for better readability refactor(GenericNode/index.tsx): refactor template field rendering to use ternary operator for better readability refactor(PageComponent/index.tsx): remove unnecessary empty line
This commit is contained in:
parent
2c6962b86d
commit
2438a8c658
2 changed files with 23 additions and 21 deletions
|
|
@ -38,7 +38,7 @@ export default function GenericNode({
|
|||
const { types, deleteNode, reactFlowInstance, setFilterEdge, getFilterEdge } =
|
||||
useContext(typesContext);
|
||||
const name = nodeIconsLucide[data.type] ? data.type : types[data.type];
|
||||
const [inputName, setInputName] = useState(true);
|
||||
const [inputName, setInputName] = useState(false);
|
||||
const [nodeName, setNodeName] = useState(data.node!.display_name);
|
||||
const [inputDescription, setInputDescription] = useState(false);
|
||||
const [nodeDescription, setNodeDescription] = useState(
|
||||
|
|
@ -198,11 +198,14 @@ export default function GenericNode({
|
|||
</div>
|
||||
) : (
|
||||
<ShadTooltip content={data.node?.display_name}>
|
||||
<div
|
||||
className="generic-node-tooltip-div text-primary"
|
||||
onDoubleClick={() => setInputName(true)}
|
||||
>
|
||||
{data.node?.display_name}
|
||||
<div className="flex" onDoubleClick={() => setInputName(true)}>
|
||||
<div
|
||||
className="generic-node-tooltip-div text-primary pr-3"
|
||||
|
||||
>
|
||||
{data.node?.display_name}
|
||||
</div>
|
||||
{data.node?.flow&& <IconComponent name="Pencil" className="w-5 h-5 text-primary-content" />}
|
||||
</div>
|
||||
</ShadTooltip>
|
||||
)}
|
||||
|
|
@ -232,10 +235,10 @@ export default function GenericNode({
|
|||
setData={setData}
|
||||
color={
|
||||
nodeColors[
|
||||
types[data.node?.template[templateField].type!]
|
||||
types[data.node?.template[templateField].type!]
|
||||
] ??
|
||||
nodeColors[
|
||||
data.node?.template[templateField].type!
|
||||
data.node?.template[templateField].type!
|
||||
] ??
|
||||
nodeColors.unknown
|
||||
}
|
||||
|
|
@ -282,7 +285,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
|
||||
}
|
||||
|
|
@ -320,10 +323,10 @@ export default function GenericNode({
|
|||
<div className="max-h-96 overflow-auto">
|
||||
{typeof validationStatus.params === "string"
|
||||
? validationStatus.params
|
||||
.split("\n")
|
||||
.map((line: string, index: number) => (
|
||||
<div key={index}>{line}</div>
|
||||
))
|
||||
.split("\n")
|
||||
.map((line: string, index: number) => (
|
||||
<div key={index}>{line}</div>
|
||||
))
|
||||
: ""}
|
||||
</div>
|
||||
)
|
||||
|
|
@ -367,14 +370,14 @@ export default function GenericNode({
|
|||
className={
|
||||
showNode
|
||||
? "generic-node-desc " +
|
||||
(data.node?.description !== "" ? "py-5" : "pb-5")
|
||||
(data.node?.description !== "" ? "py-5" : "pb-5")
|
||||
: ""
|
||||
}
|
||||
>
|
||||
{data.node?.description !== "" &&
|
||||
showNode &&
|
||||
data.node?.flow &&
|
||||
inputDescription ? (
|
||||
showNode &&
|
||||
data.node?.flow &&
|
||||
inputDescription ? (
|
||||
<Textarea
|
||||
autoFocus
|
||||
onBlur={() => {
|
||||
|
|
@ -429,7 +432,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({
|
||||
|
|
@ -444,10 +447,10 @@ export default function GenericNode({
|
|||
setData={setData}
|
||||
color={
|
||||
nodeColors[
|
||||
types[data.node?.template[templateField].type!]
|
||||
types[data.node?.template[templateField].type!]
|
||||
] ??
|
||||
nodeColors[
|
||||
data.node?.template[templateField].type!
|
||||
data.node?.template[templateField].type!
|
||||
] ??
|
||||
nodeColors.unknown
|
||||
}
|
||||
|
|
|
|||
|
|
@ -145,7 +145,6 @@ export default function Page({
|
|||
document.removeEventListener("mousemove", handleMouseMove);
|
||||
};
|
||||
}, [position, lastCopiedSelection, lastSelection]);
|
||||
|
||||
const [selectionMenuVisible, setSelectionMenuVisible] = useState(false);
|
||||
|
||||
const { setExtraComponent, setExtraNavigation } = useContext(locationContext);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue