Keep online board time range in sync

src/features/online-board/components/OnlineBoardFilter.test.tsx

@@ -271,6 +271,33 @@ describe("OnlineBoardFilter – time slider 1h minimum gap per TZ §4.1.9 Tables
     const value = screen.getByTestId("time-selector").querySelector(".time-selector__value");
     expect(value?.textContent).toBe("23:00 — 24:00");
   });
+
+  it("TIRREDESIGN-11: syncs the slider label when URL time params change", () => {
+    const { rerender } = render(
+      <OnlineBoardFilter
+        initialTab="route"
+        initialTimeFrom="0900"
+        initialTimeTo="2100"
+      />,
+    );
+
+    const value = screen.getByTestId("time-selector").querySelector(".time-selector__value");
+    expect(value?.textContent).toBe("09:00 — 21:00");
+
+    rerender(
+      <OnlineBoardFilter
+        initialTab="route"
+        initialTimeFrom="1400"
+        initialTimeTo="1800"
+      />,
+    );
+
+    expect(value?.textContent).toBe("14:00 — 18:00");
+
+    rerender(<OnlineBoardFilter initialTab="route" />);
+
+    expect(value?.textContent).toBe("00:00 — 24:00");
+  });
 });
 
 describe("OnlineBoardFilter – submit lock", () => {

src/features/online-board/components/OnlineBoardFilter.tsx

@@ -344,6 +344,8 @@ export const OnlineBoardFilter: FC<OnlineBoardFilterProps> = ({
     date: initialDate,
     tab: initialTab,
     flightNumber: initialFlightNumber,
+    timeFrom: initialTimeFrom,
+    timeTo: initialTimeTo,
   });
   useEffect(() => {
     const prev = lastInitialRef.current;
@@ -365,14 +367,30 @@ export const OnlineBoardFilter: FC<OnlineBoardFilterProps> = ({
     if (prev.flightNumber !== initialFlightNumber) {
       setFlightNumber(initialFlightNumber ?? "");
     }
+    if (prev.timeFrom !== initialTimeFrom || prev.timeTo !== initialTimeTo) {
+      setTimeRange([
+        hhmmToMinutes(initialTimeFrom, 0),
+        hhmmToMinutes(initialTimeTo, 1440),
+      ]);
+    }
     lastInitialRef.current = {
       departure: initialDeparture,
       arrival: initialArrival,
       date: initialDate,
       tab: initialTab,
       flightNumber: initialFlightNumber,
+      timeFrom: initialTimeFrom,
+      timeTo: initialTimeTo,
     };
-  }, [initialDeparture, initialArrival, initialDate, initialTab, initialFlightNumber]);
+  }, [
+    initialDeparture,
+    initialArrival,
+    initialDate,
+    initialTab,
+    initialFlightNumber,
+    initialTimeFrom,
+    initialTimeTo,
+  ]);
 
   const handleTabClick = useCallback((tab: AccordionTab) => {
     setActiveTab((prev) => (prev === tab ? prev : tab));