feat(frontend): add flow name and description editing functionality to FlowSettingsModal component

fix(frontend): fix saveFlow function call to save edited flow name and description instead of the original flow object

src/frontend/.githooks/prepare-commit-msg

@@ -0,0 +1 @@
+/usr/lib/node_modules/opencommit/out/cli.cjs

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

@@ -24,6 +24,10 @@ export default function FlowSettingsModal() {
   const ref = useRef();
   const { flows, tabId, updateFlow, setTabsState, saveFlow } = useContext(TabsContext);
   const maxLength = 50;
+  const [name, setName] = useState(flows.find((f) => f.id === tabId).name);
+  const [description, setDescription] = useState(
+    flows.find((f) => f.id === tabId).description
+  );
   function setModalOpen(x: boolean) {
     setOpen(x);
     if (x === false) {
@@ -32,12 +36,14 @@ export default function FlowSettingsModal() {
       }, 300);
     }
   }
-
+  function handleClick(){
-
+    let savedFlow = flows.find((f) => f.id === tabId)
-  const [name, setName] = useState(flows.find((f) => f.id === tabId).name);
+    savedFlow.name = name;
-  const [description, setDescription] = useState(
+    savedFlow.description = description;
-    flows.find((f) => f.id === tabId).description
+    saveFlow(savedFlow);
-  );
+    setSuccessData({ title: "Changes saved successfully" });
+    closePopUp();
+  }
   return (
     <Dialog open={true} onOpenChange={setModalOpen}>
       <DialogTrigger asChild></DialogTrigger>
@@ -62,11 +68,7 @@ export default function FlowSettingsModal() {
 
         <DialogFooter>
           <Button
-            onClick={() => {
+            onClick={handleClick}
-              saveFlow(flows.find((f) => f.id === tabId));
-              setSuccessData({ title: "Changes saved successfully" });
-              closePopUp();
-            }}
             type="submit"
           >
             Save