✅ - test: attempt to fix the tests

Author: svenvandescheur

backend/src/openarchiefbeheer/destruction/tests/e2e/features/test_feature_list_process_review.py

@@ -68,7 +68,7 @@ async def test_scenario_record_manager_process_review(self):
 
             # Fill archive date
             await self.when.user_clicks_radio(page, "Verlengen bewaartermijn")
-            await self.when.user_fills_form_field(page, "Archief datum", "09/15/2023")
+            await self.when.user_fills_form_field(page, "Dag van de maand", "09/15/2023")
             await page.keyboard.press("Enter")
 
             await self.when.user_fills_form_field(page, "Reden", "Andere datum")

frontend/src/pages/destructionlist/detail/hooks/useFormDialog.tsx

@@ -48,22 +48,27 @@ export const useFormDialog = () => {
         {typeof message === "string" ? <P>{message}</P> : message}
         <Form
           fields={fields}
+          justify="stretch"
           labelSubmit={labelConfirm}
           secondaryActions={[
             {
               children: labelCancel,
               type: "button",
               variant: "secondary",
-              onClick: () => {
-                setModalProps({ open: false });
+              onClick: (e: React.MouseEvent<HTMLButtonElement>) => {
+                e.preventDefault();
+                e.stopPropagation();
                 onCancel?.();
+                setModalProps({ open: false });
               },
             },
           ]}
           validateOnChange={true}
-          onSubmit={(_, data) => {
-            setModalProps({ open: false });
+          onSubmit={(e, data) => {
+            e.preventDefault();
+            e.stopPropagation();
             onConfirm(data);
+            setModalProps({ open: false });
           }}
           {...formProps}
         />

frontend/src/pages/destructionlist/hooks/useFields.ts

@@ -72,15 +72,22 @@ export function useFields(
     {
       name: "startdatum",
       type: "daterange",
-      filterValue: `${searchParams.get("startdatum__gte")}/${searchParams.get("startdatum__lte")}`,
+      filterValue:
+        searchParams.get("startdatum__gte") &&
+        searchParams.get("startdatum__lte")
+          ? `${searchParams.get("startdatum__gte")}/${searchParams.get("startdatum__lte")}`
+          : undefined,
       valueTransform: (rowData) =>
         rowData.startdatum ? formatDate(rowData.startdatum as string) : "",
       width: "150px",
     },
     {
       name: "einddatum",
       type: "daterange",
-      filterValue: `${searchParams.get("einddatum__gte")}/${searchParams.get("einddatum__lte")}`,
+      filterValue:
+        searchParams.get("einddatum__gte") && searchParams.get("einddatum__lte")
+          ? `${searchParams.get("einddatum__gte")}/${searchParams.get("einddatum__lte")}`
+          : undefined,
       valueTransform: (rowData) =>
         rowData.einddatum ? formatDate(rowData.einddatum as string) : "",
       width: "150px",
@@ -137,7 +144,11 @@ export function useFields(
       name: "archiefactiedatum",
       type: "daterange",
       width: "130px",
-      filterValue: `${searchParams.get("archiefactiedatum__gte")}/${searchParams.get("archiefactiedatum__lte")}`,
+      filterValue:
+        searchParams.get("archiefactiedatum__gte") &&
+        searchParams.get("archiefactiedatum__lte")
+          ? `${searchParams.get("archiefactiedatum__gte")}/${searchParams.get("archiefactiedatum__lte")}`
+          : undefined,
       valueTransform: (rowData) =>
         rowData.archiefactiedatum
           ? formatDate(rowData.archiefactiedatum as string)