-
{label}
+ {hint ?
{text} : text}
{disabled
?
{'—'}
:
}
@@ -281,6 +288,7 @@ export default function RoadtripLimitsCard({ onSave, onResetDayBoundaries, loadi
// days gets the dialog with the trip's figures in it, not a form that takes a number
// and drops it.
const readOnly = !onSave
+ const bookends = useHotelBookends(onSave)
const legMinutes = settings.roadtrip_leg_minutes
const dayMinutes = settings.roadtrip_day_minutes
@@ -657,6 +665,18 @@ export default function RoadtripLimitsCard({ onSave, onResetDayBoundaries, loadi
disabled={readOnly}
onToggle={() => onSave?.('roadtrip_connect_days', !settings.roadtrip_connect_days)}
/>}
+ {/* Where a day begins and ends rather than what joins them: after a booked
+ night the drive sets off from the stay, and before one it ends there.
+ Off by default, because it adds a leg to most days of a trip that has
+ stays and changes their kilometres and times. */}
+
bookends.toggle?.()}
+ />
{/* Which matters most once the line IS continuous: end to end it is one
stroke, and a colour per day is what puts the days back into it. */}
void
+}
+
+/**
+ * The switch that seats a booked night at both ends of its days, as the desktop settings
+ * and the phone's driving figures both offer it.
+ *
+ * One hook so the two cannot disagree about what "on" means or where it is written. The
+ * value is the shared rule's own reading (`hotelBookendsOn`: missing is off), the one the
+ * drive is planned with, and the write is the save the caller holds. On both surfaces that
+ * is the planner's `saveRoadtripLimit`, so a flip on the phone goes through the same repo,
+ * the same offline queue and the same broadcast as one on the desktop.
+ */
+export function useHotelBookends(
+ save: ((key: string, value: boolean) => void) | undefined,
+ tripId?: number | string | null,
+): HotelBookendsSwitch {
+ const on = useRoadtripSettings(hotelBookendsOn, tripId)
+ return { on, toggle: save ? () => save(HOTEL_BOOKENDS_KEY, !on) : undefined }
+}
diff --git a/client/src/components/Roadtrip/useRoadtripRoutes.test.ts b/client/src/components/Roadtrip/useRoadtripRoutes.test.ts
index 0d75878e9..24268ca02 100644
--- a/client/src/components/Roadtrip/useRoadtripRoutes.test.ts
+++ b/client/src/components/Roadtrip/useRoadtripRoutes.test.ts
@@ -1,6 +1,6 @@
import { renderHook, waitFor, act } from '@testing-library/react'
import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
-import type { Assignment, AssignmentsMap, Day, Settings } from '../../types'
+import type { Accommodation, Assignment, AssignmentsMap, Day, Reservation, Settings } from '../../types'
import type { RoadtripStop } from './useRoadtripRoutes'
// Hoisted together with the mock: the module factory runs before the file body, so a
@@ -1163,3 +1163,197 @@ describe('a leg asked for again on demand', () => {
expect(result.current.days[0].avoidMissed ?? []).toEqual([])
})
})
+
+/**
+ * FE-ROADTRIP-ROUTES-052..059: a booked night at both ends of the days around it.
+ *
+ * The first cases here that hand the hook the trip's stays. What is pinned is what goes to
+ * the router: the drive from the hotel slept in and to tonight's is part of the day's own
+ * run, a night spent at one hotel asks for nothing, no via bends the hotel's legs, and with
+ * the switch off the days are the stored ones and nothing else.
+ */
+describe('a booked night at both ends of its days', () => {
+ const GETAWAY: [number, number] = [-33.71, 150.31]
+ const LOOKOUT: [number, number] = [-33.73, 150.35]
+ const FALLS: [number, number] = [-33.65, 150.38]
+ const WALLINGA: [number, number] = [-34.1, 150.9]
+ const HOTEL: [number, number] = [45.07, 7.68]
+ const P: [number, number][] = [1, 2, 3, 4, 5, 6].map(n => [45 + n * 0.1, 7 + n * 0.1])
+ const VIA: [number, number] = [44.5, 7.5]
+
+ /** A stay whose place is the one stop spec `stopId` stands for (`place_id` is id * 10). */
+ const stayOf = (id: number, stopId: number, start: number, end: number, at: [number, number], over: Record = {}) =>
+ ({
+ id, trip_id: 7, place_id: stopId * 10, start_day_id: start, end_day_id: end,
+ check_in: null, check_out: '10:00', place_name: `Stay ${id}`, place_lat: at[0], place_lng: at[1],
+ ...over,
+ }) as unknown as Accommodation
+ const booking = (id: number, accommodationId: number) =>
+ ({ id, trip_id: 7, title: 'Motel', type: 'hotel', status: 'confirmed', accommodation_id: accommodationId }) as unknown as Reservation
+
+ /** An hour and 100 km for whatever pair the router is handed. */
+ const hourly = (points: { lat: number; lng: number }[]) => ({
+ coordinates: points.map(p => [p.lat, p.lng] as [number, number]),
+ distance: 100000 * (points.length - 1),
+ duration: 3600 * (points.length - 1),
+ legs: points.slice(1).map(() => ({ distance: 100000, duration: 3600, text: '' })),
+ })
+ /** Every run the router was asked for, as its waypoints' latitudes. */
+ const asked = () => calculateRouteWithLegs.mock.calls.map(c => c[0].map((p: { lat: number }) => p.lat))
+ const shape = (stops: RoadtripStop[]) =>
+ stops.map(s => (s.bookend ? `${s.bookend.phase}:${s.bookend.accommodationId}` : s.name))
+ const switchTo = (on: boolean) =>
+ act(() => { useSettingsStore.setState({ settings: { ...DEFAULT_SETTINGS, roadtrip_hotel_bookends: on } as never }) })
+
+ beforeEach(() => {
+ calculateRouteWithLegs.mockImplementation(async (points: { lat: number; lng: number }[]) => hourly(points))
+ switchTo(true)
+ })
+ afterEach(() => act(() => useSettingsStore.setState({ settings: { ...DEFAULT_SETTINGS } })))
+
+ /** A check-in with two places, then a transfer day that is only the next check-in. */
+ const cam = () => ({
+ days: [day(1, 1), day(2, 2), day(3, 3)],
+ assignments: {
+ ...map(1, [{ id: 1, at: GETAWAY }, { id: 2, at: LOOKOUT }, { id: 3, at: FALLS }]),
+ ...map(2, [{ id: 4, at: WALLINGA }]),
+ } as AssignmentsMap,
+ stays: [stayOf(1, 1, 1, 2, GETAWAY, { check_in: '14:00' }), stayOf(2, 4, 2, 3, WALLINGA, { check_in: '15:00' })],
+ })
+
+ /** Three nights in one hotel with two places on every day before the check-out. */
+ const simeon = () => ({
+ days: [day(1, 1), day(2, 2), day(3, 3), day(4, 4)],
+ assignments: {
+ ...map(1, [{ id: 10, at: HOTEL }, { id: 11, at: P[0] }, { id: 12, at: P[1] }]),
+ ...map(2, [{ id: 13, at: P[2] }, { id: 14, at: P[3] }]),
+ ...map(3, [{ id: 15, at: P[4] }, { id: 16, at: P[5] }]),
+ } as AssignmentsMap,
+ stays: [stayOf(5, 10, 1, 4, HOTEL, { check_in: '15:00' })],
+ })
+
+ it('FE-ROADTRIP-ROUTES-052: the check-in day drives back to the stay, the transfer day sets off from it', async () => {
+ const { days, assignments, stays } = cam()
+ const { result } = renderHook(() => useRoadtripRoutes(7, days, assignments, 'driving', {}, [], stays, [booking(90, 1)]))
+ await waitFor(() => expect(result.current.loading).toBe(false))
+
+ expect(result.current.days.map(d => shape(d.stops))).toEqual([
+ ['Stop 1', 'Stop 2', 'Stop 3', 'evening:1'],
+ ['morning:1', 'Stop 4'],
+ ])
+ // One run per day, the hotel legs inside it.
+ expect(asked()).toEqual([
+ [GETAWAY[0], LOOKOUT[0], FALLS[0], GETAWAY[0]],
+ [GETAWAY[0], WALLINGA[0]],
+ ])
+ expect(result.current.days[1].stops[0].bookend).toMatchObject({ checkingOut: true, checkOut: '10:00', reservationId: 90 })
+ expect(result.current.days[0].legs).toHaveLength(3)
+ // Nothing numbered changes: the hotel is a service stop, the day's own stops are counted.
+ expect(result.current.totalStops).toBe(4)
+ // The check-out day with nothing of its own is no card.
+ expect(result.current.days.map(d => d.dayId)).toEqual([1, 2])
+ })
+
+ it('FE-ROADTRIP-ROUTES-053: every day between the nights starts and ends at the hotel', async () => {
+ const { days, assignments, stays } = simeon()
+ const { result } = renderHook(() => useRoadtripRoutes(7, days, assignments, 'driving', {}, [], stays))
+ await waitFor(() => expect(result.current.loading).toBe(false))
+
+ expect(result.current.days.map(d => shape(d.stops))).toEqual([
+ ['Stop 10', 'Stop 11', 'Stop 12', 'evening:5'],
+ ['morning:5', 'Stop 13', 'Stop 14', 'evening:5'],
+ ['morning:5', 'Stop 15', 'Stop 16', 'evening:5'],
+ ])
+ expect(asked()).toEqual([
+ [HOTEL[0], P[0][0], P[1][0], HOTEL[0]],
+ [HOTEL[0], P[2][0], P[3][0], HOTEL[0]],
+ [HOTEL[0], P[4][0], P[5][0], HOTEL[0]],
+ ])
+ // The check-out day has nothing of its own and is not driven.
+ expect(result.current.days.map(d => d.dayId)).toEqual([1, 2, 3])
+ })
+
+ it('FE-ROADTRIP-ROUTES-054: with the days connected, a night spent at one hotel asks the router nothing', async () => {
+ act(() => { useSettingsStore.setState(s => ({ settings: { ...s.settings, roadtrip_connect_days: true } })) })
+ const { days, assignments, stays } = cam()
+ const { result } = renderHook(() => useRoadtripRoutes(7, days, assignments, 'driving', {}, [], stays))
+ await waitFor(() => expect(result.current.loading).toBe(false))
+
+ // The two day runs and nothing else: no seam from the Getaway to the Getaway.
+ expect(asked()).toEqual([
+ [GETAWAY[0], LOOKOUT[0], FALLS[0], GETAWAY[0]],
+ [GETAWAY[0], WALLINGA[0]],
+ ])
+ expect(result.current.days[1].arrivingLeg).toBeFalsy()
+ expect(result.current.totalDistance).toBe(400000)
+ })
+
+ it('FE-ROADTRIP-ROUTES-055: a via behind the last place of a day does not bend the drive to tonight’s stay', async () => {
+ const { days, assignments, stays } = cam()
+ const vias = { 1: [{ id: 1, day_id: 1, after_order_index: 2, sequence: 0, lat: VIA[0], lng: VIA[1] }] }
+ const { result } = renderHook(() => useRoadtripRoutes(7, days, assignments, 'driving', vias, [], stays))
+ await waitFor(() => expect(result.current.loading).toBe(false))
+
+ expect(asked()[0]).toEqual([GETAWAY[0], LOOKOUT[0], FALLS[0], GETAWAY[0]])
+ expect(asked().flat()).not.toContain(VIA[0])
+ })
+
+ it('FE-ROADTRIP-ROUTES-056: no via leaves the morning hotel; one after the first place stays after it', async () => {
+ const { days, assignments, stays } = simeon()
+ const vias = { 2: [{ id: 1, day_id: 2, after_order_index: 0, sequence: 0, lat: VIA[0], lng: VIA[1] }] }
+ const { result } = renderHook(() => useRoadtripRoutes(7, days, assignments, 'driving', vias, [], stays))
+ await waitFor(() => expect(result.current.loading).toBe(false))
+
+ expect(asked()[1]).toEqual([HOTEL[0], P[2][0], VIA[0], P[3][0], HOTEL[0]])
+ })
+
+ it('FE-ROADTRIP-ROUTES-057: a transfer day with nothing stored drives from one stay to the other', async () => {
+ const days = [day(1, 1), day(2, 2), day(3, 3)]
+ const assignments = { ...map(1, [{ id: 1, at: GETAWAY }, { id: 2, at: LOOKOUT }]) } as AssignmentsMap
+ const stays = [stayOf(1, 1, 1, 2, GETAWAY), stayOf(2, 4, 2, 3, WALLINGA)]
+ const { result } = renderHook(() => useRoadtripRoutes(7, days, assignments, 'driving', {}, [], stays))
+ await waitFor(() => expect(result.current.loading).toBe(false))
+
+ const transfer = result.current.days.find(d => d.dayId === 2)!
+ expect(shape(transfer.stops)).toEqual(['morning:1', 'evening:2'])
+ expect(transfer.stops.map(s => s.bookend && [s.bookend.checkingOut, s.bookend.checkingIn])).toEqual([[true, false], [false, true]])
+ expect(asked()).toContainEqual([GETAWAY[0], WALLINGA[0]])
+ })
+
+ it('FE-ROADTRIP-ROUTES-058: switched off, the days are the stored ones, and back on and off again they are again', async () => {
+ switchTo(false)
+ const { days, assignments, stays } = simeon()
+ const { result } = renderHook(() => useRoadtripRoutes(7, days, assignments, 'driving', {}, [], stays))
+ await waitFor(() => expect(result.current.loading).toBe(false))
+ const stored = result.current.days.map(d => d.stops)
+ expect(stored.flat().some(s => s.bookend)).toBe(false)
+ expect(asked()).toEqual([
+ [HOTEL[0], P[0][0], P[1][0]],
+ [P[2][0], P[3][0]],
+ [P[4][0], P[5][0]],
+ ])
+
+ switchTo(true)
+ await waitFor(() => expect(result.current.days[1]?.stops[0]?.bookend?.phase).toBe('morning'))
+ await waitFor(() => expect(result.current.loading).toBe(false))
+ switchTo(false)
+ await waitFor(() => expect(result.current.days.flatMap(d => d.stops).some(s => s.bookend)).toBe(false))
+ expect(result.current.days.map(d => d.stops)).toEqual(stored)
+ })
+
+ it('FE-ROADTRIP-ROUTES-059: linking a booking to the stay changes the hotel row, not the road', async () => {
+ const { days, assignments, stays } = cam()
+ const { result, rerender } = renderHook(
+ ({ reservations }) => useRoadtripRoutes(7, days, assignments, 'driving', {}, [], stays, reservations),
+ { initialProps: { reservations: [] as Reservation[] } },
+ )
+ await waitFor(() => expect(result.current.loading).toBe(false))
+ expect(result.current.days[1].stops[0].bookend?.reservationId).toBeNull()
+ const calls = calculateRouteWithLegs.mock.calls.length
+
+ rerender({ reservations: [booking(91, 1), booking(90, 1)] })
+ // The earliest booking of the stay, and the router is not asked again.
+ await waitFor(() => expect(result.current.days[1].stops[0].bookend?.reservationId).toBe(90))
+ expect(calculateRouteWithLegs).toHaveBeenCalledTimes(calls)
+ })
+})
diff --git a/client/src/components/Roadtrip/useRoadtripRoutes.ts b/client/src/components/Roadtrip/useRoadtripRoutes.ts
index 6d7d79e78..de00aeb8f 100644
--- a/client/src/components/Roadtrip/useRoadtripRoutes.ts
+++ b/client/src/components/Roadtrip/useRoadtripRoutes.ts
@@ -1,5 +1,5 @@
import { useRoadtripSettings } from '../../hooks/useRoadtripSettings'
-import { assembleRoadtrip, carrierLegsFor, carrierSeam, foldRouteRun, isCarrierMode, isStationaryJoin, mergeRouteSegments, seatCarrierStops, standsAsDay, terminalAssignmentId, viasOnLeg, type CarrierSeam, type RoadtripStop, type RoadtripRoutes, type PlanDay, type QuietDay, type RoutedLeg } from '@trek/shared/roadtrip'
+import { assembleRoadtrip, bookendStaysOf, carrierLegsFor, carrierSeam, foldRouteRun, hotelBookendsOn, isCarrierMode, isStationaryJoin, mergeRouteSegments, seatCarrierStops, seatNightBookends, standsAsDay, terminalAssignmentId, viasOnLeg, type CarrierSeam, type RoadtripStop, type RoadtripRoutes, type PlanDay, type QuietDay, type RoutedLeg } from '@trek/shared/roadtrip'
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
import { avoidedClasses, calculateRouteWithLegs, routeEngineFor, RoutingRefusedError, type RouteEngine } from '../Map/RouteCalculator'
import { resolveLegMode } from '../Planner/legMode'
@@ -328,9 +328,29 @@ export function useRoadtripRoutes(
})
}, [days, assignments, accommodations, rideSeams])
- const plan = useMemo(() => storedDays.filter(d => standsAsDay(d.stops)), [storedDays])
+ /**
+ * Whether a day after a booked night starts at the stay and a day before one ends there.
+ * Off until the trip switches it on, so a trip drives exactly as it did before.
+ */
+ const bookendsOn = useRoadtripSettings(hotelBookendsOn, tripId)
+ // The nights as the rule reads them, with the booking behind each. Read only while the
+ // switch is on, so a new booking on a trip without it touches nothing downstream.
+ const stays = useMemo(
+ () => (bookendsOn ? bookendStaysOf(accommodations, reservations) : []),
+ [bookendsOn, accommodations, reservations],
+ )
+ // The stored days with the night before and the night after seated at their edges, by
+ // the rule the server's calculate_roadtrip runs too. Before a day is asked whether it
+ // stands as one: a day with a bookend always has two stops. A linked booking changes a
+ // bookend's reservation and nothing `planKey` reads, so it asks the router nothing.
+ const seatedDays = useMemo(
+ () => (bookendsOn ? seatNightBookends(storedDays, days, stays) : storedDays),
+ [bookendsOn, storedDays, days, stays],
+ )
- const quietDays = useMemo(() => storedDays.filter(d => !standsAsDay(d.stops)), [storedDays])
+ const plan = useMemo(() => seatedDays.filter(d => standsAsDay(d.stops)), [seatedDays])
+
+ const quietDays = useMemo(() => seatedDays.filter(d => !standsAsDay(d.stops)), [seatedDays])
/** Days apart, for a ride that lands on a later day than it left. */
const dayNumberOf = (dayId: number): number => days.find(d => d.id === dayId)?.day_number ?? 0
diff --git a/client/src/mobile/screens/trip/roadtrip/MRtInfoSheet.tsx b/client/src/mobile/screens/trip/roadtrip/MRtInfoSheet.tsx
index 00a343e98..37e5b8e0a 100644
--- a/client/src/mobile/screens/trip/roadtrip/MRtInfoSheet.tsx
+++ b/client/src/mobile/screens/trip/roadtrip/MRtInfoSheet.tsx
@@ -1,11 +1,13 @@
import type { ReactNode } from 'react'
import { Car, Fuel, Zap } from 'lucide-react'
import MSheet from '../../../components/MSheet'
+import MToggle from '../../../components/MToggle'
import type { MTripSheetsProps } from '../MTripShell'
import { useTranslation } from '../../../../i18n'
import { useSettingsStore } from '../../../../store/settingsStore'
import { useRoadtripSettings } from '../../../../hooks/useRoadtripSettings'
import { useVehicleRange } from '../../../../components/Roadtrip/useVehicleRange'
+import { useHotelBookends } from '../../../../components/Roadtrip/useHotelBookends'
import { blockMask } from '../../../../components/Roadtrip/RangeStrip'
import { dayWindow } from '../../../../components/Roadtrip/dayWindow'
import { formatDurationShort, parseAvoid } from '../../../../components/Roadtrip/roadtripModel'
@@ -21,13 +23,21 @@ import type { DistanceUnit } from '../../../../types'
* tank runs dry, and on a phone there was nothing behind those sentences: the numbers they
* are measured against live in a desktop dialog with seven panels and two columns. Without
* them a warning is an opinion. So two of those panels come along, the two that decide what
- * the stage is allowed to say, and nothing else does.
+ * the stage is allowed to say, and of a third only the one switch below.
*
- * Nothing here can be changed. That is the point rather than a gap: driving limits are set
- * once, at a table, before anybody is in the car, and a form in the passenger seat is a way
- * to break a trip while it is happening. So there is no field, no slider and no greyed-out
- * button that looks like one, and the last line says plainly where the settings are and what
- * else that screen can do that this one cannot.
+ * The figures cannot be changed here. That is the point rather than a gap: driving limits
+ * are set once, at a table, before anybody is in the car, and a form in the passenger seat is
+ * a way to break a trip while it is happening. So there is no field, no slider and no
+ * greyed-out button that looks like one, and the last line says plainly where the settings
+ * are and what else that screen can do that this one cannot.
+ *
+ * One switch is the exception: whether a day starts and ends at the stay. It is no figure and
+ * breaks nothing. It moves where a drawn day begins and ends, never a stored stop, and
+ * switched back off it gives exactly the stored plan again. It is also the one a traveller
+ * on the road reaches for, when the day on the phone sets off from its first place instead
+ * of the hotel they woke up in. It writes through the desktop dialog's own save
+ * (`useHotelBookends` over the planner's `saveRoadtripLimit`), and stays disabled for a
+ * reader who may not edit days.
*/
/**
@@ -70,7 +80,8 @@ function InfoCard({ label, children }: { label: string; children: ReactNode }) {
/**
* Driving figures sheet ('rtinfo'): the vehicle's range as the tank it leaves the factory
- * with, and the limits every warning on the stage is measured against. Read-only.
+ * with, and the limits every warning on the stage is measured against. Read-only but for
+ * the switch that starts and ends each day at the stay.
*/
export default function MRtInfoSheet({ planner, shell }: MTripSheetsProps) {
const { t } = useTranslation()
@@ -91,6 +102,7 @@ export default function MRtInfoSheet({ planner, shell }: MTripSheetsProps) {
const fillPercent = useRoadtripSettings(s => s.roadtrip_fill_percent, tripId)
const degradation = useRoadtripSettings(s => s.roadtrip_battery_degradation, tripId)
const avoidRaw = useRoadtripSettings(s => s.roadtrip_avoid, tripId)
+ const bookends = useHotelBookends(planner.saveRoadtripLimit, tripId)
const electric = vehicleKind === 'electric'
const VehicleIcon = electric ? Zap : vehicleKind === 'combustion' ? Fuel : Car
@@ -228,6 +240,24 @@ export default function MRtInfoSheet({ planner, shell }: MTripSheetsProps) {
+ {/* ── The one switch: whether a day starts and ends at the stay ── */}
+