fix: resolve issue with adding global variable when input is connected (#4289)

* fix: prevent add global variable when inpiut is connected

* [autofix.ci] apply automated fixes

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
Co-authored-by: Gabriel Luiz Freitas Almeida <gabriel@langflow.org>

src/frontend/src/components/GlobalVariableModal/GlobalVariableModal.tsx

@@ -25,12 +25,14 @@ export default function GlobalVariableModal({
   initialData,
   open: myOpen,
   setOpen: mySetOpen,
+  disabled = false,
 }: {
   children?: JSX.Element;
   asChild?: boolean;
   initialData?: GlobalVariable;
   open?: boolean;
   setOpen?: (a: boolean | ((o?: boolean) => boolean)) => void;
+  disabled?: boolean;
 }): JSX.Element {
   const [key, setKey] = useState(initialData?.name ?? "");
   const [value, setValue] = useState(initialData?.value ?? "");
@@ -122,6 +124,7 @@ export default function GlobalVariableModal({
       setOpen={setOpen}
       size="x-small"
       onSubmit={submitForm}
+      disable={disabled}
     >
       <BaseModal.Header
         description={
@@ -138,7 +141,9 @@ export default function GlobalVariableModal({
           aria-hidden="true"
         />
       </BaseModal.Header>
-      <BaseModal.Trigger asChild={asChild}>{children}</BaseModal.Trigger>
+      <BaseModal.Trigger disable={disabled} asChild={asChild}>
+        {children}
+      </BaseModal.Trigger>
       <BaseModal.Content>
         <div className="flex h-full w-full flex-col gap-4 align-middle">
           <Label>Variable Name</Label>

src/frontend/src/components/inputComponent/index.tsx

@@ -159,9 +159,11 @@ export default function InputComponent({
           className={cn(
             password && selectedOption === "" ? "right-8" : "right-0",
             "absolute inset-y-0 flex items-center pr-2.5",
+            disabled && "cursor-not-allowed opacity-50",
           )}
         >
           <button
+            disabled={disabled}
             onClick={(e) => {
               if (disabled) return;
               setShowOptions(!showOptions);

src/frontend/src/components/parameterRenderComponent/components/inputGlobalComponent/index.tsx

@@ -80,7 +80,7 @@ export default function InputGlobalComponent({
       optionsPlaceholder={"Global Variables"}
       optionsIcon="Globe"
       optionsButton={
-        <GlobalVariableModal>
+        <GlobalVariableModal disabled={disabled}>
           <CommandItem value="doNotFilter-addNewVariable">
             <ForwardedIconComponent
               name="Plus"