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

Formatting

Browse source
This commit is contained in:
Cristhian Zanforlin Lousa 2023-06-08 12:09:45 -03:00
commit 3b147c879d
4 changed files with 72 additions and 86 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/frontend/src/App.tsx
View file

@ -134,8 +134,9 @@ export default function App() {
</div> </div>
</ErrorBoundary> </ErrorBoundary>
<div></div> <div></div>
<div className="flex flex-col-reverse fixed bottom-5 left-5" <div
style={{zIndex: 999}} className="flex flex-col-reverse fixed bottom-5 left-5"
style={{ zIndex: 999 }}
> >
{alertsList.map((alert) => ( {alertsList.map((alert) => (
<div key={alert.id}> <div key={alert.id}>

128
src/frontend/src/CustomNodes/GenericNode/index.tsx
View file

@ -102,45 +102,43 @@ export default function GenericNode({
} }
return ( return (
<> <>
<NodeToolbar> <NodeToolbar>
<NodeToolbarComponent <NodeToolbarComponent
data={data} data={data}
openPopUp={openPopUp} openPopUp={openPopUp}
deleteNode={deleteNode} deleteNode={deleteNode}
></NodeToolbarComponent> ></NodeToolbarComponent>
</NodeToolbar> </NodeToolbar>
<div <div
className={classNames( className={classNames(
selected ? "border border-blue-500" : "border dark:border-gray-700", selected ? "border border-blue-500" : "border dark:border-gray-700",
"prompt-node relative flex w-96 flex-col justify-center rounded-lg bg-white dark:bg-gray-900" "prompt-node relative flex w-96 flex-col justify-center rounded-lg bg-white dark:bg-gray-900"
)} )}
> >
<div className="flex w-full items-center justify-between gap-8 rounded-t-lg border-b bg-gray-50 p-4 dark:border-b-gray-700 dark:bg-gray-800 dark:text-white "> <div className="flex w-full items-center justify-between gap-8 rounded-t-lg border-b bg-gray-50 p-4 dark:border-b-gray-700 dark:bg-gray-800 dark:text-white ">
<div className="flex w-full items-center gap-2 truncate text-lg"> <div className="flex w-full items-center gap-2 truncate text-lg">
<Icon <Icon
className="h-10 w-10 rounded p-1" className="h-10 w-10 rounded p-1"
style={{ style={{
color: nodeColors[types[data.type]] ?? nodeColors.unknown, color: nodeColors[types[data.type]] ?? nodeColors.unknown,
}} }}
/> />
<div className="ml-2 truncate"> <div className="ml-2 truncate">
<ShadTooltip delayDuration={1500} content={data.type}> <ShadTooltip delayDuration={1500} content={data.type}>
<div className="ml-2 truncate">{data.type}</div> <div className="ml-2 truncate">{data.type}</div>
</ShadTooltip> </ShadTooltip>
</div>
</div> </div>
</div> <div className="flex gap-3">
<div className="flex gap-3"> <button
<button className="relative"
className="relative" onClick={(event) => {
onClick={(event) => { event.preventDefault();
event.preventDefault(); openPopUp(<NodeModal data={data} />);
openPopUp(<NodeModal data={data} />); }}
}} ></button>
>
</button>
</div> </div>
<div className="flex gap-3"> <div className="flex gap-3">
<div> <div>
@ -222,25 +220,25 @@ export default function GenericNode({
{data.node.template[t].show && {data.node.template[t].show &&
!data.node.template[t].advanced ? ( !data.node.template[t].advanced ? (
<ParameterComponent <ParameterComponent
data={data} data={data}
color={ color={
nodeColors[types[data.node.template[t].type]] ?? nodeColors[types[data.node.template[t].type]] ??
nodeColors.unknown nodeColors.unknown
} }
title={ title={
data.node.template[t].display_name data.node.template[t].display_name
? data.node.template[t].display_name ? data.node.template[t].display_name
: data.node.template[t].name : data.node.template[t].name
? toTitleCase(data.node.template[t].name) ? toTitleCase(data.node.template[t].name)
: toTitleCase(t) : toTitleCase(t)
} }
name={t} name={t}
tooltipTitle={data.node.template[t].type} tooltipTitle={data.node.template[t].type}
required={data.node.template[t].required} required={data.node.template[t].required}
id={data.node.template[t].type + "|" + t + "|" + data.id} id={data.node.template[t].type + "|" + t + "|" + data.id}
left={true} left={true}
type={data.node.template[t].type} type={data.node.template[t].type}
/> />
) : ( ) : (
<></> <></>
)} )}
@ -257,15 +255,15 @@ export default function GenericNode({
{/* <div className="px-5 py-2 mt-2 dark:text-white text-center"> {/* <div className="px-5 py-2 mt-2 dark:text-white text-center">
Output Output
</div> */} </div> */}
<ParameterComponent <ParameterComponent
data={data} data={data}
color={nodeColors[types[data.type]] ?? nodeColors.unknown} color={nodeColors[types[data.type]] ?? nodeColors.unknown}
title={data.type} title={data.type}
tooltipTitle={`${data.node.base_classes.join("\n")}`} tooltipTitle={`${data.node.base_classes.join("\n")}`}
id={[data.type, data.id, ...data.node.base_classes].join("|")} id={[data.type, data.id, ...data.node.base_classes].join("|")}
type={data.node.base_classes.join("|")} type={data.node.base_classes.join("|")}
left={false} left={false}
/> />
</> </>
</div> </div>
</div> </div>

18
src/frontend/src/index.css
View file

@ -116,18 +116,6 @@
-radius: 0.5rem; -radius: 0.5rem;
} }
@layer base {
* {
@apply border-border;
}
body {
@apply bg-background text-foreground;
font-feature-settings: "rlig" 1, "calt" 1;
}
}
@layer base { @layer base {
* { * {
@apply border-border; @apply border-border;
@ -142,11 +130,7 @@
body { body {
margin: 0; margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
"Ubuntu", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
"Cantarell",
"Fira Sans",
"Droid Sans",
"Helvetica Neue",
sans-serif; sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;

7
src/frontend/src/utils.ts
View file

@ -535,9 +535,12 @@ export function updateTemplate(
if (objectToUpdate[key] && objectToUpdate[key].value) { if (objectToUpdate[key] && objectToUpdate[key].value) {
clonedObject[key].value = objectToUpdate[key].value; clonedObject[key].value = objectToUpdate[key].value;
} }
if(objectToUpdate[key] && objectToUpdate[key].advanced!==null && objectToUpdate[key].advanced!==undefined){ if (
objectToUpdate[key] &&
objectToUpdate[key].advanced !== null &&
objectToUpdate[key].advanced !== undefined
) {
clonedObject[key].advanced = objectToUpdate[key].advanced; clonedObject[key].advanced = objectToUpdate[key].advanced;
} }
} }
return clonedObject; return clonedObject;