add x-client-id header

src/components/map/index.tsx

@@ -15,7 +15,11 @@ import type maplibregl from 'maplibre-gl';
 import 'maplibre-gl/dist/maplibre-gl.css';
 
 import { throttle } from 'throttle-debounce';
-import { getValhallaUrl, buildHeightRequest } from '@/utils/valhalla';
+import {
+  getValhallaUrl,
+  buildHeightRequest,
+  VALHALLA_CLIENT_HEADERS,
+} from '@/utils/valhalla';
 import { buildHeightgraphData } from '@/utils/heightgraph';
 import HeightGraph from '@/components/heightgraph';
 import { DrawControl } from './draw-control';
@@ -287,7 +291,10 @@ export const MapComponent = () => {
     try {
       const response = await fetch(`${getValhallaUrl()}/height`, {
         method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
+        headers: {
+          'Content-Type': 'application/json',
+          ...VALHALLA_CLIENT_HEADERS,
+        },
         body: JSON.stringify(buildHeightRequest([[lat, lng]])),
       });
 
@@ -340,7 +347,10 @@ export const MapComponent = () => {
       try {
         const response = await fetch(`${getValhallaUrl()}/height`, {
           method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
+          headers: {
+            'Content-Type': 'application/json',
+            ...VALHALLA_CLIENT_HEADERS,
+          },
           body: JSON.stringify(heightPayloadNew),
         });
 

src/components/route-planner.tsx

@@ -8,7 +8,7 @@ const TilesControl = lazy(() =>
   import('./tiles/tiles').then((module) => ({ default: module.TilesControl }))
 );
 import { useCommonStore } from '@/stores/common-store';
-import { getValhallaUrl } from '@/utils/valhalla';
+import { getValhallaUrl, VALHALLA_CLIENT_HEADERS } from '@/utils/valhalla';
 import {
   Sheet,
   SheetContent,
@@ -61,7 +61,9 @@ export const RoutePlanner = () => {
   } = useQuery({
     queryKey: ['lastUpdate'],
     queryFn: async () => {
-      const response = await fetch(`${getValhallaUrl()}/status`);
+      const response = await fetch(`${getValhallaUrl()}/status`, {
+        headers: VALHALLA_CLIENT_HEADERS,
+      });
       const data = await response.json();
       return new Date(data.tileset_last_modified * 1000);
     },

src/hooks/use-directions-queries.ts

@@ -11,6 +11,7 @@ import {
   buildDirectionsRequest,
   parseDirectionsGeometry,
   showValhallaWarnings,
+  VALHALLA_CLIENT_HEADERS,
 } from '@/utils/valhalla';
 import { forward_geocode, parseGeocodeResponse } from '@/utils/nominatim';
 import { filterProfileSettings } from '@/utils/filter-profile-settings';
@@ -48,7 +49,10 @@ async function fetchDirections() {
   });
 
   const response = await fetch(`${getValhallaUrl()}/route?${params}`, {
-    headers: { 'Content-Type': 'application/json' },
+    headers: {
+      'Content-Type': 'application/json',
+      ...VALHALLA_CLIENT_HEADERS,
+    },
   });
 
   if (!response.ok) {

src/hooks/use-isochrones-queries.ts

@@ -10,6 +10,7 @@ import {
   getValhallaUrl,
   buildIsochronesRequest,
   showValhallaWarnings,
+  VALHALLA_CLIENT_HEADERS,
 } from '@/utils/valhalla';
 import {
   reverse_geocode,
@@ -52,6 +53,7 @@ async function fetchIsochrones() {
   const response = await fetch(`${getValhallaUrl()}/isochrone?${params}`, {
     headers: {
       'Content-Type': 'application/json',
+      ...VALHALLA_CLIENT_HEADERS,
     },
   });
 

src/hooks/use-optimized-route-query.ts

@@ -6,6 +6,7 @@ import {
   buildOptimizedRouteRequest,
   parseDirectionsGeometry,
   showValhallaWarnings,
+  VALHALLA_CLIENT_HEADERS,
 } from '@/utils/valhalla';
 import { filterProfileSettings } from '@/utils/filter-profile-settings';
 import { useCommonStore } from '@/stores/common-store';
@@ -55,7 +56,10 @@ export function useOptimizedRouteQuery() {
       });
 
       const response = await fetch(
-        `${getValhallaUrl()}/optimized_route?${params}`
+        `${getValhallaUrl()}/optimized_route?${params}`,
+        {
+          headers: VALHALLA_CLIENT_HEADERS,
+        }
       );
 
       if (!response.ok) {

src/utils/valhalla.ts

@@ -12,6 +12,10 @@ import { getBaseUrl } from './base-url';
 
 export const getValhallaUrl = () => getBaseUrl();
 
+export const VALHALLA_CLIENT_HEADERS = {
+  'X-Client-Id': 'public-web-app',
+} as const;
+
 export const buildLocateRequest = (
   latLng: { lat: number; lng: number },
   profile: Profile