From 3e025ec2f5616f1167678b2e08aa5692d70f8b54 Mon Sep 17 00:00:00 2001
From: MiraGeowerkstatt <mira.bleuler@geowerkstatt.ch>
Date: Mon, 21 Oct 2024 10:15:31 +0200
Subject: [PATCH] Fix style of workgroup select and bulkedit form after
 changing textfield label style

---
 .../bulkedit/bulkEditForm.tsx                 | 32 +++++++++----------
 .../overview/boreholeTable/bottomBar.tsx      |  2 +-
 .../commons/actionsInterfaces.ts              |  1 +
 .../commons/workgroupSelect.tsx               |  6 ++--
 4 files changed, 21 insertions(+), 20 deletions(-)

diff --git a/src/client/src/components/legacyComponents/bulkedit/bulkEditForm.tsx b/src/client/src/components/legacyComponents/bulkedit/bulkEditForm.tsx
index 2d25c89c2..42621e738 100644
--- a/src/client/src/components/legacyComponents/bulkedit/bulkEditForm.tsx
+++ b/src/client/src/components/legacyComponents/bulkedit/bulkEditForm.tsx
@@ -149,13 +149,12 @@ export const BulkEditForm = ({ selected, loadBoreholes }: BulkEditFormProps) =>
 
   const renderInput = useCallback(
     (field: BulkEditFormField) => {
-      if (field.type === FormValueType.Workgroup) return;
       if (field.type === FormValueType.Domain) {
         return (
           <FormDomainSelect
             canReset={false}
             fieldName={field.api ?? field.fieldName}
-            label={field.fieldName}
+            label=""
             schemaName={field?.domain ?? field.api ?? field.fieldName}
             onUpdate={e => {
               onFieldValueChange(field, e);
@@ -169,17 +168,27 @@ export const BulkEditForm = ({ selected, loadBoreholes }: BulkEditFormProps) =>
           <FormBooleanSelect
             canReset={false}
             fieldName={field.api ?? field.fieldName}
-            label={field.fieldName}
+            label=""
             onUpdate={e => {
               onFieldValueChange(field, e);
             }}
           />
         );
       }
+      if (field.fieldName === FormValueType.Workgroup) {
+        return (
+          <WorkgroupSelect
+            workgroupId={workgroupId}
+            enabledWorkgroups={enabledWorkgroups}
+            setWorkgroupId={setWorkgroupId}
+            hideLabel={true}
+          />
+        );
+      }
       return (
         <FormInput
           fieldName={field.api ?? field.fieldName}
-          label={field.fieldName}
+          label=""
           type={field.type}
           onUpdate={e => {
             onFieldValueChange(field, e);
@@ -187,7 +196,7 @@ export const BulkEditForm = ({ selected, loadBoreholes }: BulkEditFormProps) =>
         />
       );
     },
-    [onFieldValueChange],
+    [onFieldValueChange, workgroupId, enabledWorkgroups],
   );
 
   return (
@@ -235,18 +244,9 @@ export const BulkEditForm = ({ selected, loadBoreholes }: BulkEditFormProps) =>
                         </Typography>
                       </Stack>
                     </AccordionSummary>
-                    <AccordionDetails sx={{ pl: 5, pr: 3 }}>
+                    <AccordionDetails sx={{ pl: 5, pr: 3, mt: -4 }}>
                       <StackFullWidth>
-                        <>
-                          {renderInput(field)}
-                          {field.fieldName === FormValueType.Workgroup && (
-                            <WorkgroupSelect
-                              workgroupId={workgroupId}
-                              enabledWorkgroups={enabledWorkgroups}
-                              setWorkgroupId={setWorkgroupId}
-                            />
-                          )}
-                        </>
+                        <>{renderInput(field)}</>
                       </StackFullWidth>
                     </AccordionDetails>
                   </Accordion>
diff --git a/src/client/src/pages/overview/boreholeTable/bottomBar.tsx b/src/client/src/pages/overview/boreholeTable/bottomBar.tsx
index 46cff10d3..5cf66a6a7 100644
--- a/src/client/src/pages/overview/boreholeTable/bottomBar.tsx
+++ b/src/client/src/pages/overview/boreholeTable/bottomBar.tsx
@@ -63,7 +63,7 @@ const BottomBar = ({
           workgroupId={workgroup}
           enabledWorkgroups={enabledWorkgroups}
           setWorkgroupId={setWorkgroup}
-          sx={{ pt: 4, pb: 3 }}
+          sx={{ pt: 6, pb: 3 }}
         />,
       );
     }
diff --git a/src/client/src/pages/overview/sidePanelContent/commons/actionsInterfaces.ts b/src/client/src/pages/overview/sidePanelContent/commons/actionsInterfaces.ts
index 42ab82357..dbf3dde08 100644
--- a/src/client/src/pages/overview/sidePanelContent/commons/actionsInterfaces.ts
+++ b/src/client/src/pages/overview/sidePanelContent/commons/actionsInterfaces.ts
@@ -12,6 +12,7 @@ export interface WorkgroupSelectProps {
   workgroupId: number | null;
   enabledWorkgroups: Workgroup[];
   setWorkgroupId: React.Dispatch<React.SetStateAction<number | null>>;
+  hideLabel?: boolean;
   sx?: SxProps;
 }
 
diff --git a/src/client/src/pages/overview/sidePanelContent/commons/workgroupSelect.tsx b/src/client/src/pages/overview/sidePanelContent/commons/workgroupSelect.tsx
index a5b1b7cd0..20ae17745 100644
--- a/src/client/src/pages/overview/sidePanelContent/commons/workgroupSelect.tsx
+++ b/src/client/src/pages/overview/sidePanelContent/commons/workgroupSelect.tsx
@@ -3,11 +3,11 @@ import { Box, FormControl, InputLabel, MenuItem, Select } from "@mui/material/";
 import { theme } from "../../../../AppTheme.ts";
 import { WorkgroupSelectProps } from "./actionsInterfaces.ts";
 
-const WorkgroupSelect = ({ workgroupId, enabledWorkgroups, setWorkgroupId, sx }: WorkgroupSelectProps) => {
+const WorkgroupSelect = ({ workgroupId, enabledWorkgroups, setWorkgroupId, sx, hideLabel }: WorkgroupSelectProps) => {
   const { t } = useTranslation();
   return (
     <>
-      <Box sx={{ ...sx, backgroundColor: theme.palette.background.default }}>
+      <Box sx={{ pt: 2, backgroundColor: theme.palette.background.default, ...sx }}>
         {(() => {
           const wg = enabledWorkgroups;
           if (wg === undefined) {
@@ -27,7 +27,7 @@ const WorkgroupSelect = ({ workgroupId, enabledWorkgroups, setWorkgroupId, sx }:
             }));
           return (
             <FormControl variant="outlined" sx={{ width: "100%" }}>
-              <InputLabel id="workgroup-label">{t("workgroup")}</InputLabel>
+              {!hideLabel && <InputLabel id="workgroup-label">{t("workgroup")}</InputLabel>}
               <Select
                 size="small"
                 label={t("workgroup")}