fix: Endlosschleife im DateRangePicker behoben und Initialwerte aus Redux gesetzt
- `useEffect` entfernt, um unnötige `setState`-Aufrufe zu vermeiden - `startDate` und `endDate` werden nun direkt über `useState` aus Redux (`vonDatum`, `bisDatum`) initialisiert - Verhindert unendliche Updates durch sich wiederholende `setStartDate`- und `setEndDate`-Aufrufe - Falls keine Redux-Werte vorhanden sind, wird das aktuelle Datum als Fallback verwendet
This commit is contained in:
@@ -1,6 +1,8 @@
|
||||
// /components/modules/kue705FO/charts/DateRangePicker.tsx
|
||||
import React, { useState, useEffect } from "react";
|
||||
import React, { useState } from "react";
|
||||
import DatePicker from "react-datepicker";
|
||||
import { useSelector } from "react-redux";
|
||||
import { RootState } from "../../../../../redux/store";
|
||||
import "react-datepicker/dist/react-datepicker.css";
|
||||
|
||||
interface DateRangePickerProps {
|
||||
@@ -12,14 +14,21 @@ const DateRangePicker: React.FC<DateRangePickerProps> = ({
|
||||
setVonDatum,
|
||||
setBisDatum,
|
||||
}) => {
|
||||
// Nutze die Props als Standardwerte für das Datum
|
||||
const [startDate, setStartDate] = useState<Date>(new Date());
|
||||
const [endDate, setEndDate] = useState<Date>(new Date());
|
||||
// Redux-Werte abrufen
|
||||
const reduxVonDatum = useSelector(
|
||||
(state: RootState) => state.kabelueberwachungChart.vonDatum
|
||||
);
|
||||
const reduxBisDatum = useSelector(
|
||||
(state: RootState) => state.kabelueberwachungChart.bisDatum
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
setVonDatum(startDate);
|
||||
setBisDatum(endDate);
|
||||
}, []);
|
||||
// Direkt mit Redux-Werten initialisieren, falls vorhanden
|
||||
const [startDate, setStartDate] = useState<Date>(
|
||||
reduxVonDatum ? new Date(reduxVonDatum) : new Date()
|
||||
);
|
||||
const [endDate, setEndDate] = useState<Date>(
|
||||
reduxBisDatum ? new Date(reduxBisDatum) : new Date()
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="flex space-x-4">
|
||||
@@ -54,7 +63,7 @@ const DateRangePicker: React.FC<DateRangePickerProps> = ({
|
||||
selectsEnd
|
||||
startDate={startDate}
|
||||
endDate={endDate}
|
||||
minDate={startDate || undefined}
|
||||
minDate={startDate}
|
||||
dateFormat="dd.MM.yyyy"
|
||||
className="border px-2 py-1 rounded"
|
||||
/>
|
||||
|
||||
@@ -6,5 +6,5 @@
|
||||
2: Patch oder Hotfix (Bugfixes oder kleine Änderungen).
|
||||
|
||||
*/
|
||||
const webVersion = "1.6.78";
|
||||
const webVersion = "1.6.79";
|
||||
export default webVersion;
|
||||
|
||||
Reference in New Issue
Block a user