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

Refactor: Add header to node tooltips

Browse source
This commit is contained in:
igorrCarvalho 2023-09-11 15:50:18 -03:00
commit c18536d1ff
1 changed files with 42 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -118,45 +118,54 @@ export default function ParameterComponent({
nodeIconsLucide[item.family] ?? nodeIconsLucide["unknown"]; nodeIconsLucide[item.family] ?? nodeIconsLucide["unknown"];
return ( return (
<span <>
key={index} {index === 0 && (
className={classNames( <span>
index > 0 ? "mt-2 flex items-center" : "flex items-center" {left ? "Components to connect into:" : "Components to connect to:"}
)} </span>
> )
<div }
className="h-5 w-5" <span
style={{ key={index}
color: nodeColors[item.family], className={classNames(
}} index > 0 ? "mt-2 flex items-center" : "mt-3 flex items-center"
> )}
<Icon >
<div
className="h-5 w-5" className="h-5 w-5"
strokeWidth={1.5}
style={{ style={{
color: nodeColors[item.family] ?? nodeColors.unknown, color: nodeColors[item.family],
}} }}
/> >
</div> <Icon
<span className="ps-2 text-xs text-foreground"> className="h-5 w-5"
{nodeNames[item.family] ?? "Other"} strokeWidth={1.5}
<span className="text-xs"> style={{
color: nodeColors[item.family] ?? nodeColors.unknown,
}}
/>
</div>
<span className="ps-2 text-xs text-foreground">
{nodeNames[item.family] ?? "Other"}
{" "} {" "}
{item.type === "" ? "" : " - "} <span className="text-xs">
{item.type.split(", ").length > 2 {" "}
? item.type.split(", ").map((el, index) => ( {item.type === "" ? "" : " - "}
<React.Fragment key={el + index}> {item.type.split(", ").length > 2
<span> ? item.type.split(", ").map((el, index) => (
{index === item.type.split(", ").length - 1 <React.Fragment key={el + index}>
? el <span>
: (el += `, `)} {index === item.type.split(", ").length - 1
</span> ? el
</React.Fragment> : (el += `, `)}
)) </span>
: item.type} </React.Fragment>
))
: item.type}
</span>
</span> </span>
</span> </span>
</span> </>
); );
}); });
} else { } else {