fix: revert #7970 and add tags to tests (#8019)

src/backend/base/langflow/api/v1/flows.py

@@ -322,10 +322,6 @@ async def update_flow(
 
         update_data = flow.model_dump(exclude_unset=True, exclude_none=True)
 
-        # Specifically handle endpoint_name when it's explicitly set to null or empty string
-        if flow.endpoint_name is None or flow.endpoint_name == "":
-            update_data["endpoint_name"] = None
-
         if settings_service.settings.remove_api_keys:
             update_data = remove_api_keys(update_data)
 

src/frontend/src/components/core/appHeaderComponent/components/FlowMenu/index.tsx

@@ -216,8 +216,8 @@ export const MenuBar = memo((): JSX.Element => {
   ]);
 
   useEffect(() => {
-    if (!editingName) {
+    if (currentFlowName && !editingName) {
-      setFlowName(currentFlowName ?? "Untitled Flow");
+      setFlowName(currentFlowName);
     }
   }, [currentFlowName, editingName]);
 
@@ -233,7 +233,7 @@ export const MenuBar = memo((): JSX.Element => {
       : getNumberFromString(currentFlowGradient ?? currentFlowId ?? "")) %
     swatchColors.length;
 
-  return onFlowPage ? (
+  return currentFlowName && onFlowPage ? (
     <div
       className="flex w-full items-center justify-center gap-2"
       data-testid="menu_bar_wrapper"
@@ -303,7 +303,7 @@ export const MenuBar = memo((): JSX.Element => {
                 onKeyDown={handleKeyDown}
                 onFocus={() => {
                   setEditingName(true);
-                  setFlowName(currentFlowName ?? "Untitled Flow");
+                  setFlowName(currentFlowName);
                   const flows = useFlowsManagerStore.getState().flows;
                   setFlowNames(
                     flows
@@ -315,7 +315,6 @@ export const MenuBar = memo((): JSX.Element => {
                 value={flowName}
                 id="input-flow-name"
                 data-testid="input-flow-name"
-                placeholder="Untitled Flow"
               />
               <span
                 ref={measureRef}
@@ -323,7 +322,7 @@ export const MenuBar = memo((): JSX.Element => {
                 aria-hidden="true"
                 data-testid="flow_name"
               >
-                {flowName || "Untitled Flow"}
+                {flowName}
               </span>
             </div>
           </div>

src/frontend/src/components/core/editFlowSettingsComponent/index.tsx

@@ -11,13 +11,11 @@ export const EditFlowSettings: React.FC<InputProps> = ({
   description,
   endpointName,
   maxLength = 50,
-  minLength = 1,
   setName,
   setDescription,
   setEndpointName,
 }: InputProps): JSX.Element => {
   const [isMaxLength, setIsMaxLength] = useState(false);
-  const [isMinLength, setIsMinLength] = useState(false);
   const [validEndpointName, setValidEndpointName] = useState(true);
   const [isInvalidName, setIsInvalidName] = useState(false);
 
@@ -28,11 +26,6 @@ export const EditFlowSettings: React.FC<InputProps> = ({
     } else {
       setIsMaxLength(false);
     }
-    if (value.length < minLength) {
-      setIsMinLength(true);
-    } else {
-      setIsMinLength(false);
-    }
     let invalid = false;
     for (let i = 0; i < invalidNameList!.length; i++) {
       if (value === invalidNameList![i]) {
@@ -42,15 +35,7 @@ export const EditFlowSettings: React.FC<InputProps> = ({
       invalid = false;
     }
     setIsInvalidName(invalid);
-
-    // Only update the name if it's valid (not empty and not invalid)
-    if (value.length >= minLength && !invalid) {
     setName!(value);
-    } else if (value.length === 0) {
-      // For empty string, update state but keep isMinLength true
-      setName!("");
-      setIsMinLength(true);
-    }
   };
 
   const handleDescriptionChange = (event: ChangeEvent<HTMLTextAreaElement>) => {
@@ -58,19 +43,11 @@ export const EditFlowSettings: React.FC<InputProps> = ({
   };
 
   const handleEndpointNameChange = (event: ChangeEvent<HTMLInputElement>) => {
-    const { value } = event.target;
     // Validate the endpoint name
     // use this regex r'^[a-zA-Z0-9_-]+$'
     const isValid = isEndpointNameValid(event.target.value, maxLength);
     setValidEndpointName(isValid);
-
+    setEndpointName!(event.target.value);
-    // Only update if valid and meets minimum length (if set)
-    if (isValid && value.length >= minLength) {
-      setEndpointName!(value);
-    } else if (value.length === 0) {
-      // Always allow empty endpoint name (it's optional)
-      setEndpointName!("");
-    }
   };
 
   //this function is necessary to select the text when double clicking, this was not working with the onFocus event
@@ -84,11 +61,6 @@ export const EditFlowSettings: React.FC<InputProps> = ({
           {isMaxLength && (
             <span className="edit-flow-span">Character limit reached</span>
           )}
-          {isMinLength && (
-            <span className="edit-flow-span">
-              Minimum {minLength} character(s) required
-            </span>
-          )}
           {isInvalidName && (
             <span className="edit-flow-span">
               Name invalid or already exists
@@ -105,8 +77,6 @@ export const EditFlowSettings: React.FC<InputProps> = ({
             placeholder="Flow name"
             id="name"
             maxLength={maxLength}
-            minLength={minLength}
-            required={true}
             onDoubleClickCapture={(event) => {
               handleFocus(event);
             }}
@@ -167,7 +137,6 @@ export const EditFlowSettings: React.FC<InputProps> = ({
             value={endpointName ?? ""}
             placeholder="An alternative name to run the endpoint"
             maxLength={maxLength}
-            minLength={minLength}
             id="endpoint_name"
             onDoubleClickCapture={(event) => {
               handleFocus(event);

src/frontend/src/modals/flowSettingsModal/index.tsx

@@ -28,19 +28,17 @@ export default function FlowSettingsModal({
   const setSuccessData = useAlertStore((state) => state.setSuccessData);
   const flows = useFlowsManagerStore((state) => state.flows);
   const flow = flowData ?? currentFlow;
+  useEffect(() => {
+    setName(flow?.name ?? "");
+    setDescription(flow?.description ?? "");
+  }, [flow?.name, flow?.description, open]);
+
   const [name, setName] = useState(flow?.name ?? "");
   const [description, setDescription] = useState(flow?.description ?? "");
   const [endpoint_name, setEndpointName] = useState(flow?.endpoint_name ?? "");
   const [isSaving, setIsSaving] = useState(false);
   const [disableSave, setDisableSave] = useState(true);
   const autoSaving = useFlowsManagerStore((state) => state.autoSaving);
-
-  useEffect(() => {
-    setName(flow?.name ?? "");
-    setDescription(flow?.description ?? "");
-    setEndpointName(flow?.endpoint_name ?? "");
-  }, [flow?.name, flow?.description, flow?.endpoint_name, open]);
-
   function handleClick(): void {
     setIsSaving(true);
     if (!flow) return;

src/frontend/src/pages/FlowPage/index.tsx

@@ -149,6 +149,7 @@ export default function FlowPage({ view }: { view?: boolean }): JSX.Element {
 
   const getFlowToAddToCanvas = async (id: string) => {
     const flow = await getFlow({ id: id });
+    console.log(flow);
     setCurrentFlow(flow);
   };
 

src/frontend/src/types/components/index.ts

@@ -303,7 +303,6 @@ export type InputProps = {
   description: string | null;
   endpointName?: string | null;
   maxLength?: number;
-  minLength?: number;
   setName?: (name: string) => void;
   setDescription?: (description: string) => void;
   setEndpointName?: (endpointName: string) => void;

src/frontend/tests/extended/features/edit-flow-name.spec.ts

@@ -2,7 +2,7 @@ import { expect, test } from "@playwright/test";
 import { awaitBootstrapTest } from "../../utils/await-bootstrap-test";
 test(
   "user should be able to edit flow name by clicking on the header or on the main page",
-  { tag: ["@release", "@workspace"] },
+  { tag: ["@release", "@workspace", "@components"] },
   async ({ page }) => {
     const randomName = Math.random().toString(36).substring(2, 15);
     const randomName2 = Math.random().toString(36).substring(2, 15);