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

🐛 fix(parameterComponent): use strict equality operator (===) instead of loose equality operator (==) for item.type comparison to improve code quality and avoid potential bugs

Browse source 
🐛 fix(parameterComponent): update style prop value in ShadTooltip component to use class names 'tooltip-fixed-width' and 'custom-scroll' for consistent styling and better readability
🐛 fix(parameterComponent): update disabled prop value in TextAreaComponent to use the disabled variable passed as a prop for consistency and better code organization
🐛 fix(AccordionComponent): use strict equality operator (===) instead of loose equality operator (==) for open.length comparison to improve code quality and avoid potential bugs
🐛 fix(codeAreaComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(codeAreaComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(codeAreaComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(codeAreaComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(inputFileComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(inputFileComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(inputFileComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(inputFileComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(intComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(intComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(promptComponent): add missing dependencies to useEffect dependency array to avoid potential bugs and improve code quality
🐛 fix(promptComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(textAreaComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(textAreaComponent): remove unnecessary space in className prop value to improve code readability
🐛 fix(tabsContext): change getTweak initial state from an object to an empty array to match the expected type and avoid potential bugs
🐛 fix(ApiModal): add missing curly braces around the buildTweaks function call to ensure the correct value is pushed to the tweak.current array

🐛 fix(EditNodeModal): remove unnecessary 'save' variable from useContext destructuring
🐛 fix(chatMessage): use strict equality operator (===) instead of loose equality operator (==) for comparison
🐛 fix(chatModal): use strict equality operator (===) instead of loose equality operator (==) for comparison
🐛 fix(codeAreaModal): add 'setCloseEdit' to useContext destructuring and add 'setModalOpen' function
🐛 fix(chatInput): use strict equality operator (===) instead of loose equality operator (==) for comparison
🐛 fix(chatMessage): use strict equality operator (===) instead of loose equality operator (==) for comparison
🐛 fix(formModal): use strict equality operator (===) instead of loose equality operator (==) for comparison
🐛 fix(formModal): use strict equality operator (===) instead of loose equality operator (==) for comparison
🐛 fix(formModal): use strict equality operator (===) instead of loose equality operator (==) for comparison
🐛 fix(formModal): use strict equality operator (===) instead of loose equality operator (==) for comparison
🐛 fix(genericModal): use strict equality operator (===) instead of loose equality operator (==) for comparison
🐛 fix(flow): add missing newline at the end of the file
🐛 fix(tabs): add missing import for TweaksType from flow

🐛 fix(utils.ts): change comparison operator from '==' to '===' for better type safety and strict equality check
This commit is contained in:
Cristhian Zanforlin Lousa 2023-07-10 10:29:09 -03:00
commit 243b59507b
21 changed files with 72 additions and 63 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -122,7 +122,7 @@ export default function ParameterComponent({
{nodeNames[item.family] ?? ""}{" "}
<span className="text-xs">
{" "}
{item.type == "" ? "" : " - "}
{item.type === "" ? "" : " - "}
{item.type.split(", ").length > 2
? item.type.split(", ").map((el, i) => (
<React.Fragment key={el + i}>
@ -176,7 +176,7 @@ export default function ParameterComponent({
<></>
) : (
<ShadTooltip
style="max-w-[30vw] max-h-[20vh] overflow-auto custom-scroll"
style="tooltip-fixed-width custom-scroll"
delayDuration={0}
content={refHtml.current}
side={left ? "left" : "right"}
@ -217,7 +217,7 @@ export default function ParameterComponent({
/>
) : data.node.template[name].multiline ? (
<TextAreaComponent
disabled={false}
disabled={disabled}
value={data.node.template[name].value ?? ""}
onChange={handleOnNewValue}
/>

2
src/frontend/src/components/AccordionComponent/index.tsx
View file

@ -13,7 +13,7 @@ export default function AccordionComponent({
open = [],
}: AccordionComponentType) {
const [value, setValue] = useState(
open.length == 0 ? "" : getOpenAccordion()
open.length === 0 ? "" : getOpenAccordion()
);
function getOpenAccordion() {

15
src/frontend/src/components/codeAreaComponent/index.tsx
View file

@ -27,15 +27,10 @@ export default function CodeAreaComponent({
useEffect(() => {
setMyValue(typeof value == "string" ? value : JSON.stringify(value));
}, [value]);
return (
<div className={disabled ? "cursor-not-allowed" : ""}>
<div
className={
(editNode ? "w-full items-center" : "flex w-full items-center") +
(disabled ? " pointer-events-none" : "")
}
>
<div className={disabled ? "pointer-events-none w-full " : " w-full"}>
<div className="flex w-full items-center">
<span
onClick={() => {
@ -53,9 +48,8 @@ export default function CodeAreaComponent({
}}
className={
editNode
? "input-edit-node input-dialog "
: "input-dialog input-primary " +
(disabled ? "input-disable" : "")
? "input-edit-node"
: "input-primary text-muted-foreground" + (disabled ? " input-disable" : "")
}
>
{myValue !== "" ? myValue : "Type something..."}
@ -87,6 +81,5 @@ export default function CodeAreaComponent({
</button>
</div>
</div>
</div>
);
}

6
src/frontend/src/components/inputFileComponent/index.tsx
View file

@ -98,10 +98,8 @@ export default function InputFileComponent({
onClick={handleButtonClick}
className={
editNode
? " input-edit-node " + " input-dialog "
: (disabled ? " input-disable " : "") +
" input-primary " +
" input-dialog "
? "input-edit-node input-dialog text-muted-foreground"
: (disabled ? "input-disable input-primary input-dialog" : "input-primary input-dialog text-muted-foreground")
}
>
{myValue !== "" ? myValue : "No file"}

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

@ -30,7 +30,7 @@ export default function IntComponent({
<div
className={
"w-full " +
(disabled ? "pointer-events-none w-full cursor-not-allowed" : "w-full")
(disabled ? "pointer-events-none w-full cursor-not-allowed" : "")
}
>
<input
@ -70,7 +70,7 @@ export default function IntComponent({
className={
editNode
? " input-edit-node "
: " input-primary " + (disabled ? " input-disable " : "")
: " input-primary " + (disabled ? " input-disable" : "")
}
placeholder={editNode ? "Integer number" : "Type an integer number"}
onChange={(e) => {

7
src/frontend/src/components/promptComponent/index.tsx
View file

@ -44,7 +44,7 @@ export default function PromptAreaComponent({
})
.catch((error) => {});
}
}, [reactFlowInstance, field_name]);
}, [reactFlowInstance, field_name, myValue, nodeClass, setNodeClass]);
return (
<div className={disabled ? "cursor-not-allowed" : ""}>
@ -69,10 +69,9 @@ export default function PromptAreaComponent({
}}
className={
editNode
? " input-edit-node " + " input-dialog "
? "input-edit-node input-dialog"
: (disabled ? " input-disable " : "") +
" input-primary " +
" input-dialog "
" input-primary input-dialog"
}
>
{myValue !== "" ? myValue : "Type your prompt here"}

10
src/frontend/src/components/textAreaComponent/index.tsx
View file

@ -27,13 +27,8 @@ export default function TextAreaComponent({
}, [closePopUp]);
return (
<div className={disabled ? "cursor-not-allowed" : ""}>
<div
className={
(editNode ? "relative top-2 w-full" : "flex w-full items-center") +
(disabled ? " pointer-events-none" : "")
}
>
<div className={disabled ? "pointer-events-none w-full " : " w-full"}>
<div className="flex w-full items-center">
<input
value={myValue}
className={
@ -46,6 +41,7 @@ export default function TextAreaComponent({
setMyValue(e.target.value);
onChange(e.target.value);
}}
/>
<button

4
src/frontend/src/contexts/tabsContext.tsx
View file

@ -54,7 +54,7 @@ const TabsContextInitialValue: TabsContextType = {
setTabsState: (state: TabsState) => {},
getNodeId: (nodeType: string) => "",
setTweak: (tweak: any) => {},
getTweak: {},
getTweak: [],
paste: (
selection: { nodes: any; edges: any },
position: { x: number; y: number; paneX?: number; paneY?: number }
@ -75,7 +75,7 @@ export function TabsProvider({ children }: { children: ReactNode }) {
const { templates, reactFlowInstance } = useContext(typesContext);
const [lastCopiedSelection, setLastCopiedSelection] = useState(null);
const [tabsState, setTabsState] = useState<TabsState>({});
const [getTweak, setTweak] = useState({});
const [getTweak, setTweak] = useState([]);
const newNodeId = useRef(uid());
function incrementNodeId() {

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

@ -205,6 +205,7 @@ The cursor: default; property value restores the browser's default cursor style
.input-primary {
@apply bg-background block border-ring form-input px-3 placeholder:text-muted-foreground rounded-md shadow-sm sm:text-sm truncate w-full;
}
.input-edit-node{
@apply input-primary placeholder:text-center pt-0.5 pb-0.5 text-center
}
@ -212,7 +213,7 @@ The cursor: default; property value restores the browser's default cursor style
@apply input-primary pr-7 mx-2
}
.input-disable{
@apply bg-input
@apply bg-input text-muted-foreground
}
.input-dialog{
@apply text-ring cursor-pointer bg-transparent
@ -1049,5 +1050,8 @@ The cursor: default; property value restores the browser's default cursor style
@apply relative w-full rounded-md shadow-sm
}
.tooltip-fixed-width{
@apply max-w-[30vw] max-h-[20vh] overflow-auto
}
}

9
src/frontend/src/modals/ApiModal/index.tsx
View file

@ -142,7 +142,8 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
}
function startTweaks() {
tweak?.current?.push(buildTweaks(flow));
const t = buildTweaks(flow);
tweak?.current?.push(t);
}
function filterNodes() {
@ -266,7 +267,7 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
return (
<Dialog open={true} onOpenChange={setModalOpen}>
<DialogTrigger></DialogTrigger>
<DialogContent className="h-[80vh] lg:max-w-[80vw]">
<DialogContent className="h-[80vh] md:max-w-[80vw]">
<DialogHeader>
<DialogTitle className="flex items-center">
<span className="pr-2">Code</span>
@ -382,10 +383,10 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
key={i}
className="h-10 dark:border-b-muted"
>
<TableCell className="p-0 text-center text-sm text-gray-900">
<TableCell className="p-0 text-center text-sm text-foreground">
{n}
</TableCell>
<TableCell className="p-0 text-center text-xs text-gray-900 dark:text-gray-300">
<TableCell className="p-0 text-xs text-foreground">
<div className="m-auto w-[250px]">
{t.data.node.template[n]
.type === "str" &&

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

@ -55,7 +55,7 @@ export default function EditNodeModal({ data }: { data: NodeDataType }) {
const { closePopUp } = useContext(PopUpContext);
const { types } = useContext(typesContext);
const ref = useRef();
const { setTabsState, tabId, save } = useContext(TabsContext);
const { setTabsState, tabId } = useContext(TabsContext);
const { reactFlowInstance } = useContext(typesContext);
let disabled =

2
src/frontend/src/modals/chatModal/chatMessage/index.tsx
View file

@ -86,7 +86,7 @@ export default function ChatMessage({
components={{
code({ node, inline, className, children, ...props }) {
if (children.length) {
if (children[0] == "▍") {
if (children[0] === "▍") {
return (
<span className="chat-message-modal-markdown-span">
▍

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

@ -374,7 +374,7 @@ export default function ChatModal({
<ChatMessage
lockChat={lockChat}
chat={c}
lastMessage={chatHistory.length - 1 == i ? true : false}
lastMessage={chatHistory.length - 1 === i ? true : false}
key={i}
/>
))

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

@ -31,7 +31,7 @@ export default function CodeAreaModal({
const [code, setCode] = useState(value);
const [loading, setLoading] = useState(false);
const { dark } = useContext(darkContext);
const { closePopUp } = useContext(PopUpContext);
const { closePopUp, setCloseEdit } = useContext(PopUpContext);
const { setErrorData, setSuccessData } = useContext(alertContext);
const [error, setError] = useState<{
detail: { error: string; traceback: string };
@ -41,6 +41,13 @@ export default function CodeAreaModal({
setValue(code);
}, [code, setValue]);
function setModalOpen(x: boolean) {
if (x === false) {
setCloseEdit("codearea");
closePopUp();
}
}
function handleClick() {
setLoading(true);
postValidateCode(code)
@ -55,6 +62,7 @@ export default function CodeAreaModal({
});
setValue(code);
setOpen((old) => !old);
setModalOpen(false);
} else {
if (funcErrors.length !== 0) {
setErrorData({

2
src/frontend/src/modals/formModal/chatInput/index.tsx
View file

@ -57,7 +57,7 @@ export default function ChatInput({
<button
className={classNames(
"form-modal-send-button",
chatValue == "" ? "text-primary" : " bg-indigo-600 text-background"
chatValue === "" ? "text-primary" : " bg-indigo-600 text-background"
)}
disabled={lockChat}
onClick={() => sendMessage()}

6
src/frontend/src/modals/formModal/chatMessage/index.tsx
View file

@ -34,13 +34,13 @@ export default function ChatMessage({
{!chat.isSend ? (
<div className="form-modal-chat-image">
<div className="form-modal-chat-bot-icon ">
<img src={Robot} className="form-modal-chat-icon-img" />
<img src={Robot} className="form-modal-chat-icon-img" alt="robot_image"/>
</div>
</div>
) : (
<div className="form-modal-chat-image">
<div className="form-modal-chat-user-icon ">
<img src={MaleTechnology} className="form-modal-chat-icon-img" />
<img src={MaleTechnology} className="form-modal-chat-icon-img" alt="male_technology"/>
</div>
</div>
)}
@ -75,7 +75,7 @@ export default function ChatMessage({
components={{
code({ node, inline, className, children, ...props }) {
if (children.length) {
if (children[0] == "▍") {
if (children[0] === "▍") {
return (
<span className="form-modal-markdown-span">
▍

8
src/frontend/src/modals/formModal/index.tsx
View file

@ -63,12 +63,14 @@ export default function FormModal({
const [chatHistory, setChatHistory] = useState<ChatMessageType[]>([]);
const { reactFlowInstance } = useContext(typesContext);
const { setErrorData, setNoticeData } = useContext(alertContext);
const { setErrorData } = useContext(alertContext);
const ws = useRef<WebSocket | null>(null);
const [lockChat, setLockChat] = useState(false);
const isOpen = useRef(open);
const messagesRef = useRef(null);
const id = useRef(flow.id);
const tabsStateFlowId = tabsState[flow.id];
const tabsStateFlowIdFormKeysData = tabsStateFlowId.formKeysData;
const [chatKey, setChatKey] = useState(
Object.keys(tabsState[flow.id].formKeysData.input_keys).find(
(k) => !tabsState[flow.id].formKeysData.handle_keys.some((j) => j === k)
@ -86,7 +88,7 @@ export default function FormModal({
}, [open]);
useEffect(() => {
id.current = flow.id;
}, [flow.id, tabsState[flow.id], tabsState[flow.id].formKeysData]);
}, [flow.id, tabsStateFlowId, tabsStateFlowIdFormKeysData]);
var isStream = false;
@ -515,7 +517,7 @@ export default function FormModal({
<ChatMessage
lockChat={lockChat}
chat={c}
lastMessage={chatHistory.length - 1 == i ? true : false}
lastMessage={chatHistory.length - 1 === i ? true : false}
key={i}
/>
))

11
src/frontend/src/modals/genericModal/index.tsx
View file

@ -202,13 +202,12 @@ export default function GenericModal({
"flex h-[55vh] w-full"
)}
>
{type == TypeModal.PROMPT && isEdit ? (
{type === TypeModal.PROMPT && isEdit ? (
<Textarea
ref={ref}
className="form-input h-full w-full rounded-lg border-gray-300 custom-scroll focus-visible:ring-1 dark:border-gray-700 dark:bg-gray-900 dark:text-white"
value={inputValue}
onBlur={() => {
blur();
setIsEdit(false);
}}
autoFocus
@ -218,9 +217,9 @@ export default function GenericModal({
}}
placeholder="Type message here."
/>
) : type == TypeModal.PROMPT && !isEdit ? (
) : type === TypeModal.PROMPT && !isEdit ? (
<TextAreaContentView />
) : type != TypeModal.PROMPT ? (
) : type !== TypeModal.PROMPT ? (
<Textarea
ref={ref}
className="form-input h-full w-full rounded-lg border-gray-300 focus-visible:ring-1 dark:border-gray-700 dark:bg-gray-900 dark:text-white"
@ -235,7 +234,7 @@ export default function GenericModal({
)}
</div>
{type == TypeModal.PROMPT && (
{type === TypeModal.PROMPT && (
<>
<div className="sm:6/6 mr-28 mt-3 h-[60px] overflow-y-auto custom-scroll">
<div className="flex flex-wrap items-center">
@ -281,7 +280,7 @@ export default function GenericModal({
setModalOpen(false);
break;
case 2:
!inputValue || inputValue == ""
!inputValue || inputValue === ""
? setModalOpen(false)
: validatePrompt(false);
break;

9
src/frontend/src/types/flow/index.ts
View file

@ -27,3 +27,12 @@ export type FlowStyleType = {
color: string;
flow_id: string;
};
export type TweaksType = Array<
{
[key: string]: {
output_key?: string;
};
} & FlowStyleType
>;

6
src/frontend/src/types/tabs/index.ts
View file

@ -1,5 +1,5 @@
import { Dispatch, SetStateAction } from "react";
import { FlowType } from "../flow";
import { FlowType, TweaksType } from "../flow";
export type TabsContextType = {
saveFlow: (flow: FlowType) => Promise<void>;
@ -32,8 +32,8 @@ export type TabsContextType = {
) => void;
lastCopiedSelection: { nodes: any; edges: any };
setLastCopiedSelection: (selection: { nodes: any; edges: any }) => void;
setTweak: (tweak: any) => void;
getTweak: any;
setTweak: (tweak: TweaksType) => void;
getTweak: TweaksType[];
};
export type TabsState = {

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

@ -843,7 +843,7 @@ export function groupByFamily(data, baseClasses, left, type) {
});
});
if (left == false) {
if (left === false) {
let groupedBy = arrOfType.filter((object, index, self) => {
const foundIndex = self.findIndex(
(o) => o.family === object.family && o.type === object.type
@ -866,7 +866,7 @@ export function groupByFamily(data, baseClasses, left, type) {
});
}
if (left == false) {
if (left === false) {
let resFil = result.filter((group) => group.family === parentOutput);
result = resFil;
}
@ -893,8 +893,8 @@ export function groupByFamily(data, baseClasses, left, type) {
}
groupedArray.forEach((object, index, self) => {
const findObj = arrOfLength.find((x) => x.type == object.family);
if (object.component.length == findObj.length) {
const findObj = arrOfLength.find((x) => x.type === object.family);
if (object.component.length === findObj.length) {
self[index]["type"] = "";
} else {
self[index]["type"] = object.component.join(", ");