Expose allFlights array from useFlightDetails for mini-list sidebar

This commit is contained in:
2026-04-16 23:23:18 +03:00
parent 8a2ece333a
commit 58215a4bf0
2 changed files with 167 additions and 8 deletions
@@ -0,0 +1,154 @@
// @vitest-environment jsdom
import { describe, it, expect, vi, beforeEach } from "vitest";
import { renderHook, waitFor } from "@testing-library/react";
import { useFlightDetails } from "./useFlightDetails.js";
import type { IBoardResponse, ISimpleFlight } from "../types.js";
const mockClient = { get: vi.fn() };
vi.mock("@/shared/api/provider.js", () => ({
useApiClient: () => mockClient,
}));
vi.mock("../api.js", async () => {
const actual = await vi.importActual<typeof import("../api.js")>("../api.js");
return {
...actual,
getFlightDetails: (_client: unknown, _params: unknown) => mockClient.get(),
};
});
function makeFlight(id: string): ISimpleFlight {
return {
id,
routeType: "Direct",
flyingTime: "1h",
status: "Scheduled",
flightId: {
carrier: "SU",
flightNumber: "0022",
suffix: "",
date: "20260416",
},
operatingBy: {},
leg: {
arrival: {
scheduled: {
airport: "",
airportCode: "",
city: "",
cityCode: "",
countryCode: "",
},
latest: {
airport: "",
airportCode: "",
city: "",
cityCode: "",
countryCode: "",
},
dispatch: "",
gate: "",
terminal: "",
times: {
scheduledArrival: {
dayChange: { value: 0, title: "" },
local: "",
localTime: "",
tzOffset: 0,
utc: "",
},
},
},
dayChange: 0,
departure: {
scheduled: {
airport: "",
airportCode: "",
city: "",
cityCode: "",
countryCode: "",
},
latest: {
airport: "",
airportCode: "",
city: "",
cityCode: "",
countryCode: "",
},
dispatch: "",
gate: "",
terminal: "",
checkingStatus: "Scheduled",
parkingStand: "",
times: {
scheduledDeparture: {
dayChange: { value: 0, title: "" },
local: "",
localTime: "",
tzOffset: 0,
utc: "",
},
},
},
equipment: {},
flags: {
checkinAvailable: false,
returnToAirport: false,
routeChanged: false,
},
flyingTime: "1h",
index: 0,
operatingBy: {},
status: "Scheduled",
updated: "",
},
} as unknown as ISimpleFlight;
}
describe("useFlightDetails", () => {
beforeEach(() => {
mockClient.get.mockReset();
});
it("returns first flight and full array in allFlights", async () => {
const response: IBoardResponse = {
data: {
partners: [],
routes: [
makeFlight("SU0022-20260416"),
makeFlight("SU0022-20260417"),
makeFlight("SU0022-20260418"),
],
daysOfFlight: [],
},
};
mockClient.get.mockResolvedValue(response);
const { result } = renderHook(() =>
useFlightDetails({ flights: "SU0022", dates: "2026-04-16" }),
);
await waitFor(() => expect(result.current.loading).toBe(false));
expect(result.current.flight?.id).toBe("SU0022-20260416");
expect(result.current.allFlights).toHaveLength(3);
expect(result.current.allFlights[0]?.id).toBe("SU0022-20260416");
});
it("returns empty allFlights array when response has no routes", async () => {
const response: IBoardResponse = {
data: { partners: [], routes: [], daysOfFlight: [] },
};
mockClient.get.mockResolvedValue(response);
const { result } = renderHook(() =>
useFlightDetails({ flights: "SU0022", dates: "2026-04-16" }),
);
await waitFor(() => expect(result.current.loading).toBe(false));
expect(result.current.flight).toBeNull();
expect(result.current.allFlights).toEqual([]);
});
});
@@ -2,7 +2,8 @@
* React hook for the flight details page.
*
* Calls `getFlightDetails` on param change, manages loading/error/data state.
* Thin wrapper — integration-tested by 2E/2H, not unit-tested here.
* Returns both the first flight (for primary display) and the full routes
* array (for the mini-list sidebar).
*
* @module
*/
@@ -16,19 +17,20 @@ import type { ApiError } from "@/shared/api/errors.js";
export interface UseFlightDetailsResult {
flight: ISimpleFlight | null;
allFlights: ISimpleFlight[];
loading: boolean;
error: ApiError | null;
}
/**
* Hook for the flight details page. Fetches a single flight's details
* based on flight ID params.
* Hook for the flight details page. Fetches the details response and exposes
* both the first route (primary flight) and the full routes array.
*/
export function useFlightDetails(
params: FlightDetailsParams,
): UseFlightDetailsResult {
const client = useApiClient();
const [flight, setFlight] = useState<ISimpleFlight | null>(null);
const [allFlights, setAllFlights] = useState<ISimpleFlight[]>([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<ApiError | null>(null);
@@ -43,9 +45,7 @@ export function useFlightDetails(
getFlightDetails(client, paramsRef.current)
.then((response) => {
if (!cancelled) {
// Details endpoint returns a board response; take the first route
const firstFlight = response.data.routes[0] ?? null;
setFlight(firstFlight);
setAllFlights(response.data.routes);
setLoading(false);
}
})
@@ -61,5 +61,10 @@ export function useFlightDetails(
};
}, [client, params.flights, params.dates]);
return { flight, loading, error };
return {
flight: allFlights[0] ?? null,
allFlights,
loading,
error,
};
}