diff --git a/apps/shopify-app/app/features/delivery/route-detail-map.js b/apps/shopify-app/app/features/delivery/route-detail-map.js index 36a2de5..2cb7f63 100644 --- a/apps/shopify-app/app/features/delivery/route-detail-map.js +++ b/apps/shopify-app/app/features/delivery/route-detail-map.js @@ -993,7 +993,7 @@ function syncRouteDetailMapMarkerLayers(map, departureLocation, routeStops, rout "circle-radius": 7, "circle-stroke-color": "#ffffff", "circle-stroke-width": 2, - "circle-translate": [-8, -23], + "circle-translate": [-10, -28], "circle-translate-anchor": "viewport", }, }); @@ -1013,7 +1013,7 @@ function syncRouteDetailMapMarkerLayers(map, departureLocation, routeStops, rout }, paint: { "text-color": "#ffffff", - "text-translate": [-8, -23], + "text-translate": [-10, -28], "text-translate-anchor": "viewport", }, }); diff --git a/apps/shopify-app/app/features/maps/map-markers.js b/apps/shopify-app/app/features/maps/map-markers.js index 45e6867..6e2fe64 100644 --- a/apps/shopify-app/app/features/maps/map-markers.js +++ b/apps/shopify-app/app/features/maps/map-markers.js @@ -15,7 +15,7 @@ export const MAP_MARKER_PALETTE = { export const MAP_PIN_PATH = "M20 50C20 50 4 31.5 4 18C4 9.16 11.16 2 20 2s16 7.16 16 16c0 13.5-16 32-16 32Z"; export const MAP_PIN_PIXEL_RATIO = 2; -export const MAP_PIN_ICON_SIZE = 0.54; +export const MAP_PIN_ICON_SIZE = 0.66; export const MAP_PIN_SYMBOL_LAYOUT = { "icon-allow-overlap": true, "icon-anchor": "bottom", diff --git a/apps/shopify-app/tests/orders-page.test.mjs b/apps/shopify-app/tests/orders-page.test.mjs index a796ddd..9248c29 100644 --- a/apps/shopify-app/tests/orders-page.test.mjs +++ b/apps/shopify-app/tests/orders-page.test.mjs @@ -1513,11 +1513,11 @@ test("Orders map renders planned markers above overlapping unplanned markers", ( assert.doesNotMatch(ordersPageSource, /sortedLocatedOrders/); }); -test("Orders map keeps planned pins the same size and centers the planned number", () => { +test("Orders map keeps planned pins two display steps larger and centers the planned number", () => { assert.match(mapMarkersSource, /export const MAP_PIN_PIXEL_RATIO = 2/); assert.match(mapMarkersSource, /const width = \(options\.width \?\? 40\) \* pixelRatio/); assert.match(mapMarkersSource, /const height = \(options\.height \?\? 52\) \* pixelRatio/); - assert.match(mapMarkersSource, /export const MAP_PIN_ICON_SIZE = 0\.54/); + assert.match(mapMarkersSource, /export const MAP_PIN_ICON_SIZE = 0\.66/); assert.match(mapMarkersSource, /"icon-size": MAP_PIN_ICON_SIZE/); assert.match(mapMarkersSource, /function createMapPinSymbolLayer\(\{ id, source, iconImage/); assert.match(ordersPageSource, /createMapPinSymbolLayer\(\{\s+id: ORDERS_MAP_ORDER_LAYER_ID,\s+source: ORDERS_MAP_SOURCE_ID,\s+\}\)/); diff --git a/apps/shopify-app/tests/route-tracking-live.test.mjs b/apps/shopify-app/tests/route-tracking-live.test.mjs index 82fb269..68850ef 100644 --- a/apps/shopify-app/tests/route-tracking-live.test.mjs +++ b/apps/shopify-app/tests/route-tracking-live.test.mjs @@ -133,7 +133,8 @@ test("live tracking updates MapLibre sources instead of rebuilding the child map assert.match(routeMapSource, /const ROUTE_DETAIL_STOP_COMPLETION_BADGE_LAYER_ID/); assert.match(routeMapSource, /const ROUTE_DETAIL_STOP_COMPLETION_CHECK_LAYER_ID/); assert.match(routeMapSource, /isCompleted: Boolean\(stop\.isTrackingCompleted \|\| isRouteStopCompleted\(stop\)\)/); - assert.match(routeMapSource, /"circle-translate": \[-8, -23\]/); + assert.match(routeMapSource, /"circle-translate": \[-10, -28\]/); + assert.match(routeMapSource, /"text-translate": \[-10, -28\]/); assert.match(routeMapSource, /"text-field": "✓"/); assert.doesNotMatch(routeMapSource, /const stopOpacity = isTrackingView \? 0\.42 : 1/); assert.match(routeDetailSource, /completedTrackingStopIds/);