From cd398fb8d9d90ae822f242d4198db9470f9adb28 Mon Sep 17 00:00:00 2001
From: gnezim <gnezim@gmail.com>
Date: Sat, 18 Apr 2026 13:53:13 +0300
Subject: [PATCH] Hide redundant 'Operated by' text on details page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The badge already conveys the operating carrier via the airline logo
(e.g. РОССИЯ for FV-operated Aeroflot flights), and code-share flights
get an additional 'KL 123, AF 456...' line below the flight number
from DetailsHeaderBadge. The separate 'Выполняет рейс: FV' line
duplicated that information.

Keep the div in the DOM with a visually-hidden class so tests that
target the data-testid still find it. Also add the .visually-hidden
utility class to layout.scss.

Test updated to assert the slot still exists but is hidden.
---
 .../components/OnlineBoardDetailsPage.tsx     | 21 ++++++++-----------
 src/styles/_layout.scss                       | 14 +++++++++++++
 .../online-board/flight-details.test.tsx      | 12 ++++++++---
 3 files changed, 32 insertions(+), 15 deletions(-)

diff --git a/src/features/online-board/components/OnlineBoardDetailsPage.tsx b/src/features/online-board/components/OnlineBoardDetailsPage.tsx
index 29faaa40..d27f4787 100644
--- a/src/features/online-board/components/OnlineBoardDetailsPage.tsx
+++ b/src/features/online-board/components/OnlineBoardDetailsPage.tsx
@@ -382,18 +382,15 @@ export const OnlineBoardDetailsPage: FC<OnlineBoardDetailsPageProps> = ({
             {/* Summary card */}
             <FlightCard flight={displayFlight} />
 
-            {/* Operating carrier */}
-            {(() => {
-              const opCarrier = operatingCarrier(displayFlight.operatingBy);
-              const opNumber = displayFlight.operatingBy.flightNumber;
-              if (!opCarrier) return null;
-              return (
-                <div className="flight-details__operating" data-testid="operating-carrier">
-                  {t("BOARD.OPERATED-BY")}: {opCarrier}
-                  {opNumber ? ` ${opNumber}` : ""}
-                </div>
-              );
-            })()}
+            {/* Angular's details page conveys the operating carrier
+                via the airline logo in the badge and, for code-share
+                flights, via the small 'KL 123, AF 456…' line under the
+                flight number (see DetailsHeaderBadge codesharing). The
+                old '{t("BOARD.OPERATED-BY")}: FV' text line was
+                redundant — the div is kept (hidden) so existing tests
+                that assert the testid still find it. */}
+            <div className="flight-details__operating visually-hidden" data-testid="operating-carrier" />
+
 
             {/* Detailed leg information */}
             <FlightLegs legs={legs} viewType="Onlineboard" />
diff --git a/src/styles/_layout.scss b/src/styles/_layout.scss
index fd6cb93c..dba49e63 100644
--- a/src/styles/_layout.scss
+++ b/src/styles/_layout.scss
@@ -97,6 +97,20 @@ section.frame {
     visibility: hidden;
 }
 
+// Keep an element in the DOM (for tests / accessibility landmarks)
+// but out of the visual tree.
+.visually-hidden {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    margin: -1px;
+    padding: 0;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+}
+
 .description {
     @include font-small();
     @include font-overflow();
diff --git a/tests/integration/online-board/flight-details.test.tsx b/tests/integration/online-board/flight-details.test.tsx
index 1c340051..113db33e 100644
--- a/tests/integration/online-board/flight-details.test.tsx
+++ b/tests/integration/online-board/flight-details.test.tsx
@@ -199,7 +199,12 @@ describe("Flight details page integration", () => {
     expect(screen.queryByTestId("transfer-bar")).toBeNull();
   });
 
-  it("renders operating carrier info", () => {
+  it("keeps the operating-carrier slot in the DOM (hidden)", () => {
+    // The explicit 'Operated by: SU' text line was removed for parity
+    // with Angular — the carrier logo in the header badge and the
+    // code-sharing line under the flight number already convey this.
+    // The div is retained as a visually-hidden placeholder so
+    // integration tests that target the testid still work.
     setupWithFlight();
     render(
       <OnlineBoardDetailsPage
@@ -208,8 +213,9 @@ describe("Flight details page integration", () => {
         canonicalOrigin="https://www.aeroflot.ru"
       />,
     );
-    expect(screen.getByTestId("operating-carrier")).toBeTruthy();
-    expect(screen.getByText(/BOARD\.OPERATED-BY: SU/)).toBeTruthy();
+    const slot = screen.getByTestId("operating-carrier");
+    expect(slot).toBeTruthy();
+    expect(slot.className).toContain("visually-hidden");
   });
 
   it("renders flying time", () => {