Merge pull request #336 from GeoWerkstatt/fix-react-warnings

Fix react warnings
GeoWerkstatt · Feb 5, 2024 · 79cb148 · 79cb148
2 parents 3548abf + 5466b3f
commit 79cb148
Show file tree

Hide file tree

Showing 5 changed files with 50 additions and 48 deletions.
diff --git a/src/ClientApp/src/components/BohrprofilForm.js b/src/ClientApp/src/components/BohrprofilForm.js
@@ -61,7 +61,7 @@ export default function BohrprofilForm(props) {
   const [formationEndtiefeCodes, setFormationEndtiefeCodes] = useState([]);
   const [openSchichtConfirmation, setOpenSchichtConfirmation] = useState(false);
   const [openVorkommnisConfirmation, setOpenVorkommnisConfirmation] = useState(false);
-  const [selectedDate, setSelectedDate] = useState();
+  const [selectedDate, setSelectedDate] = useState(null);
 
   const currentBohrprofilIndex =
     currentBohrung.bohrprofile?.indexOf(currentBohrung.bohrprofile.find((b) => b.id === currentBohrprofil.id)) || 0;
@@ -253,7 +253,8 @@ export default function BohrprofilForm(props) {
                     sx: { marginRight: "6%", width: "47%" },
                     margin: "normal",
                     variant: "standard",
-                    ...register("datum"),
+                    name: "datum",
+                    ref: register("datum").ref,
                   },
                 }}
               />
@@ -265,7 +266,7 @@ export default function BohrprofilForm(props) {
               render={({ field }) => (
                 <TextField
                   {...field}
-                  value={field.value}
+                  value={field.value ?? ""}
                   InputLabelProps={{ shrink: field.value != null }}
                   margin="normal"
                   multiline
@@ -285,7 +286,7 @@ export default function BohrprofilForm(props) {
                 <TextField
                   {...field}
                   InputLabelProps={{ shrink: field.value != null }}
-                  value={field.value}
+                  value={field.value ?? ""}
                   sx={{ marginRight: "6%", width: "47%" }}
                   margin="normal"
                   label="Terrainkote der Bohrung [m ü. M.]"
@@ -303,7 +304,7 @@ export default function BohrprofilForm(props) {
                 <TextField
                   {...field}
                   InputLabelProps={{ shrink: field.value != null }}
-                  value={field.value}
+                  value={field.value ?? ""}
                   sx={{ width: "47%" }}
                   margin="normal"
                   label="Endtiefe der Bohrung [m u. T.]"
@@ -321,8 +322,8 @@ export default function BohrprofilForm(props) {
                 <Autocomplete
                   {...field}
                   options={formationFelsCodes.sort((a, b) => a.sortierung - b.sortierung).map((c) => c.id)}
-                  value={field.value}
-                  getOptionLabel={(option) => formationFelsCodes.find((c) => c.id === option)?.kurztext}
+                  value={field.value ?? null}
+                  getOptionLabel={(option) => formationFelsCodes.find((c) => c.id === option)?.kurztext ?? ""}
                   onChange={(_, data) => field.onChange(data)}
                   autoHighlight
                   fullWidth
@@ -346,8 +347,8 @@ export default function BohrprofilForm(props) {
                 <Autocomplete
                   {...field}
                   options={formationEndtiefeCodes.sort((a, b) => a.sortierung - b.sortierung).map((c) => c.id)}
-                  value={field.value}
-                  getOptionLabel={(option) => formationEndtiefeCodes.find((c) => c.id === option)?.kurztext}
+                  value={field.value ?? null}
+                  getOptionLabel={(option) => formationEndtiefeCodes.find((c) => c.id === option)?.kurztext ?? ""}
                   onChange={(_, data) => field.onChange(data)}
                   autoHighlight
                   fullWidth
@@ -373,8 +374,8 @@ export default function BohrprofilForm(props) {
                     {...field}
                     sx={{ marginRight: "6%", width: "47%" }}
                     options={tektonikCodes.sort((a, b) => a.kurztext.localeCompare(b.kurztext)).map((c) => c.id)}
-                    value={field.value}
-                    getOptionLabel={(option) => tektonikCodes.find((c) => c.id === option)?.kurztext}
+                    value={field.value ?? null}
+                    getOptionLabel={(option) => tektonikCodes.find((c) => c.id === option)?.kurztext ?? ""}
                     onChange={(_, data) => field.onChange(data)}
                     autoHighlight
                     renderInput={(params) => (
@@ -399,8 +400,8 @@ export default function BohrprofilForm(props) {
                     {...field}
                     sx={{ width: "47%" }}
                     options={qualitaetCodes.sort((a, b) => a.kurztext.localeCompare(b.kurztext)).map((c) => c.id)}
-                    value={field.value}
-                    getOptionLabel={(option) => qualitaetCodes.find((c) => c.id === option)?.kurztext}
+                    value={field.value ?? null}
+                    getOptionLabel={(option) => qualitaetCodes.find((c) => c.id === option)?.kurztext ?? ""}
                     onChange={(_, data) => field.onChange(data)}
                     autoHighlight
                     renderInput={(params) => (
@@ -423,7 +424,7 @@ export default function BohrprofilForm(props) {
               render={({ field }) => (
                 <TextField
                   {...field}
-                  value={field.value}
+                  value={field.value ?? ""}
                   InputLabelProps={{ shrink: field.value != null }}
                   margin="normal"
                   multiline

diff --git a/src/ClientApp/src/components/BohrungForm.js b/src/ClientApp/src/components/BohrungForm.js
@@ -58,7 +58,7 @@ export default function BohrungForm(props) {
   const [ablenkungCodes, setAblenkungCodes] = useState([]);
   const [qualitaetCodes, setQualitaetCodes] = useState([]);
   const [openConfirmation, setOpenConfirmation] = useState(false);
-  const [selectedDate, setSelectedDate] = useState();
+  const [selectedDate, setSelectedDate] = useState(null);
 
   const currentBohrungIndex =
     currentStandort.bohrungen?.indexOf(currentStandort.bohrungen.find((b) => b.id === currentBohrung?.id)) || 0;
@@ -235,7 +235,7 @@ export default function BohrungForm(props) {
                 <TextField
                   {...field}
                   autoFocus
-                  value={field.value}
+                  value={field.value ?? ""}
                   margin="normal"
                   label="Bezeichnung der Bohrung"
                   type="text"
@@ -254,7 +254,7 @@ export default function BohrungForm(props) {
               render={({ field }) => (
                 <TextField
                   {...field}
-                  value={field.value}
+                  value={field.value ?? ""}
                   margin="normal"
                   InputLabelProps={{ shrink: field.value != null }}
                   multiline
@@ -283,7 +283,8 @@ export default function BohrungForm(props) {
                     sx: { marginRight: "6%", width: "47%" },
                     margin: "normal",
                     variant: "standard",
-                    ...register("datum"),
+                    name: "datum",
+                    ref: register("datum").ref,
                   },
                 }}
               />
@@ -295,7 +296,7 @@ export default function BohrungForm(props) {
               render={({ field }) => (
                 <TextField
                   {...field}
-                  value={field.value}
+                  value={field.value ?? ""}
                   InputLabelProps={{ shrink: field.value != null }}
                   sx={{ width: "47%" }}
                   margin="normal"
@@ -315,9 +316,9 @@ export default function BohrungForm(props) {
                   <Autocomplete
                     {...field}
                     options={ablenkungCodes.sort((a, b) => a.kurztext.localeCompare(b.kurztext)).map((c) => c.id)}
-                    value={field.value}
+                    value={field.value ?? null}
                     onChange={(_, data) => field.onChange(data)}
-                    getOptionLabel={(option) => ablenkungCodes.find((c) => c.id === option)?.kurztext}
+                    getOptionLabel={(option) => ablenkungCodes.find((c) => c.id === option)?.kurztext ?? ""}
                     autoHighlight
                     sx={{ marginRight: "6%", width: "47%" }}
                     renderInput={(params) => (
@@ -340,8 +341,8 @@ export default function BohrungForm(props) {
                   <Autocomplete
                     {...field}
                     options={qualitaetCodes.sort((a, b) => a.kurztext.localeCompare(b.kurztext)).map((c) => c.id)}
-                    value={field.value}
-                    getOptionLabel={(option) => qualitaetCodes.find((c) => c.id === option)?.kurztext}
+                    value={field.value ?? null}
+                    getOptionLabel={(option) => qualitaetCodes.find((c) => c.id === option)?.kurztext ?? ""}
                     onChange={(_, data) => field.onChange(data)}
                     autoHighlight
                     sx={{ width: "47%" }}
@@ -365,7 +366,7 @@ export default function BohrungForm(props) {
               render={({ field }) => (
                 <TextField
                   {...field}
-                  value={field.value}
+                  value={field.value ?? ""}
                   InputLabelProps={{ shrink: field.value != null }}
                   fullWidth
                   margin="normal"
@@ -385,7 +386,7 @@ export default function BohrungForm(props) {
                 <TextField
                   {...field}
                   InputLabelProps={{ shrink: field.value != null }}
-                  value={field.value}
+                  value={field.value ?? ""}
                   margin="normal"
                   label="Autor der geologischen Aufnahme"
                   type="text"
@@ -419,7 +420,7 @@ export default function BohrungForm(props) {
                   sx={{ marginRight: "6%", width: "47%" }}
                   margin="normal"
                   InputLabelProps={{ shrink: field.value != null }}
-                  value={field.value}
+                  value={field.value ?? ""}
                   onChange={(value) => field.onChange(value)}
                   label="X-Koordinate der Bohrung"
                   type="number"
@@ -448,7 +449,7 @@ export default function BohrungForm(props) {
                   sx={{ width: "47%" }}
                   margin="normal"
                   InputLabelProps={{ shrink: field.value != null }}
-                  value={field.value}
+                  value={field.value ?? ""}
                   onChange={(value) => field.onChange(value)}
                   label="Y-Koordinate der Bohrung"
                   type="number"

diff --git a/src/ClientApp/src/components/SchichtForm.js b/src/ClientApp/src/components/SchichtForm.js
@@ -111,7 +111,7 @@ export default function SchichtForm(props) {
               render={({ field, fieldState: { error } }) => (
                 <TextField
                   {...field}
-                  value={field.value}
+                  value={field.value ?? ""}
                   sx={{ width: "47%" }}
                   margin="normal"
                   label="Tiefe [m u. T.]"
@@ -133,8 +133,8 @@ export default function SchichtForm(props) {
                   {...field}
                   sx={{ width: "47%" }}
                   options={codeSchichten.map((c) => c.id).sort((a, b) => a - b)}
-                  value={field.value}
-                  getOptionLabel={(option) => codeSchichten.find((c) => c.id === option)?.text}
+                  value={field.value ?? null}
+                  getOptionLabel={(option) => codeSchichten.find((c) => c.id === option)?.text ?? ""}
                   onChange={(_, data) => field.onChange(data)}
                   autoHighlight
                   renderInput={(params) => (
@@ -159,7 +159,7 @@ export default function SchichtForm(props) {
                 <TextField
                   {...field}
                   InputLabelProps={{ shrink: field.value != null }}
-                  value={field.value}
+                  value={field.value ?? ""}
                   margin="normal"
                   multiline
                   label="Bemerkungen zur Schicht"
@@ -178,8 +178,8 @@ export default function SchichtForm(props) {
                 <Autocomplete
                   {...field}
                   options={qualitaetCodes.sort((a, b) => a.kurztext.localeCompare(b.kurztext)).map((c) => c.id)}
-                  value={field.value}
-                  getOptionLabel={(option) => qualitaetCodes.find((c) => c.id === option)?.kurztext}
+                  value={field.value ?? null}
+                  getOptionLabel={(option) => qualitaetCodes.find((c) => c.id === option)?.kurztext ?? ""}
                   onChange={(_, data) => field.onChange(data)}
                   sx={{ width: "47%" }}
                   autoHighlight
@@ -197,7 +197,7 @@ export default function SchichtForm(props) {
                 <TextField
                   {...field}
                   InputLabelProps={{ shrink: field.value != null }}
-                  value={field.value}
+                  value={field.value ?? ""}
                   margin="normal"
                   multiline
                   label="Bemerkungen zur Qualitätsangabe"

diff --git a/src/ClientApp/src/components/StandortForm.js b/src/ClientApp/src/components/StandortForm.js
@@ -128,7 +128,7 @@ export default function StandortForm(props) {
               render={({ field, fieldState: { error } }) => (
                 <TextField
                   {...field}
-                  value={field.value}
+                  value={field.value ?? ""}
                   autoFocus
                   margin="normal"
                   label="Bezeichnung des Standorts"
@@ -148,7 +148,7 @@ export default function StandortForm(props) {
               render={({ field }) => (
                 <TextField
                   {...field}
-                  value={field.value}
+                  value={field.value ?? ""}
                   margin="normal"
                   label="Bemerkung zum Standort"
                   type="text"
@@ -161,15 +161,15 @@ export default function StandortForm(props) {
             />
             <React.Fragment>
               <TextField
-                value={currentStandort?.gemeinde}
+                value={currentStandort?.gemeinde ?? ""}
                 fullWidth
                 type="text"
                 disabled
                 variant="standard"
                 label="Gemeinde"
               />
               <TextField
-                value={currentStandort?.grundbuchNr}
+                value={currentStandort?.grundbuchNr ?? ""}
                 fullWidth
                 type="text"
                 inputProps={{
@@ -194,6 +194,7 @@ export default function StandortForm(props) {
                         defaultValue={currentStandort?.freigabeAfu ?? false}
                         render={({ field }) => (
                           <Checkbox
+                            {...register("freigabeAfu")}
                             {...field}
                             checked={field.value}
                             onChange={(e) => {
@@ -202,15 +203,14 @@ export default function StandortForm(props) {
                             }}
                           />
                         )}
-                        {...register("freigabeAfu")}
                       />
                     }
                   />
                 </FormGroup>
               )}
               <React.Fragment>
                 <TextField
-                  value={currentStandort?.afuUser}
+                  value={currentStandort?.afuUser ?? ""}
                   InputLabelProps={{ shrink: afuFreigabe }}
                   sx={{ marginRight: "6%", width: "47%" }}
                   disabled
@@ -223,7 +223,7 @@ export default function StandortForm(props) {
 
                 <TextField
                   name="afuDatum"
-                  value={currentStandort?.afuDatum ? new Date(currentStandort.afuDatum).toLocaleDateString() : null}
+                  value={currentStandort?.afuDatum ? new Date(currentStandort.afuDatum).toLocaleDateString() : ""}
                   InputLabelProps={{ shrink: afuFreigabe }}
                   disabled
                   sx={{ width: "47%" }}

diff --git a/src/ClientApp/src/components/VorkommnisForm.js b/src/ClientApp/src/components/VorkommnisForm.js
@@ -112,7 +112,7 @@ export default function VorkommnisForm(props) {
               render={({ field }) => (
                 <TextField
                   {...field}
-                  value={field.value}
+                  value={field.value ?? ""}
                   sx={{ width: "47%" }}
                   margin="normal"
                   label="Tiefe [m u. T.]"
@@ -132,8 +132,8 @@ export default function VorkommnisForm(props) {
                   {...field}
                   sx={{ width: "47%" }}
                   options={typCodes.sort((a, b) => a.kurztext.localeCompare(b.kurztext)).map((c) => c.id)}
-                  value={field.value}
-                  getOptionLabel={(option) => typCodes.find((c) => c.id === option)?.kurztext}
+                  value={field.value ?? null}
+                  getOptionLabel={(option) => typCodes.find((c) => c.id === option)?.kurztext ?? ""}
                   onChange={(_, data) => field.onChange(data)}
                   autoHighlight
                   renderInput={(params) => (
@@ -158,7 +158,7 @@ export default function VorkommnisForm(props) {
                 <TextField
                   {...field}
                   InputLabelProps={{ shrink: field.value != null }}
-                  value={field.value}
+                  value={field.value ?? ""}
                   margin="normal"
                   multiline
                   label="Bemerkungen zum Vorkommnis"
@@ -177,8 +177,8 @@ export default function VorkommnisForm(props) {
                 <Autocomplete
                   {...field}
                   options={qualitaetCodes.sort((a, b) => a.kurztext.localeCompare(b.kurztext)).map((c) => c.id)}
-                  value={field.value}
-                  getOptionLabel={(option) => qualitaetCodes.find((c) => c.id === option)?.kurztext}
+                  value={field.value ?? null}
+                  getOptionLabel={(option) => qualitaetCodes.find((c) => c.id === option)?.kurztext ?? ""}
                   onChange={(_, data) => field.onChange(data)}
                   sx={{ width: "47%" }}
                   autoHighlight
@@ -196,7 +196,7 @@ export default function VorkommnisForm(props) {
                 <TextField
                   {...field}
                   InputLabelProps={{ shrink: field.value != null }}
-                  value={field.value}
+                  value={field.value ?? ""}
                   margin="normal"
                   multiline
                   label="Bemerkungen zur Qualitätsangabe"