Set active flight from page ID

This commit is contained in:
april 2024-01-18 14:20:56 -06:00
parent aa91f284e0
commit 6a08472392

View File

@ -32,14 +32,12 @@ import { useEffect, useRef, useState } from "react";
function FlightsListDisplay({ function FlightsListDisplay({
flights, flights,
page,
}: { }: {
flights: UseQueryResult<{ flights: UseQueryResult<{
[year: string]: { [year: string]: {
[month: string]: { [day: string]: FlightConciseSchema[] }; [month: string]: { [day: string]: FlightConciseSchema[] };
}; };
}>; }>;
page: string;
}) { }) {
const monthNames = [ const monthNames = [
"January", "January",
@ -180,7 +178,7 @@ function FlightsListDisplay({
</Badge> </Badge>
) : null ) : null
} }
active={page === flight.id} active={params.id === flight.id}
/> />
<Divider /> <Divider />
</> </>
@ -287,9 +285,6 @@ export function FlightsList() {
} }
export function MobileFlightsList() { export function MobileFlightsList() {
const location = useLocation();
const page = location.pathname.split("/")[3];
const [aircraft, setAircraft] = useState(""); const [aircraft, setAircraft] = useState("");
const client = useApi(); const client = useApi();
@ -313,7 +308,7 @@ export function MobileFlightsList() {
return ( return (
<Stack p="0" m="0" justify="space-between" h="calc(100vh - 95px)"> <Stack p="0" m="0" justify="space-between" h="calc(100vh - 95px)">
<ScrollArea h="calc(100vh - 95px - 50px" ref={scrollAreaRef}> <ScrollArea h="calc(100vh - 95px - 50px" ref={scrollAreaRef}>
<FlightsListDisplay flights={flights} page={page} /> <FlightsListDisplay flights={flights} />
</ScrollArea>{" "} </ScrollArea>{" "}
<Group grow preventGrowOverflow={false} wrap="nowrap"> <Group grow preventGrowOverflow={false} wrap="nowrap">
<AircraftFilter aircraft={aircraft} setAircraft={setAircraft} /> <AircraftFilter aircraft={aircraft} setAircraft={setAircraft} />