mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-10-20 22:16:26 +00:00
feat(roadtrip): bring the road trip addon to the phone
A road trip tab on the mobile trip screen: the stage as a chain, the same map underneath it, the sheets a passenger needs, and a search along the route. The addon was desktop only because road trip MODE is a data switch rather than a view switch. It rewrites `assignments` and `places` for the whole planner hook, and every mobile sheet is permanently mounted and reads those same two lists, so turning it on there brought back documented regressions. The mode flag is therefore untouched. A second flag, `roadtripFeedActive`, feeds only the routing round and does it off the STORED assignments, so the phone gets the drive without what the mode drags along with it. The map is one instance shared by the plan tab and the road trip tab, hoisted into a single JSX expression so React keeps it in the same position and the WebGL context is never torn down on a tab switch. The corridor search is scoped to what a phone can afford: a window of the day rather than all of it, a smaller tile ceiling, a capped retry pass and a deadline. The standard search is three requests where the desk makes fifteen. The categories are deliberately not narrowed, because they all ride one query per box, so a second one costs nothing. Two gaps found while wiring it up are closed here as well. The fuel search drew its offers nowhere on the phone, so the button did nothing visible; they are in the dry band now, with the detour, the spare range and an accept button. And the map credit opened as a two line ribbon across a screen the map fills: both GL engines now start it collapsed, and Leaflet, which has no collapsed mode of its own, is given one.
This commit is contained in:
@@ -2066,3 +2066,48 @@ describe('MapViewGL', () => {
|
||||
expect(glMap.setLayoutProperty).toHaveBeenCalledWith('trip-satellite-raster', 'visibility', 'none')
|
||||
})
|
||||
})
|
||||
describe('MapViewGL attribution', () => {
|
||||
const flushFrames = () => act(async () => { await new Promise(resolve => setTimeout(resolve, 40)) })
|
||||
|
||||
/** The compact control as maplibre leaves it on a narrow map: collapsed class, open. */
|
||||
function compactAttribution(container: HTMLElement): HTMLElement {
|
||||
const el = document.createElement('details')
|
||||
el.className = 'maplibregl-ctrl maplibregl-ctrl-attrib maplibregl-compact maplibregl-compact-show'
|
||||
el.setAttribute('open', '')
|
||||
// Inside the map container itself, where maplibre puts its controls.
|
||||
container.querySelectorAll('div')[1]?.appendChild(el)
|
||||
return el
|
||||
}
|
||||
|
||||
it('FE-COMP-MAPVIEWGL-077: the credit starts as the little button, not as a ribbon', async () => {
|
||||
const { container } = render(<MapViewGL places={[]} fitKey={1} />)
|
||||
await flushFrames()
|
||||
const attrib = compactAttribution(container)
|
||||
|
||||
const idle = glMap.once.mock.calls.find(c => c[0] === 'idle')?.[1] as (() => void) | undefined
|
||||
expect(idle).toBeDefined()
|
||||
act(() => { idle!() })
|
||||
|
||||
// Both engines open theirs on a phone and only tuck it away on the first drag, so
|
||||
// the first thing on a screen the map fills is a two-line band across the bottom.
|
||||
expect(attrib.classList.contains('maplibregl-compact-show')).toBe(false)
|
||||
expect(attrib.hasAttribute('open')).toBe(false)
|
||||
// Still there, still one tap away: nothing about the credit is removed.
|
||||
expect(attrib.classList.contains('maplibregl-ctrl-attrib')).toBe(true)
|
||||
})
|
||||
|
||||
it('FE-COMP-MAPVIEWGL-078: a map wide enough to show the credit in full is left alone', async () => {
|
||||
const { container } = render(<MapViewGL places={[]} fitKey={1} />)
|
||||
await flushFrames()
|
||||
const el = document.createElement('details')
|
||||
// No `compact-show`, which is what a map over 640px reports.
|
||||
el.className = 'maplibregl-ctrl maplibregl-ctrl-attrib'
|
||||
el.setAttribute('open', '')
|
||||
container.querySelectorAll('div')[1]?.appendChild(el)
|
||||
|
||||
const idle = glMap.once.mock.calls.find(c => c[0] === 'idle')?.[1] as (() => void) | undefined
|
||||
act(() => { idle!() })
|
||||
|
||||
expect(el.hasAttribute('open')).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user