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

Format code

Browse source
This commit is contained in:
igorrCarvalho 2024-03-01 16:10:31 -03:00
commit 787bc5111a
19 changed files with 204 additions and 399 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -18,11 +18,9 @@ import { getHealth } from "./controllers/API";
import Router from "./routes";
import useAlertStore from "./stores/alertStore";
import { useDarkStore } from "./stores/darkStore";
import useFlowStore from "./stores/flowStore";
import useFlowsManagerStore from "./stores/flowsManagerStore";
import { useStoreStore } from "./stores/storeStore";
import { useTypesStore } from "./stores/typesStore";
import { useShortcutsStore } from "./stores/shortcuts";
export default function App() {
const removeFromTempNotificationList = useAlertStore(

4
src/frontend/src/components/CrashErrorComponent/index.tsx
View file

@ -26,7 +26,7 @@ export default function CrashErrorComponent({
<CardContent className="grid">
<div>
<p>
Please report errors with detailed tracebacks on the{" "}
Please report errors with detailed tracebacks on the{" "}
<a
href="https://github.com/logspace-ai/langflow/issues"
target="_blank"
@ -37,7 +37,7 @@ export default function CrashErrorComponent({
</a>{" "}
page.
<br></br>
Thank you!
Thank you!
</p>
</div>
</CardContent>

20
src/frontend/src/components/headerComponent/components/menuBar/index.tsx
View file

@ -1,4 +1,4 @@
import { useEffect, useState } from "react";
import { useState } from "react";
import {
DropdownMenu,
DropdownMenuContent,
@ -8,7 +8,7 @@ import {
} from "../../../ui/dropdown-menu";
import { useNavigate } from "react-router-dom";
import { Node, useEdges } from "reactflow";
import { Node } from "reactflow";
import { savedHover } from "../../../../constants/constants";
import FlowSettingsModal from "../../../../modals/flowSettingsModal";
import useAlertStore from "../../../../stores/alertStore";
@ -110,10 +110,10 @@ export const MenuBar = ({
<IconComponent name="Undo" className="header-menu-options " />
Undo
<IconComponent
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.4em]">Z</span>
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.4em]">Z</span>
</DropdownMenuItem>
<DropdownMenuItem
onClick={() => {
@ -124,10 +124,10 @@ export const MenuBar = ({
<IconComponent name="Redo" className="header-menu-options " />
Redo
<IconComponent
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.4em]">Y</span>
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.4em]">Y</span>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>

2
src/frontend/src/modals/codeAreaModal/index.tsx
View file

@ -50,7 +50,6 @@ export default function CodeAreaModal({
} | null>(null);
const [open, setOpen] = useState(false);
const nodes = useFlowStore((state) => state.nodes);
useEffect(() => {
// if nodeClass.template has more fields other than code and dynamic is true
@ -147,7 +146,6 @@ export default function CodeAreaModal({
};
}, [error, setHeight]);
useEffect(() => {
setCode(value);
}, [value, open]);

2
src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
View file

@ -488,4 +488,4 @@ export default function Page({
</main>
</div>
);
}
}

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

@ -24,7 +24,6 @@ import {
createFlowComponent,
downloadNode,
expandGroupNode,
unselectAllNodes,
updateFlowPosition,
} from "../../../../utils/reactflowUtils";
import { classNames, cn } from "../../../../utils/utils";
@ -69,7 +68,7 @@ export default function NodeToolbarComponent({
const edges = useFlowStore((state) => state.edges);
const setNodes = useFlowStore((state) => state.setNodes);
const setEdges = useFlowStore((state) => state.setEdges);
const unselectAll = useFlowStore(state => state.unselectAll);
const unselectAll = useFlowStore((state) => state.unselectAll);
const saveComponent = useFlowsManagerStore((state) => state.saveComponent);
const flows = useFlowsManagerStore((state) => state.flows);
const version = useDarkStore((state) => state.version);
@ -210,7 +209,8 @@ export default function NodeToolbarComponent({
useEffect(() => {
function onKeyDown(event: KeyboardEvent) {
if (
(selected && isGroup) &&
selected &&
isGroup &&
(event.ctrlKey || event.metaKey) &&
event.key === "u"
) {
@ -234,10 +234,11 @@ export default function NodeToolbarComponent({
event.key === "S"
) {
event.preventDefault();
setShowconfirmShare(state => !state);
setShowconfirmShare((state) => !state);
}
if (
(selected && isMinimal) &&
selected &&
isMinimal &&
(event.ctrlKey || event.metaKey) &&
event.key === "q"
) {
@ -252,15 +253,16 @@ export default function NodeToolbarComponent({
event.key === "C"
) {
event.preventDefault();
setOpenModal(state => !state);
setOpenModal((state) => !state);
}
if (
(selected && !isGroup) &&
selected &&
!isGroup &&
(event.ctrlKey || event.metaKey) &&
event.key === "e"
) {
event.preventDefault();
setShowModalAdvanced(state => !state);
setShowModalAdvanced((state) => !state);
}
if (
selected &&
@ -269,7 +271,7 @@ export default function NodeToolbarComponent({
isSaved
) {
event.preventDefault();
return setShowOverrideModal(state => !state);
return setShowOverrideModal((state) => !state);
}
if (
selected &&
@ -279,10 +281,11 @@ export default function NodeToolbarComponent({
) {
event.preventDefault();
saveComponent(cloneDeep(data), false);
unselectAll()
unselectAll();
}
if (
(selected && data.node?.documentation) &&
selected &&
data.node?.documentation &&
(event.ctrlKey || event.metaKey) &&
event.shiftKey &&
event.key === "D"
@ -296,8 +299,8 @@ export default function NodeToolbarComponent({
return () => {
document.removeEventListener("keydown", onKeyDown);
}
}, [])
};
}, []);
return (
<>
@ -313,7 +316,7 @@ export default function NodeToolbarComponent({
data-testid="code-button-modal"
>
<div className="hidden">
<CodeAreaComponent
<CodeAreaComponent
openModal={openModal}
setOpenModal={setOpenModal}
readonly={
@ -329,7 +332,7 @@ export default function NodeToolbarComponent({
onChange={handleOnNewValue}
id={"code-input-node-toolbar-" + name}
selected={selected}
/>
/>
</div>
<IconComponent name="TerminalSquare" className="h-4 w-4" />
</button>
@ -430,50 +433,50 @@ export default function NodeToolbarComponent({
{nodeLength > 0 && (
<SelectItem value={nodeLength === 0 ? "disabled" : "advanced"}>
<div className="flex">
<IconComponent
name="Settings2"
className="relative top-0.5 mr-2 h-4 w-4 "
/>{" "}
<span className="">Edit</span>{" "}
<IconComponent
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.46em]">E</span>
</div>
<IconComponent
name="Settings2"
className="relative top-0.5 mr-2 h-4 w-4 "
/>{" "}
<span className="">Edit</span>{" "}
<IconComponent
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.46em]">E</span>
</div>
</SelectItem>
)}
{isSaved ? (
<SelectItem value={"override"}>
<div className="flex">
<IconComponent
name="SaveAll"
className="relative top-0.5 mr-2 h-4 w-4 "
/>{" "}
<span className="">Save</span>{" "}
<IconComponent
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.45em]">S</span>
</div>
<IconComponent
name="SaveAll"
className="relative top-0.5 mr-2 h-4 w-4 "
/>{" "}
<span className="">Save</span>{" "}
<IconComponent
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.45em]">S</span>
</div>
</SelectItem>
) : (
hasCode && (
<SelectItem value={"SaveAll"}>
<div className="flex">
<IconComponent
name="Settings2"
className="relative top-0.5 mr-2 h-4 w-4 "
/>{" "}
<span className="">Save</span>{" "}
<IconComponent
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.46em]">S</span>
</div>
<IconComponent
name="Settings2"
className="relative top-0.5 mr-2 h-4 w-4 "
/>{" "}
<span className="">Save</span>{" "}
<IconComponent
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.46em]">S</span>
</div>
</SelectItem>
)
)}
@ -503,14 +506,14 @@ export default function NodeToolbarComponent({
/>{" "}
Share{" "}
<IconComponent
name="Command"
className="absolute right-[2rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<IconComponent
name="ArrowBigUp"
className="absolute right-[1.09rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.45em]">S</span>
name="Command"
className="absolute right-[2rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<IconComponent
name="ArrowBigUp"
className="absolute right-[1.09rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.45em]">S</span>
</div>{" "}
</SelectItem>
)}
@ -549,33 +552,33 @@ export default function NodeToolbarComponent({
{isMinimal && (
<SelectItem value={"show"}>
<div className="flex">
<IconComponent
<IconComponent
name={showNode ? "Minimize2" : "Maximize2"}
className="relative top-0.5 mr-2 h-4 w-4"
/>
{showNode ? "Minimize" : "Expand"}
<IconComponent
name="Command"
className="absolute right-[1.25rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.46em]">Q</span>
</div>
<IconComponent
name="Command"
className="absolute right-[1.25rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.46em]">Q</span>
</div>
</SelectItem>
)}
{isGroup && (
<SelectItem value="ungroup">
<div className="flex">
<IconComponent
name="Ungroup"
className="relative top-0.5 mr-2 h-4 w-4 "
/>{" "}
<span className="">Ungroup</span>{" "}
<IconComponent
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.43em]">U</span>
</div>
<IconComponent
name="Ungroup"
className="relative top-0.5 mr-2 h-4 w-4 "
/>{" "}
<span className="">Ungroup</span>{" "}
<IconComponent
name="Command"
className="absolute right-[1.15rem] top-[0.65em] h-3.5 w-3.5 stroke-2"
></IconComponent>
<span className="absolute right-2 top-[0.43em]">U</span>
</div>
</SelectItem>
)}

12
src/frontend/src/stores/flowStore.ts
View file

@ -219,8 +219,16 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
);
},
paste: (selection, position) => {
if(selection.nodes.some((node) => node.data.type === "ChatInput") && checkChatInput(get().nodes)){
useAlertStore.getState().setErrorData({title: "Error pasting components", list: ["You can only have one ChatInput component in the flow"]});
if (
selection.nodes.some((node) => node.data.type === "ChatInput") &&
checkChatInput(get().nodes)
) {
useAlertStore
.getState()
.setErrorData({
title: "Error pasting components",
list: ["You can only have one ChatInput component in the flow"],
});
return;
}
let minimumX = Infinity;

22
src/frontend/src/stores/shortcuts.ts
View file

@ -2,14 +2,14 @@ import { create } from "zustand";
import { shortcutsStoreType } from "../types/store";
export const useShortcutsStore = create<shortcutsStoreType>((set, get) => ({
openCodeModalWShortcut: false,
handleModalWShortcut: (modal) => {
switch (modal) {
case "code":
set({
openCodeModalWShortcut: !get().openCodeModalWShortcut,
});
break;
}
},
}));
openCodeModalWShortcut: false,
handleModalWShortcut: (modal) => {
switch (modal) {
case "code":
set({
openCodeModalWShortcut: !get().openCodeModalWShortcut,
});
break;
}
},
}));

2
src/frontend/src/types/store/index.ts
View file

@ -22,4 +22,4 @@ export type StoreComponentResponse = {
export type shortcutsStoreType = {
openCodeModalWShortcut: boolean;
handleModalWShortcut: (str: string) => void;
};
};

14
src/frontend/src/utils/buildUtils.ts
View file

@ -85,14 +85,12 @@ export async function updateVerticesOrder(
}
const verticesIds = verticesLayers.flat();
useFlowStore
.getState()
.updateVerticesBuild({
verticesLayers,
verticesIds,
verticesOrder,
runId,
});
useFlowStore.getState().updateVerticesBuild({
verticesLayers,
verticesIds,
verticesOrder,
runId,
});
resolve({ verticesLayers, verticesIds, verticesOrder, runId });
});
}