═══════════════════════════════════════════════════════════════════════════════ CiC WALKTHROUGH PROMPT — Tour Planner Playground (tour-pg-v1) URL: https://srv1111289.hstgr.cloud/tour-pg/ Login: harish / pramod / rakesh (Hub session, 12h TTL) Test data: /var/www/360lm/tour-pg/sample.xlsx (12 Chandigarh tri-city stops) ═══════════════════════════════════════════════════════════════════════════════ Paste this whole block into Claude-in-Chrome. Mark each checkpoint as ✅ / ❌ inline with a one-line observation. Take 📸 screenshots where indicated. Report surprises at the end. You are testing as a sales-ops user (Rakesh or Harish) planning tomorrow's BTL counter sweep. The sample file has 12 stops in Chandigarh / Mohali / Panchkula / Punjab. Do NOT save data to production; use the playground exactly as intended — ephemeral. ─── PART 1 — Login + landing screen ────────────────────────────────────────── 1.1 Open /hub/ as harish (PIN). Then navigate to /tour-pg/. 👉 Upload screen visible. Header: "🗺 Tour Playground" + your user pill (e.g. "👤 Harish Kumar Lal"). 👉 Origin pre-filled "Mohali office Punjab". 👉 Round-trip toggle is checked. 👉 "Parse + optimise route" button is greyed out / disabled. 1.2 Try the round-trip toggle. 👉 Unchecking shows a new "Final destination" input below. 👉 Re-checking hides it again. Leave it CHECKED for now. ─── PART 2 — Upload sample.xlsx ───────────────────────────────────────────── 2.1 Download the sample Excel from: https://srv1111289.hstgr.cloud/tour-pg/sample.xlsx Or use the file picker → navigate to your local copy. 2.2 Tap the drop-zone OR drag the file onto it. 👉 Toast "Excel parsed ✓" (green). 👉 Below the drop-zone, a "Parsed" card appears: "12 stops detected · cols: name, city, address, lat, lng, phone, notes" 👉 The "Parse + optimise route" button turns sky-blue (enabled). 📸 Upload screen with sample parsed. ─── PART 3 — Geocode + optimise ───────────────────────────────────────────── 3.1 Tap "Parse + optimise route". 👉 A progress bar appears: "Pre-geocoded 12 / 12" (because sample.xlsx has lat/lng, no geocoding API calls needed for stops; the origin "Mohali office Punjab" gets geocoded once). 👉 The label switches briefly to "Optimising route…". 👉 After ~1–3 seconds, you land on the Editor screen. 3.2 Editor screen verification: 👉 Header shows back arrow, "Tour Editor", and your user pill. 👉 Sub-header: "12 of 12 included · tomtom-computeBestOrder" (because 12 ≤ 12 the proxy used TomTom's server-side TSP). 👉 Big sky-blue origin pill on top: "Start from: Mohali office Punjab" with an ✏️ Change button. 👉 12 numbered tiles. Each tile shows: - Drag grip "≡" on left - Round numbered badge (1..12) in sky-blue - Store name + city - "X.X km · Y min from prev" leg metric in blue - Provider badge ("EXCEL" since coords came from the file) - Big round ✓ toggle on right (green when included) 👉 Sticky bottom bar: "XX.X km · Yh Zmin" with "matches proposed route" delta line in grey. 📸 Editor screen showing optimised order. 3.3 Make a note: which stop did TomTom put first? (Should be one close to Mohali — e.g. Phase 7 or Phase 11 Mohali, OR Kharar.) Total distance should be roughly 60–110 km (depends on traffic). ─── PART 4 — Drag-reorder a tile ──────────────────────────────────────────── 4.1 Drag a tile from position 6 or 7 to position 2 (use the ≡ grip). Hold + drag, release. 👉 The list animates the reorder. 👉 Position numbers renumber instantly (1..12 stay sequential). 👉 A small "↻" appears next to the share button in the totals bar for ~400ms — indicates recalc in flight. 👉 Totals update. The delta line changes to "vs proposed: +X.X km · +Y min" in YELLOW (you've made it longer). 📸 Editor after drag — note the delta colour. 4.2 Undo: drag the tile back to its original position. 👉 Delta returns to "matches proposed route" (grey) once you nail it. (May be ±0.5 km due to road network rounding — acceptable.) ─── PART 5 — Toggle exclude / include ─────────────────────────────────────── 5.1 Tap the ✓ toggle on tile #3 (Sector 35 Market). 👉 Toggle turns red (✗). 👉 Tile dims; name + city get strikethrough. 👉 Leg row disappears on the excluded tile. 👉 Totals recalc after 400ms; numbers DROP (shorter tour). 👉 Delta line shows "vs proposed: −X.X km · −Y min" in GREEN (or yellow if longer due to detour around the missing stop). 5.2 Re-include the same tile. 👉 Toggle back to green ✓. 👉 Strikethrough removed. 👉 Numbers restore. 📸 Editor with a few stops excluded. 5.3 Exclude THREE consecutive tiles. Verify the visit numbers stay 1..12 sequential (excluded ones still numbered, just dimmed) and the leg metrics on the remaining tiles update to reflect skipping the excluded. ─── PART 6 — Re-optimise (button) ──────────────────────────────────────────── 6.1 After excluding 3 tiles in step 5.3, tap "🔁 Re-optimise" above the tile list. 👉 Toast "Optimising…" briefly. 👉 The remaining 9 included tiles reorder into a fresh optimal permutation (positions 1..9). 👉 The 3 excluded tiles drop to positions 10, 11, 12 (still in list, still dimmed, still strikethrough). 👉 Sub-header updates to "9 of 12 included · tomtom-computeBestOrder". 👉 The delta resets to "matches proposed route" (the new proposal IS the baseline now). 📸 Re-optimised editor showing 9 included + 3 excluded at the end. ─── PART 7 — Mid-tour replan ───────────────────────────────────────────────── 7.1 Tap the ✏️ Change button on the origin pill. 👉 An inline editor appears below the pill with a text field pre-filled "Mohali office Punjab" and a tip about the workflow. 7.2 Type a new origin like "Panchkula Sector 5 Haryana" — simulating a team that stayed overnight in Panchkula and is restarting from there. 7.3 Tap "🔄 Replan from here". 👉 The proxy geocodes the new origin, then optimise runs again. 👉 Origin pill updates to the new value. 👉 Tiles re-order optimally from the new starting point. 👉 Totals update. 👉 Toast "Re-optimised ✓". 📸 New plan starting from Panchkula. 7.4 Reset origin back to "Mohali office Punjab" (✏️ Change → type → Replan). ─── PART 8 — Share + export + save ────────────────────────────────────────── 8.1 Tap "📤 Share" in the totals bar (or "📤" icon in header). 👉 Bottom-sheet modal opens. 👉 Shows formatted text: "🚗 Tour plan (date)\nFrom: Mohali office...\n N stops · X km · Y min\nRound-trip\n\n1. Store · City (+X.Xkm · Ymin) · phone\n ...\n↩ Return to Mohali..." 8.2 Tap "📋 Copy text". Toast "Copied ✓". (Open Notes / TextEdit and paste to verify.) 8.3 Tap "📥 Download CSV". 👉 Browser downloads "tour-YYYY-MM-DD.csv". 👉 CSV contains: #, Name, City, Address, Phone, Lat, Lng, Leg km, Leg min, Provider — one row per INCLUDED stop. 👉 Number of rows = number of included tiles (NOT all 12 if you excluded some). 8.4 Tap "💾 Save to this device". 👉 Toast "Saved ✓". 👉 Header now shows "↻ Load" button. 8.5 Tap "💬 WhatsApp". 👉 If on phone: WhatsApp opens with the formatted text pre-filled, ready to forward. 👉 If on desktop: wa.me opens in a new tab — copy/share from there. 8.6 Close the modal (×). ─── PART 9 — Reload + restore ──────────────────────────────────────────────── 9.1 Hard-refresh the page (Cmd+Shift+R or Ctrl+Shift+R). 👉 You land back on the Upload screen. 👉 "↻ Load" button visible in header (because step 8.4 saved). 9.2 Tap "↻ Load". 👉 Editor screen restores your prior tour exactly: tiles, order, included/excluded states, totals. 👉 Toast "Loaded ✓". ─── PART 10 — Start fresh ──────────────────────────────────────────────────── 10.1 Tap "‹ New" in the editor header. 👉 Confirmation dialog: "Start a new tour? Current state will be cleared (use Save first if you want to keep it)." 👉 Tap OK. 👉 Upload screen returns, dropzone cleared. 10.2 You can now upload a different Excel or close the tab. ─── Summary checklist ────────────────────────────────────────────────────────── [ ] Part 1 — Login + landing [ ] Part 2 — Upload sample.xlsx [ ] Part 3 — Optimise + tile editor [ ] Part 4 — Drag-reorder + delta colour [ ] Part 5 — Toggle exclude / include [ ] Part 6 — Re-optimise after exclusions [ ] Part 7 — Mid-tour replan (origin change) [ ] Part 8 — Share, copy, CSV, save, WhatsApp [ ] Part 9 — Reload + restore [ ] Part 10 — Start fresh ═══════════════════════════════════════════════════════════════════════════════ SURPRISES / DEVIATIONS: ═══════════════════════════════════════════════════════════════════════════════