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

Merge branch 'main' into fix_starter_windows

Browse source
This commit is contained in:
Joey Yakimowich-Payne 2025-08-13 12:23:12 -06:00 • committed by GitHub
commit 577bece3a0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
10 changed files with 118 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/frontend/package-lock.json generated
View file

@ -1176,7 +1176,6 @@
},
"node_modules/@clack/prompts/node_modules/is-unicode-supported": {
"version": "1.3.0",
"extraneous": true,
"inBundle": true,
"license": "MIT",
"engines": {

19
src/frontend/src/components/core/parameterRenderComponent/components/inputComponent/components/popover/index.tsx
View file

@ -1,7 +1,7 @@
import { PopoverAnchor } from "@radix-ui/react-popover";
import { uniqueId } from "lodash";
import { X } from "lucide-react";
import { type ReactNode, useMemo, useState } from "react";
import { type ReactNode, useEffect, useMemo, useState } from "react";
import ForwardedIconComponent from "@/components/common/genericIconComponent";
import ShadTooltip from "@/components/common/shadTooltipComponent";
import { Badge } from "@/components/ui/badge";
@ -189,12 +189,20 @@ const CustomInputPopover = ({
hasRefreshButton,
}) => {
const [isFocused, setIsFocused] = useState(false);
const [cursor, setCursor] = useState<number | null>(null);
const memoizedOptions = useMemo(() => new Set<string>(options), [options]);
const PopoverContentInput = editNode
? PopoverContent
: PopoverContentWithoutPortal;
// Restore cursor position after value changes
useEffect(() => {
if (cursor !== null && refInput.current) {
refInput.current.setSelectionRange(cursor, cursor);
}
}, [cursor, value]);
const handleRemoveOption = (
optionToRemove: string,
e: React.MouseEvent<HTMLButtonElement>,
@ -270,7 +278,7 @@ const CustomInputPopover = ({
autoComplete="off"
onFocus={() => setIsFocused(true)}
autoFocus={autoFocus}
id={id + uniqueId()}
id={id}
ref={refInput}
type={!pwdVisible && password ? "password" : "text"}
onBlur={() => {
@ -292,7 +300,10 @@ const CustomInputPopover = ({
? ""
: placeholder
}
onChange={(e) => onChange?.(e.target.value)}
onChange={(e) => {
setCursor(e.target.selectionStart);
onChange?.(e.target.value);
}}
onKeyDown={(e) => {
handleKeyDown?.(e);
if (blurOnEnter && e.key === "Enter") refInput.current?.blur();

11
src/frontend/src/components/core/parameterRenderComponent/components/inputComponent/components/popoverObject/index.tsx
View file

@ -1,4 +1,5 @@
import { PopoverAnchor } from "@radix-ui/react-popover";
import { useEffect, useState } from "react";
import ForwardedIconComponent from "@/components/common/genericIconComponent";
import {
Command,
@ -40,11 +41,21 @@ const CustomInputPopoverObject = ({
handleKeyDown,
showOptions,
}) => {
const [cursor, setCursor] = useState<number | null>(null);
const PopoverContentInput = editNode
? PopoverContent
: PopoverContentWithoutPortal;
// Restore cursor position after value changes
useEffect(() => {
if (cursor !== null && refInput.current) {
refInput.current.setSelectionRange(cursor, cursor);
}
}, [cursor, value]);
const handleInputChange = (e) => {
setCursor(e.target.selectionStart);
onChange && onChange(e.target.value);
};

9
src/frontend/src/components/core/parameterRenderComponent/components/inputComponent/index.tsx
View file

@ -45,6 +45,7 @@ export default function InputComponent({
hasRefreshButton = false,
}: InputComponentType): JSX.Element {
const [pwdVisible, setPwdVisible] = useState(false);
const [cursor, setCursor] = useState<number | null>(null);
const refInput = useRef<HTMLInputElement>(null);
const [showOptions, setShowOptions] = useState<boolean>(false);
@ -54,6 +55,13 @@ export default function InputComponent({
}
}, [disabled]);
// Restore cursor position after value changes
useEffect(() => {
if (cursor !== null && refInput.current) {
refInput.current.setSelectionRange(cursor, cursor);
}
}, [cursor, value]);
function onInputLostFocus(event): void {
if (onBlur) onBlur(event);
}
@ -83,6 +91,7 @@ export default function InputComponent({
)}
placeholder={password && editNode ? "Key" : placeholder}
onChange={(e) => {
setCursor(e.target.selectionStart);
if (onChangeFolderName) {
return onChangeFolderName(e);
}

9
src/frontend/src/components/core/parameterRenderComponent/components/textAreaComponent/index.tsx
View file

@ -74,6 +74,7 @@ export default function TextAreaComponent({
const inputRef = useRef<HTMLInputElement>(null);
const [isFocused, setIsFocused] = useState(false);
const [passwordVisible, setPasswordVisible] = useState(false);
const [cursor, setCursor] = useState<number | null>(null);
const isWebhook = useMemo(
() => nodeInformationMetadata?.nodeType === "webhook",
@ -100,6 +101,13 @@ export default function TextAreaComponent({
}
}, [isWebhook, value, nodeInformationMetadata, handleOnNewValue]);
// Restore cursor position after value changes
useEffect(() => {
if (cursor !== null && inputRef.current) {
inputRef.current.setSelectionRange(cursor, cursor);
}
}, [cursor, value]);
const getInputClassName = () => {
return cn(
inputClasses.base({ isFocused, password: password! }),
@ -111,6 +119,7 @@ export default function TextAreaComponent({
};
const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
setCursor(e.target.selectionStart);
handleOnNewValue({ value: e.target.value });
};

2
src/frontend/src/components/core/sidebarComponent/index.tsx
View file

@ -34,7 +34,7 @@ const SideBarButtonsComponent = ({ items }: SideBarButtonsComponentProps) => {
<SidebarMenu>
{items.map((item, index) => (
<SidebarMenuItem key={index}>
<CustomLink to={item.href!}>
<CustomLink to={item.href!} replace>
<SidebarMenuButton
size="md"
isActive={

21
src/frontend/src/stores/locationStore.ts
View file

@ -1,21 +0,0 @@
import { create } from "zustand";
import type { LocationStoreType } from "../types/zustand/location";
export const useLocationStore = create<LocationStoreType>((set, get) => ({
routeHistory: [],
setRouteHistory: (location) => {
const routeHistoryArray = get().routeHistory;
routeHistoryArray.push(location);
if (routeHistoryArray?.length > 100) {
routeHistoryArray.shift();
set({
routeHistory: routeHistoryArray,
});
}
set({
routeHistory: routeHistoryArray,
});
},
}));

13
src/frontend/tests/core/unit/inputComponent.spec.ts
View file

@ -38,6 +38,19 @@ test(
expect(false).toBeTruthy();
}
// Test cursor position preservation
const input = page.getByTestId("popover-anchor-input-collection_name");
await input.click();
await input.press("Home"); // Move cursor to start
await input.press("ArrowRight"); // Move cursor to position 1
await input.press("ArrowRight"); // Move cursor to position 2
await input.pressSequentially("X", { delay: 100 }); // Type at position 2
const cursorValue = await input.inputValue();
if (!cursorValue.startsWith("coX")) {
expect(false).toBeTruthy();
}
await input.fill("collection_name_test_123123123!@#$&*(&%$@");
await page.getByTestId("div-generic-node").click();
await page.getByTestId("edit-button-modal").last().click();

15
src/frontend/tests/core/unit/textAreaModalComponent.spec.ts
View file

@ -44,6 +44,21 @@ test(
"test test test test test test test test test test test !@#%*)( 123456789101010101010101111111111 !!!!!!!!!!",
);
// Test cursor position preservation
const textInput = page.getByTestId("textarea_str_text");
await textInput.click();
await textInput.press("Home"); // Move cursor to start
await textInput.press("ArrowRight"); // Move cursor to position 1
await textInput.press("ArrowRight"); // Move cursor to position 2
await textInput.pressSequentially("Y", { delay: 100 }); // Type at position 2
const cursorValue = await textInput.inputValue();
if (!cursorValue.startsWith("teY")) {
expect(false).toBeTruthy();
}
await textInput.fill(
"test test test test test test test test test test test !@#%*)( 123456789101010101010101111111111 !!!!!!!!!!",
);
await page
.getByTestId("button_open_text_area_modal_textarea_str_text")
.click();

45
src/frontend/tests/extended/features/userSettings.spec.ts
View file

@ -1,4 +1,5 @@
import { expect, test } from "@playwright/test";
import { awaitBootstrapTest } from "../../utils/await-bootstrap-test";
test.beforeAll(async () => {
await new Promise((resolve) => setTimeout(resolve, 7000));
@ -200,3 +201,47 @@ test(
await page.getByText(randomName).isVisible();
},
);
test(
"should navigate back to flow from global variables",
{ tag: ["@release", "@workspace"] },
async ({ page }) => {
await awaitBootstrapTest(page);
await page.getByTestId("side_nav_options_all-templates").click();
await page.getByRole("heading", { name: "Basic Prompting" }).click();
await page.waitForSelector('[data-testid="fit_view"]', {
timeout: 100000,
});
// Now navigate to user settings
await page.getByTestId("user-profile-settings").click();
await page.getByTestId("menu_settings_button").click();
// Verify we're on the settings page
await expect(page.getByText("General").nth(2)).toBeVisible({
timeout: 4000,
});
// Navigate to Global Variables
await page.getByText("Global Variables").click();
await page.getByText("Global Variables").nth(2);
await page
.getByText("Global Variables", { exact: true })
.nth(1)
.isVisible();
// Click the back button - this should take us back to the flow, not to the main settings page
await page.getByTestId("back_page_button").click();
// Verify we're back on the flow page, not the settings main page
await page.waitForSelector('[data-testid="sidebar-search-input"]', {
timeout: 5000,
});
// Additional verification that we're on the flow page
expect(page.url()).toMatch(/\/flow\//);
// Verify we can see flow-specific elements
await expect(page.getByTestId("sidebar-search-input")).toBeVisible();
},
);