From e406bdebe6a1b23947c8befb40df923a14151438 Mon Sep 17 00:00:00 2001
From: pa-lem <pa-lem@hotmail.fr>
Date: Mon, 23 Sep 2024 10:48:40 +0200
Subject: [PATCH 01/12] add context and functions to display confirm modal

---
 .../app/src/components/display/slide-over.tsx | 106 +++++++++++-------
 .../src/components/modals/modal-confirm.tsx   |   4 +-
 frontend/app/src/components/ui/form.tsx       |  26 +++++
 3 files changed, 91 insertions(+), 45 deletions(-)

diff --git a/frontend/app/src/components/display/slide-over.tsx b/frontend/app/src/components/display/slide-over.tsx
index 84718f705d..22223ddc6c 100644
--- a/frontend/app/src/components/display/slide-over.tsx
+++ b/frontend/app/src/components/display/slide-over.tsx
@@ -1,11 +1,12 @@
 import { Dialog, Transition } from "@headlessui/react";
-import React, { Fragment, useRef } from "react";
+import React, { Fragment, useRef, useState } from "react";
 import { Badge } from "@/components/ui/badge";
 import { Icon } from "@iconify-icon/react";
 import { ObjectHelpButton } from "@/components/menu/object-help-button";
 import { useAtomValue } from "jotai/index";
 import { currentBranchAtom } from "@/state/atoms/branches.atom";
 import { IModelSchema } from "@/state/atoms/schema.atom";
+import ModalConfirm from "../modals/modal-confirm";
 
 interface Props {
   open: boolean;
@@ -15,9 +16,16 @@ interface Props {
   offset?: number;
 }
 
+interface SlideOverContextProps {
+  setPreventClose?: (value: boolean) => void;
+}
+
+export const SlideOverContext = React.createContext<SlideOverContextProps>({});
+
 export default function SlideOver(props: Props) {
   const { open, setOpen, title, offset = 0 } = props;
   const initialFocusRef = useRef(null);
+  const [preventClose, setPreventClose] = useState(false);
 
   // Need to define full classes so tailwind can compile the css
   const panelWidth = "w-[400px]";
@@ -28,51 +36,63 @@ export default function SlideOver(props: Props) {
   };
 
   return (
-    <Transition.Root show={open} as={Fragment}>
-      <Dialog as="div" className="relative z-10" onClose={setOpen} initialFocus={initialFocusRef}>
-        <Transition.Child
-          as={Fragment}
-          enter="ease-in-out duration-500"
-          enterFrom="opacity-0"
-          enterTo="opacity-100"
-          leave="ease-in-out duration-500"
-          leaveFrom="opacity-100"
-          leaveTo="opacity-0">
-          <div
-            className="fixed inset-0 bg-black bg-opacity-40 transition-opacity"
-            data-cy="side-panel-background"
-            data-testid="side-panel-background"
-          />
-        </Transition.Child>
-
-        <div className="before:fixed inset-0 overflow-hidden">
-          <div className="absolute inset-0 overflow-hidden">
-            <div className="pointer-events-none fixed inset-y-0 right-0 flex">
-              <button type="button" tabIndex={-1} ref={initialFocusRef} />
-              <Transition.Child
-                as={Fragment}
-                enter="transform transition ease-in-out duration-500"
-                enterFrom="translate-x-full"
-                enterTo={`${offestWidth[offset]}`}
-                leave="transform transition ease-in-out duration-500"
-                leaveFrom={`${offestWidth[offset]}`}
-                leaveTo="translate-x-full">
-                <Dialog.Panel
-                  className={`bg-custom-white pointer-events-auto shadow-xl flex flex-col ${panelWidth} ${offestWidth[offset]}`}
-                  data-testid="side-panel-container">
-                  <div className="px-4 py-4 sm:px-4 bg-gray-50 border-b">
-                    <div className="w-full">
-                      <Dialog.Title className="text-base leading-6">{title}</Dialog.Title>
+    <SlideOverContext.Provider
+      value={{ setPreventClose: (value: boolean) => setPreventClose(value) }}>
+      <Transition.Root show={open || (!open && preventClose)} as={Fragment}>
+        <Dialog as="div" className="relative z-10" onClose={setOpen} initialFocus={initialFocusRef}>
+          <Transition.Child
+            as={Fragment}
+            enter="ease-in-out duration-500"
+            enterFrom="opacity-0"
+            enterTo="opacity-100"
+            leave="ease-in-out duration-500"
+            leaveFrom="opacity-100"
+            leaveTo="opacity-0">
+            <div
+              className="fixed inset-0 bg-black bg-opacity-40 transition-opacity"
+              data-cy="side-panel-background"
+              data-testid="side-panel-background"
+            />
+          </Transition.Child>
+
+          <div className="before:fixed inset-0 overflow-hidden">
+            <div className="absolute inset-0 overflow-hidden">
+              <div className="pointer-events-none fixed inset-y-0 right-0 flex">
+                <button type="button" tabIndex={-1} ref={initialFocusRef} />
+                <Transition.Child
+                  as={Fragment}
+                  enter="transform transition ease-in-out duration-500"
+                  enterFrom="translate-x-full"
+                  enterTo={`${offestWidth[offset]}`}
+                  leave="transform transition ease-in-out duration-500"
+                  leaveFrom={`${offestWidth[offset]}`}
+                  leaveTo="translate-x-full">
+                  <Dialog.Panel
+                    className={`bg-custom-white pointer-events-auto shadow-xl flex flex-col ${panelWidth} ${offestWidth[offset]}`}
+                    data-testid="side-panel-container">
+                    <div className="px-4 py-4 sm:px-4 bg-gray-50 border-b">
+                      <div className="w-full">
+                        <Dialog.Title className="text-base leading-6">{title}</Dialog.Title>
+                      </div>
                     </div>
-                  </div>
-                  {props.children}
-                </Dialog.Panel>
-              </Transition.Child>
+                    {props.children}
+                  </Dialog.Panel>
+                </Transition.Child>
+              </div>
             </div>
           </div>
-        </div>
-      </Dialog>
-    </Transition.Root>
+        </Dialog>
+      </Transition.Root>
+
+      <ModalConfirm
+        title="Confirm"
+        description={"Are you sure you want to close this form? All unsaved changes will be lost."}
+        onCancel={() => setOpen(true)}
+        onConfirm={() => setPreventClose(false)}
+        open={!open && preventClose}
+        setOpen={() => setPreventClose(false)}
+      />
+    </SlideOverContext.Provider>
   );
 }
 
diff --git a/frontend/app/src/components/modals/modal-confirm.tsx b/frontend/app/src/components/modals/modal-confirm.tsx
index a8747eafa0..fcee449c14 100644
--- a/frontend/app/src/components/modals/modal-confirm.tsx
+++ b/frontend/app/src/components/modals/modal-confirm.tsx
@@ -9,10 +9,10 @@ interface iProps {
   isLoading?: boolean;
   setOpen: React.Dispatch<React.SetStateAction<boolean>>;
   title: string;
-  description: string | React.ReactNode;
+  description?: string | React.ReactNode;
   onConfirm: Function;
   onCancel: Function;
-  children: ReactNode;
+  children?: ReactNode;
   icon?: string;
 }
 
diff --git a/frontend/app/src/components/ui/form.tsx b/frontend/app/src/components/ui/form.tsx
index c61773fe0b..7d8505ee86 100644
--- a/frontend/app/src/components/ui/form.tsx
+++ b/frontend/app/src/components/ui/form.tsx
@@ -20,6 +20,8 @@ import {
 } from "react-hook-form";
 import { Spinner } from "@/components/ui/spinner";
 import Label, { LabelProps } from "@/components/ui/label";
+import { SlideOverContext } from "../display/slide-over";
+import { FormFieldValue } from "../form/type";
 
 export type FormRef = ReturnType<typeof useForm>;
 
@@ -32,6 +34,7 @@ export interface FormProps extends Omit<FormHTMLAttributes<HTMLFormElement>, "on
 export const Form = React.forwardRef<FormRef, FormProps>(
   ({ form, defaultValues, className, children, onSubmit, ...props }: FormProps, ref) => {
     const currentForm = form ?? useForm({ defaultValues });
+    const slideOverContext = useContext(SlideOverContext);
 
     useImperativeHandle(ref, () => currentForm);
 
@@ -39,6 +42,27 @@ export const Form = React.forwardRef<FormRef, FormProps>(
       currentForm.reset(defaultValues);
     }, [JSON.stringify(defaultValues)]);
 
+    // Callback version of watch.  It's your responsibility to unsubscribe when done.
+    useEffect(() => {
+      // Stop logic if there is no context to prevent the slide over close
+      if (!slideOverContext?.setPreventClose) return;
+
+      const subscription = currentForm.watch((formData: Record<string, FormFieldValue>) => {
+        const updatedValue = Object.entries(formData).find(
+          ([key, field]: [string, FormFieldValue]) => {
+            const defaultValue = defaultValues && defaultValues[key];
+
+            return (defaultValue?.value || field.value) && defaultValue?.value !== field.value;
+          }
+        );
+
+        if (updatedValue && slideOverContext.setPreventClose)
+          slideOverContext.setPreventClose(true);
+      });
+
+      return () => subscription.unsubscribe();
+    }, [currentForm.watch]);
+
     return (
       <FormProvider {...currentForm}>
         <form
@@ -47,6 +71,8 @@ export const Form = React.forwardRef<FormRef, FormProps>(
               event.stopPropagation();
             }
 
+            if (slideOverContext?.setPreventClose) slideOverContext?.setPreventClose(false);
+
             if (!onSubmit) return;
 
             currentForm.handleSubmit(onSubmit)(event);

From 1e7a316094bdae1683e7fd571ac1fa2cac674649 Mon Sep 17 00:00:00 2001
From: pa-lem <pa-lem@hotmail.fr>
Date: Mon, 23 Sep 2024 10:49:35 +0200
Subject: [PATCH 02/12] disable rule

---
 frontend/app/.eslintrc | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/frontend/app/.eslintrc b/frontend/app/.eslintrc
index 6982c2cd60..81da3d72ac 100644
--- a/frontend/app/.eslintrc
+++ b/frontend/app/.eslintrc
@@ -25,6 +25,7 @@
     "tsconfig.json"
   ],
   "rules": {
+    "react/prop-types": "off",
     "quotes": [
       "error",
       "double",
@@ -74,4 +75,4 @@
     "semi": "error",
     "no-trailing-spaces": "error"
   }
-}
+}
\ No newline at end of file

From 7469eba4729485749fb38a081125e6146a97cec0 Mon Sep 17 00:00:00 2001
From: pa-lem <pa-lem@hotmail.fr>
Date: Mon, 23 Sep 2024 11:03:54 +0200
Subject: [PATCH 03/12] add fragment

---
 changelog/4419.added.md | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 changelog/4419.added.md

diff --git a/changelog/4419.added.md b/changelog/4419.added.md
new file mode 100644
index 0000000000..3163d1c4d0
--- /dev/null
+++ b/changelog/4419.added.md
@@ -0,0 +1 @@
+* Prevent form to be clsoed if the form has been updated
\ No newline at end of file

From 00e9090b6db79379b28200d874710a815ab897fc Mon Sep 17 00:00:00 2001
From: pa-lem <pa-lem@hotmail.fr>
Date: Mon, 23 Sep 2024 15:50:47 +0200
Subject: [PATCH 04/12] update modal

---
 frontend/app/src/components/display/slide-over.tsx  | 7 ++++---
 frontend/app/src/components/modals/modal-delete.tsx | 4 +++-
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/frontend/app/src/components/display/slide-over.tsx b/frontend/app/src/components/display/slide-over.tsx
index 22223ddc6c..0a7d21575f 100644
--- a/frontend/app/src/components/display/slide-over.tsx
+++ b/frontend/app/src/components/display/slide-over.tsx
@@ -6,7 +6,7 @@ import { ObjectHelpButton } from "@/components/menu/object-help-button";
 import { useAtomValue } from "jotai/index";
 import { currentBranchAtom } from "@/state/atoms/branches.atom";
 import { IModelSchema } from "@/state/atoms/schema.atom";
-import ModalConfirm from "../modals/modal-confirm";
+import ModalDelete from "../modals/modal-delete";
 
 interface Props {
   open: boolean;
@@ -84,13 +84,14 @@ export default function SlideOver(props: Props) {
         </Dialog>
       </Transition.Root>
 
-      <ModalConfirm
-        title="Confirm"
+      <ModalDelete
+        title="Closing form"
         description={"Are you sure you want to close this form? All unsaved changes will be lost."}
         onCancel={() => setOpen(true)}
         onConfirm={() => setPreventClose(false)}
         open={!open && preventClose}
         setOpen={() => setPreventClose(false)}
+        confirmLabel="Close"
       />
     </SlideOverContext.Provider>
   );
diff --git a/frontend/app/src/components/modals/modal-delete.tsx b/frontend/app/src/components/modals/modal-delete.tsx
index 1c9a22f4d1..3baee92424 100644
--- a/frontend/app/src/components/modals/modal-delete.tsx
+++ b/frontend/app/src/components/modals/modal-delete.tsx
@@ -12,6 +12,7 @@ interface iProps {
   onDelete: () => void;
   onCancel: () => void;
   children?: ReactNode;
+  confirmLabel?: string;
 }
 
 export default function ModalDelete({
@@ -23,6 +24,7 @@ export default function ModalDelete({
   setOpen,
   isLoading,
   children,
+  confirmLabel,
 }: iProps) {
   const cancelButtonRef = useRef(null);
 
@@ -84,7 +86,7 @@ export default function ModalDelete({
                     isLoading={isLoading}
                     data-cy="modal-delete-confirm"
                     data-testid="modal-delete-confirm">
-                    Delete
+                    {confirmLabel ?? "Delete"}
                   </Button>
                   <Button onClick={onCancel} ref={cancelButtonRef}>
                     Cancel

From 6ce77c5f9633b17370e7ac145dafc321a5b38d65 Mon Sep 17 00:00:00 2001
From: pa-lem <pa-lem@hotmail.fr>
Date: Mon, 23 Sep 2024 15:51:26 +0200
Subject: [PATCH 05/12] update typo

---
 changelog/4419.added.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/changelog/4419.added.md b/changelog/4419.added.md
index 3163d1c4d0..0c368b365e 100644
--- a/changelog/4419.added.md
+++ b/changelog/4419.added.md
@@ -1 +1 @@
-* Prevent form to be clsoed if the form has been updated
\ No newline at end of file
+* Prevent form to be closed if the form has been updated
\ No newline at end of file

From 212bfa63d57e998d15b0869f6501d8e500301105 Mon Sep 17 00:00:00 2001
From: pa-lem <pa-lem@hotmail.fr>
Date: Mon, 23 Sep 2024 15:55:05 +0200
Subject: [PATCH 06/12] fix function name

---
 frontend/app/src/components/display/slide-over.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/app/src/components/display/slide-over.tsx b/frontend/app/src/components/display/slide-over.tsx
index 0a7d21575f..852560016f 100644
--- a/frontend/app/src/components/display/slide-over.tsx
+++ b/frontend/app/src/components/display/slide-over.tsx
@@ -88,7 +88,7 @@ export default function SlideOver(props: Props) {
         title="Closing form"
         description={"Are you sure you want to close this form? All unsaved changes will be lost."}
         onCancel={() => setOpen(true)}
-        onConfirm={() => setPreventClose(false)}
+        onDelete={() => setPreventClose(false)}
         open={!open && preventClose}
         setOpen={() => setPreventClose(false)}
         confirmLabel="Close"

From 5f0ff2fa1715c3342c1a5b686c29d5bc942a86a0 Mon Sep 17 00:00:00 2001
From: pa-lem <pa-lem@hotmail.fr>
Date: Tue, 24 Sep 2024 11:18:20 +0200
Subject: [PATCH 07/12] avoid re render aftter filter update for form

---
 frontend/app/src/components/display/slide-over.tsx |  8 ++++++--
 frontend/app/src/components/filters/filters.tsx    |  6 +++---
 frontend/app/src/components/ui/form.tsx            | 14 +++++++++-----
 frontend/app/src/hooks/usePagination.ts            |  7 +++++--
 4 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/frontend/app/src/components/display/slide-over.tsx b/frontend/app/src/components/display/slide-over.tsx
index 852560016f..e9990959cb 100644
--- a/frontend/app/src/components/display/slide-over.tsx
+++ b/frontend/app/src/components/display/slide-over.tsx
@@ -35,9 +35,13 @@ export default function SlideOver(props: Props) {
     1: "-translate-x-[400px]",
   };
 
+  const context = {
+    isOpen: open || (!open && preventClose),
+    setPreventClose: (value: boolean) => setPreventClose(value),
+  };
+
   return (
-    <SlideOverContext.Provider
-      value={{ setPreventClose: (value: boolean) => setPreventClose(value) }}>
+    <SlideOverContext.Provider value={context}>
       <Transition.Root show={open || (!open && preventClose)} as={Fragment}>
         <Dialog as="div" className="relative z-10" onClose={setOpen} initialFocus={initialFocusRef}>
           <Transition.Child
diff --git a/frontend/app/src/components/filters/filters.tsx b/frontend/app/src/components/filters/filters.tsx
index c4d8097fc8..6a49f56e6d 100644
--- a/frontend/app/src/components/filters/filters.tsx
+++ b/frontend/app/src/components/filters/filters.tsx
@@ -37,14 +37,14 @@ export const Filters = ({ schema }: FiltersProps) => {
   const handleSubmit = (formData: Record<string, FormFieldValue>) => {
     const newFilters = getFiltersFromFormData(formData);
 
+    setShowFilters(false);
+
     setPagination({
       ...pagination,
       offset: 0,
     });
 
     setFilters(newFilters);
-
-    setShowFilters(false);
   };
 
   const currentFilters = filters.filter((filter) => !SEARCH_FILTERS.includes(filter.name));
@@ -84,7 +84,7 @@ export const Filters = ({ schema }: FiltersProps) => {
           kind={schema?.kind}
           isFilterForm
           submitLabel="Apply filters"
-          currentObject={getObjectFromFilters(schema, currentFilters)}
+          currentObject={getObjectFromFilters(schema, showFilters ? currentFilters : [])}
         />
       </SlideOver>
     </div>
diff --git a/frontend/app/src/components/ui/form.tsx b/frontend/app/src/components/ui/form.tsx
index 7d8505ee86..02378291f4 100644
--- a/frontend/app/src/components/ui/form.tsx
+++ b/frontend/app/src/components/ui/form.tsx
@@ -42,7 +42,6 @@ export const Form = React.forwardRef<FormRef, FormProps>(
       currentForm.reset(defaultValues);
     }, [JSON.stringify(defaultValues)]);
 
-    // Callback version of watch.  It's your responsibility to unsubscribe when done.
     useEffect(() => {
       // Stop logic if there is no context to prevent the slide over close
       if (!slideOverContext?.setPreventClose) return;
@@ -56,11 +55,14 @@ export const Form = React.forwardRef<FormRef, FormProps>(
           }
         );
 
-        if (updatedValue && slideOverContext.setPreventClose)
-          slideOverContext.setPreventClose(true);
+        if (updatedValue && slideOverContext.setPreventClose) console.log("SET TRUE NOW");
+
+        slideOverContext.setPreventClose(true);
       });
 
-      return () => subscription.unsubscribe();
+      return () => {
+        subscription.unsubscribe();
+      };
     }, [currentForm.watch]);
 
     return (
@@ -71,7 +73,9 @@ export const Form = React.forwardRef<FormRef, FormProps>(
               event.stopPropagation();
             }
 
-            if (slideOverContext?.setPreventClose) slideOverContext?.setPreventClose(false);
+            if (slideOverContext?.setPreventClose) {
+              slideOverContext?.setPreventClose(false);
+            }
 
             if (!onSubmit) return;
 
diff --git a/frontend/app/src/hooks/usePagination.ts b/frontend/app/src/hooks/usePagination.ts
index 2608efd535..f646c4f0f4 100644
--- a/frontend/app/src/hooks/usePagination.ts
+++ b/frontend/app/src/hooks/usePagination.ts
@@ -53,9 +53,12 @@ const usePagination = (): [tPagination, Function] => {
 
   // Set the pagination in the QSP
   const setPagination = (newPagination: tPagination) => {
+    const newLimit = getVerifiedLimit(newPagination?.limit, config);
+    const newOffset = getVerifiedOffset(newPagination?.offset, config);
+
     const newValidatedPagination = {
-      limit: getVerifiedLimit(newPagination?.limit, config),
-      offset: getVerifiedOffset(newPagination?.offset, config),
+      limit: newLimit,
+      offset: newOffset,
     };
 
     setPaginationInQueryString(JSON.stringify(newValidatedPagination));

From c46536ae9aa23c73c14be7b8c69f226b2c80170e Mon Sep 17 00:00:00 2001
From: pa-lem <pa-lem@hotmail.fr>
Date: Tue, 24 Sep 2024 17:51:10 +0200
Subject: [PATCH 08/12] fix set prevent from form data

---
 .../app/src/components/filters/filters.tsx    |  4 ++--
 frontend/app/src/components/ui/form.tsx       | 22 ++++---------------
 2 files changed, 6 insertions(+), 20 deletions(-)

diff --git a/frontend/app/src/components/filters/filters.tsx b/frontend/app/src/components/filters/filters.tsx
index 6a49f56e6d..8f2a0a30a8 100644
--- a/frontend/app/src/components/filters/filters.tsx
+++ b/frontend/app/src/components/filters/filters.tsx
@@ -8,9 +8,9 @@ import { useState } from "react";
 import ObjectForm from "@/components/form/object-form";
 import usePagination from "@/hooks/usePagination";
 import { IModelSchema } from "@/state/atoms/schema.atom";
-import { getFiltersFromFormData } from "@/components/filters/utils/getFiltersFromFormData";
 import { FormFieldValue } from "@/components/form/type";
 import { getObjectFromFilters } from "@/components/filters/utils/getObjectFromFilters";
+import { getFiltersFromFormData } from "./utils/getFiltersFromFormData";
 
 type FiltersProps = {
   schema: IModelSchema;
@@ -84,7 +84,7 @@ export const Filters = ({ schema }: FiltersProps) => {
           kind={schema?.kind}
           isFilterForm
           submitLabel="Apply filters"
-          currentObject={getObjectFromFilters(schema, showFilters ? currentFilters : [])}
+          currentObject={getObjectFromFilters(schema, currentFilters)}
         />
       </SlideOver>
     </div>
diff --git a/frontend/app/src/components/ui/form.tsx b/frontend/app/src/components/ui/form.tsx
index 02378291f4..df61a6615e 100644
--- a/frontend/app/src/components/ui/form.tsx
+++ b/frontend/app/src/components/ui/form.tsx
@@ -21,7 +21,6 @@ import {
 import { Spinner } from "@/components/ui/spinner";
 import Label, { LabelProps } from "@/components/ui/label";
 import { SlideOverContext } from "../display/slide-over";
-import { FormFieldValue } from "../form/type";
 
 export type FormRef = ReturnType<typeof useForm>;
 
@@ -34,6 +33,7 @@ export interface FormProps extends Omit<FormHTMLAttributes<HTMLFormElement>, "on
 export const Form = React.forwardRef<FormRef, FormProps>(
   ({ form, defaultValues, className, children, onSubmit, ...props }: FormProps, ref) => {
     const currentForm = form ?? useForm({ defaultValues });
+
     const slideOverContext = useContext(SlideOverContext);
 
     useImperativeHandle(ref, () => currentForm);
@@ -46,24 +46,10 @@ export const Form = React.forwardRef<FormRef, FormProps>(
       // Stop logic if there is no context to prevent the slide over close
       if (!slideOverContext?.setPreventClose) return;
 
-      const subscription = currentForm.watch((formData: Record<string, FormFieldValue>) => {
-        const updatedValue = Object.entries(formData).find(
-          ([key, field]: [string, FormFieldValue]) => {
-            const defaultValue = defaultValues && defaultValues[key];
-
-            return (defaultValue?.value || field.value) && defaultValue?.value !== field.value;
-          }
-        );
-
-        if (updatedValue && slideOverContext.setPreventClose) console.log("SET TRUE NOW");
-
-        slideOverContext.setPreventClose(true);
-      });
+      if (!currentForm.formState.isDirty) return;
 
-      return () => {
-        subscription.unsubscribe();
-      };
-    }, [currentForm.watch]);
+      slideOverContext?.setPreventClose(true);
+    }, [currentForm.formState.isDirty]);
 
     return (
       <FormProvider {...currentForm}>

From dd93cb8f92ddb5cada3d9387129d996abaea0dfc Mon Sep 17 00:00:00 2001
From: pa-lem <pa-lem@hotmail.fr>
Date: Tue, 24 Sep 2024 18:09:17 +0200
Subject: [PATCH 09/12] update changelog

---
 changelog/4419.added.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/changelog/4419.added.md b/changelog/4419.added.md
index 0c368b365e..bb8a830a81 100644
--- a/changelog/4419.added.md
+++ b/changelog/4419.added.md
@@ -1 +1 @@
-* Prevent form to be closed if the form has been updated
\ No newline at end of file
+* Prevent the form from being closed if there are unsaved changes.
\ No newline at end of file

From 2e9ab20d6b9ac2711df3be3dc167765a385cadb4 Mon Sep 17 00:00:00 2001
From: pa-lem <pa-lem@hotmail.fr>
Date: Tue, 24 Sep 2024 18:13:10 +0200
Subject: [PATCH 10/12] revert import

---
 frontend/app/src/components/filters/filters.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/app/src/components/filters/filters.tsx b/frontend/app/src/components/filters/filters.tsx
index 8f2a0a30a8..c88a9b6480 100644
--- a/frontend/app/src/components/filters/filters.tsx
+++ b/frontend/app/src/components/filters/filters.tsx
@@ -8,9 +8,9 @@ import { useState } from "react";
 import ObjectForm from "@/components/form/object-form";
 import usePagination from "@/hooks/usePagination";
 import { IModelSchema } from "@/state/atoms/schema.atom";
+import { getFiltersFromFormData } from "@/components/filters/utils/getFiltersFromFormData";
 import { FormFieldValue } from "@/components/form/type";
 import { getObjectFromFilters } from "@/components/filters/utils/getObjectFromFilters";
-import { getFiltersFromFormData } from "./utils/getFiltersFromFormData";
 
 type FiltersProps = {
   schema: IModelSchema;

From 6e61f672805d8917738a7b73cd232c74f82e3579 Mon Sep 17 00:00:00 2001
From: pa-lem <pa-lem@hotmail.fr>
Date: Tue, 24 Sep 2024 18:24:52 +0200
Subject: [PATCH 11/12] re arrange submit

---
 frontend/app/src/components/ui/form.tsx | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/frontend/app/src/components/ui/form.tsx b/frontend/app/src/components/ui/form.tsx
index df61a6615e..fec4d1d41d 100644
--- a/frontend/app/src/components/ui/form.tsx
+++ b/frontend/app/src/components/ui/form.tsx
@@ -59,13 +59,11 @@ export const Form = React.forwardRef<FormRef, FormProps>(
               event.stopPropagation();
             }
 
+            if (onSubmit) currentForm.handleSubmit(onSubmit)(event);
+
             if (slideOverContext?.setPreventClose) {
               slideOverContext?.setPreventClose(false);
             }
-
-            if (!onSubmit) return;
-
-            currentForm.handleSubmit(onSubmit)(event);
           }}
           className={classNames("space-y-4", className)}
           {...props}>

From f67b9b1ab10d6dda61a1ce6e5ec47750d3d88640 Mon Sep 17 00:00:00 2001
From: bilalabbad <bilal@opsmill.com>
Date: Tue, 24 Sep 2024 18:50:04 +0200
Subject: [PATCH 12/12] removed file not changed

---
 frontend/app/src/components/filters/filters.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/app/src/components/filters/filters.tsx b/frontend/app/src/components/filters/filters.tsx
index c88a9b6480..c4d8097fc8 100644
--- a/frontend/app/src/components/filters/filters.tsx
+++ b/frontend/app/src/components/filters/filters.tsx
@@ -37,14 +37,14 @@ export const Filters = ({ schema }: FiltersProps) => {
   const handleSubmit = (formData: Record<string, FormFieldValue>) => {
     const newFilters = getFiltersFromFormData(formData);
 
-    setShowFilters(false);
-
     setPagination({
       ...pagination,
       offset: 0,
     });
 
     setFilters(newFilters);
+
+    setShowFilters(false);
   };
 
   const currentFilters = filters.filter((filter) => !SEARCH_FILTERS.includes(filter.name));