From 850dbda4010070cfb6a2e7ef31ffed8ad9633b07 Mon Sep 17 00:00:00 2001
From: OziinG <145884442+OziinG@users.noreply.github.com>
Date: Wed, 1 Jul 2026 09:16:19 +0900
Subject: [PATCH] Use routeIdx markers for default route labels

Constraint: Default route labels should be compact #N names while preserving edited names.\nRejected: Add a shared formatter | the format appears in only the existing default-label spots.\nConfidence: high\nScope-risk: narrow\nDirective: Keep generated defaults as #N; do not parse names for routeIdx.\nTested: cd apps/shopify-app && node --test tests/routes-page.test.mjs tests/route-groups-helper.test.mjs; npm run typecheck; npm run build
---
 apps/shopify-app/app/features/delivery/route-helpers.js | 2 +-
 apps/shopify-app/app/routes/app.routes.$routeId.jsx     | 4 ++--
 apps/shopify-app/tests/routes-page.test.mjs             | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/apps/shopify-app/app/features/delivery/route-helpers.js b/apps/shopify-app/app/features/delivery/route-helpers.js
index 2c657e5..1f52eaf 100644
--- a/apps/shopify-app/app/features/delivery/route-helpers.js
+++ b/apps/shopify-app/app/features/delivery/route-helpers.js
@@ -23,7 +23,7 @@ export function readRouteOptimizedSnapshot(value) {
 export function getDefaultRouteGroupChildName(index, child) {
   const routeIdx = numberOrUndefined(child?.routeIdx);
   const sortOrder = numberOrUndefined(child?.sortOrder);
-  return `Route ${routeIdx ?? sortOrder ?? index + 1}`;
+  return `#${routeIdx ?? sortOrder ?? index + 1}`;
 }
 
 export function getRouteGroupChildRouteName(routeGroup, child, routePlan, index) {
diff --git a/apps/shopify-app/app/routes/app.routes.$routeId.jsx b/apps/shopify-app/app/routes/app.routes.$routeId.jsx
index 3e1179b..34884c9 100644
--- a/apps/shopify-app/app/routes/app.routes.$routeId.jsx
+++ b/apps/shopify-app/app/routes/app.routes.$routeId.jsx
@@ -1163,7 +1163,7 @@ function getNextChildRouteDraft(routeRows) {
   const routeNumber = (maxRouteIdx || routeRows.length) + 1;
   return {
     color: getUnusedRouteColor(null, usedColors, routeNumber - 1),
-    label: `Route ${routeNumber}`,
+    label: `#${routeNumber}`,
     routeIdx: routeNumber,
     routeIndex: routeNumber,
   };
@@ -1381,7 +1381,7 @@ export default function RouteDetailPage() {
   );
   const routeGroupStopsSource = routeGroup ? allRouteGroupStops : orderedRouteStops;
   const routeGroupChildRows = useMemo(() => buildRouteGroupChildRows(routeGroup, routeChildDetailsByRoutePlanId, routeGroupStopsSource), [routeChildDetailsByRoutePlanId, routeGroup, routeGroupStopsSource]);
-  const defaultRouteCandidateTitle = isRouteGroupDetail ? "Route 1" : routeDetailTitle;
+  const defaultRouteCandidateTitle = isRouteGroupDetail ? "#1" : routeDetailTitle;
   const routeStartDateTimeValue = getRouteStartDateTimeValue(effectiveRoutePlan);
   const routeStartTimeLabel = getRouteStartTimeLabel(routeStartDateTimeValue);
   const routeDeliveredCount = countRouteStopsByStatus(orderedRouteStops, ["DELIVERED", "FULFILLED"]);
diff --git a/apps/shopify-app/tests/routes-page.test.mjs b/apps/shopify-app/tests/routes-page.test.mjs
index 7ba21a6..5f9a912 100644
--- a/apps/shopify-app/tests/routes-page.test.mjs
+++ b/apps/shopify-app/tests/routes-page.test.mjs
@@ -825,7 +825,7 @@ test("Route detail renders route lines and a stop timeline below the map", () =>
   assert.match(routeDetailSource, />Total distance<\/th>/);
   assert.match(routeDetailSource, />Total weight<\/th>/);
   assert.match(routeDetailSource, />Created<\/th>/);
-  assert.match(routeDetailSource, /const defaultRouteCandidateTitle = isRouteGroupDetail \? "Route 1" : routeDetailTitle/);
+  assert.match(routeDetailSource, /const defaultRouteCandidateTitle = isRouteGroupDetail \? "#1" : routeDetailTitle/);
   assert.match(routeDetailSource, /title: getRouteGroupChildRouteName\(routeGroup, child, detail\?\.routePlan \?\? child\?\.routePlan, index\)/);
   assert.match(routeDetailSource, /aria-label="Change route driver"/);
   assert.match(routeDetailSource, /aria-label="Change route vehicle"/);