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

feat(nodeToolbarComponent): add "Save" option to the select dropdown in the node toolbar component to allow saving changes made to the node

Browse source 
fix(styleUtils): import the "SaveAll" icon from lucide-react to be used in the nodeIconsLucide object
This commit is contained in:
anovazzi1 2023-09-22 14:32:43 -03:00
commit 742ebae878
2 changed files with 49 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

103
src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx
View file

@ -131,67 +131,58 @@ export default function NodeToolbarComponent({
</a> </a>
</ShadTooltip> </ShadTooltip>
{isMinimal ? ( <Select onValueChange={handleSelectChange} value={selectedValue}>
<Select onValueChange={handleSelectChange} value={selectedValue}> <ShadTooltip content="More" side="top">
<ShadTooltip content="More" side="top"> <SelectTrigger>
<SelectTrigger> <div>
<div> <div
<div className={classNames(
className={classNames( "relative -ml-px inline-flex h-8 w-[31px] items-center rounded-r-md bg-background text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10" +
"relative -ml-px inline-flex h-8 w-[31px] items-center rounded-r-md bg-background text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10" + (nodeLength == 0
(nodeLength == 0 ? " text-muted-foreground"
? " text-muted-foreground" : " text-foreground")
: " text-foreground") )}
)} >
> <IconComponent
<IconComponent name="MoreHorizontal"
name="MoreHorizontal" className="relative left-2 h-4 w-4"
className="relative left-2 h-4 w-4" />
/>
</div>
</div> </div>
</SelectTrigger> </div>
</ShadTooltip> </SelectTrigger>
<SelectContent> </ShadTooltip>
<SelectItem value={getRandomKeyByssmm() + "advanced"}> <SelectContent>
<SelectItem value={getRandomKeyByssmm() + "advanced"}>
<div className="flex">
<IconComponent
name="Settings2"
className="relative top-0.5 mr-2 h-4 w-4"
/>{" "}
Edit{" "}
</div>{" "}
</SelectItem>
<SelectItem value={getRandomKeyByssmm() + "advanced"}>
<div className="flex">
<IconComponent
name="SaveAll"
className="relative top-0.5 mr-2 h-4 w-4"
/>{" "}
Save{" "}
</div>{" "}
</SelectItem>
{isMinimal && (
<SelectItem value={getRandomKeyByssmm() + "show"}>
<div className="flex"> <div className="flex">
<IconComponent <IconComponent
name="Settings2" name={showNode ? "Minimize2" : "Maximize2"}
className="relative top-0.5 mr-2 h-4 w-4" className="relative top-0.5 mr-2 h-4 w-4"
/>{" "} />
Edit{" "} {showNode ? "Minimize" : "Expand"}
</div>{" "} </div>
</SelectItem> </SelectItem>
{isMinimal && ( )}
<SelectItem value={getRandomKeyByssmm() + "show"}> </SelectContent>
<div className="flex"> </Select>
<IconComponent
name={showNode ? "Minimize2" : "Maximize2"}
className="relative top-0.5 mr-2 h-4 w-4"
/>
{showNode ? "Minimize" : "Expand"}
</div>
</SelectItem>
)}
</SelectContent>
</Select>
) : (
<ShadTooltip content="Edit" side="top">
<div>
<button
onClick={() => setShowModalAdvanced(true)}
className={classNames(
"relative -ml-px inline-flex items-center rounded-r-md bg-background px-2 py-2 text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10" +
(nodeLength == 0
? " text-muted-foreground"
: " text-foreground")
)}
>
<IconComponent name="Settings2" className="h-4 w-4 " />
</button>
</div>
</ShadTooltip>
)}
{showModalAdvanced && ( {showModalAdvanced && (
<EditNodeModal <EditNodeModal

2
src/frontend/src/utils/styleUtils.ts
View file

@ -60,6 +60,7 @@ import {
Redo, Redo,
Rocket, Rocket,
Save, Save,
SaveAll,
Scissors, Scissors,
Search, Search,
Settings2, Settings2,
@ -318,4 +319,5 @@ export const nodeIconsLucide: iconsType = {
Square, Square,
Minimize2, Minimize2,
Maximize2, Maximize2,
SaveAll,
}; };