mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-10-21 14:36:31 +00:00
Add "use my current location" button to Journey entry editor
- One-shot getCurrentPositionOnce() helper in useGeolocation with typed error codes (unsupported, insecure context, permission denied, timeout) - Button inside the entry editor Location field fills coordinates from the device and reverse-geocodes the place name via /api/maps/reverse, falling back to formatted coordinates when no name is available - New journey.editor.* i18n keys in all 23 locales - Unit tests for the helper and component tests for the button flow
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
// FE-HOOK-GEO-001 to FE-HOOK-GEO-014
|
||||
// FE-HOOK-GEO-001 to FE-HOOK-GEO-023
|
||||
import { act, renderHook } from '@testing-library/react';
|
||||
import { useGeolocation } from './useGeolocation';
|
||||
import { GeoOnceError, getCurrentPositionOnce, useGeolocation } from './useGeolocation';
|
||||
|
||||
type WatchSuccess = (pos: GeolocationPosition) => void;
|
||||
type WatchFailure = (err: GeolocationPositionError) => void;
|
||||
@@ -259,3 +259,52 @@ describe('useGeolocation', () => {
|
||||
expect(clearWatch).toHaveBeenCalledWith(7);
|
||||
});
|
||||
});
|
||||
|
||||
describe('getCurrentPositionOnce', () => {
|
||||
/** Swaps the watch-based stub from beforeEach for a one-shot one. */
|
||||
function stubOnce(getCurrentPosition: (ok: PositionCallback, fail?: PositionErrorCallback) => void): void {
|
||||
Object.defineProperty(navigator, 'geolocation', {
|
||||
value: { getCurrentPosition: vi.fn(getCurrentPosition) },
|
||||
configurable: true,
|
||||
});
|
||||
}
|
||||
|
||||
it('FE-HOOK-GEO-020: resolves a mapped position from a single fix', async () => {
|
||||
stubOnce(ok => ok(fix({ latitude: 41.9, longitude: 12.5, accuracy: 10 })));
|
||||
|
||||
await expect(getCurrentPositionOnce()).resolves.toEqual({
|
||||
lat: 41.9, lng: 12.5, accuracy: 10, heading: null, speed: null, timestamp: 1_700_000_000_000,
|
||||
});
|
||||
});
|
||||
|
||||
it('FE-HOOK-GEO-021: rejects as unsupported when the browser has no geolocation', async () => {
|
||||
// Same guard as FE-HOOK-GEO-008: the key has to go away entirely.
|
||||
delete (navigator as { geolocation?: Geolocation }).geolocation;
|
||||
|
||||
await expect(getCurrentPositionOnce()).rejects.toMatchObject({
|
||||
name: 'GeoOnceError',
|
||||
code: 'unsupported',
|
||||
});
|
||||
});
|
||||
|
||||
it('FE-HOOK-GEO-022: rejects outside a secure context without asking the browser', async () => {
|
||||
const getCurrentPosition = vi.fn();
|
||||
stubOnce(getCurrentPosition);
|
||||
vi.stubGlobal('isSecureContext', false);
|
||||
|
||||
await expect(getCurrentPositionOnce()).rejects.toMatchObject({ code: 'insecure-context' });
|
||||
expect(getCurrentPosition).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it.each([
|
||||
[1, 'permission-denied'],
|
||||
[2, 'unavailable'],
|
||||
[3, 'timeout'],
|
||||
])('FE-HOOK-GEO-023: maps error code %i to "%s"', async (code, expected) => {
|
||||
stubOnce((_ok, fail) => fail?.(geoError(code)));
|
||||
|
||||
const rejection = await getCurrentPositionOnce().catch((e: unknown) => e);
|
||||
expect(rejection).toBeInstanceOf(GeoOnceError);
|
||||
expect((rejection as GeoOnceError).code).toBe(expected);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -40,6 +40,56 @@ function smoothAngle(prev: number | null, next: number, alpha = 0.25): number {
|
||||
return (prev + delta * alpha + 360) % 360
|
||||
}
|
||||
|
||||
export type GeoOnceErrorCode = 'unsupported' | 'insecure-context' | 'permission-denied' | 'unavailable' | 'timeout'
|
||||
|
||||
export class GeoOnceError extends Error {
|
||||
code: GeoOnceErrorCode
|
||||
|
||||
constructor(code: GeoOnceErrorCode, message?: string) {
|
||||
super(message || code)
|
||||
this.name = 'GeoOnceError'
|
||||
this.code = code
|
||||
}
|
||||
}
|
||||
|
||||
// One-shot position fix for form fields (e.g. journal entry location).
|
||||
// Unlike the watch below, a cached fix up to a minute old is fine here —
|
||||
// the user is standing where they're journaling — so maximumAge is
|
||||
// generous to make the button feel instant when the OS already has a fix.
|
||||
export function getCurrentPositionOnce(
|
||||
options: PositionOptions = { enableHighAccuracy: true, timeout: 15000, maximumAge: 60000 },
|
||||
): Promise<GeoPosition> {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (!('geolocation' in navigator)) {
|
||||
reject(new GeoOnceError('unsupported'))
|
||||
return
|
||||
}
|
||||
// Browsers hard-block geolocation outside secure contexts; surface that
|
||||
// explicitly since self-hosted instances served over plain HTTP hit it.
|
||||
if (typeof window !== 'undefined' && window.isSecureContext === false) {
|
||||
reject(new GeoOnceError('insecure-context'))
|
||||
return
|
||||
}
|
||||
navigator.geolocation.getCurrentPosition(
|
||||
(pos) => resolve({
|
||||
lat: pos.coords.latitude,
|
||||
lng: pos.coords.longitude,
|
||||
accuracy: pos.coords.accuracy,
|
||||
heading: pos.coords.heading ?? null,
|
||||
speed: pos.coords.speed ?? null,
|
||||
timestamp: pos.timestamp,
|
||||
}),
|
||||
(err) => reject(new GeoOnceError(
|
||||
err.code === err.PERMISSION_DENIED ? 'permission-denied'
|
||||
: err.code === err.TIMEOUT ? 'timeout'
|
||||
: 'unavailable',
|
||||
err.message,
|
||||
)),
|
||||
options,
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
export function useGeolocation(): UseGeolocationReturn {
|
||||
const [position, setPosition] = useState<GeoPosition | null>(null)
|
||||
const [mode, setModeState] = useState<TrackingMode>('off')
|
||||
|
||||
Reference in New Issue
Block a user