​

Visual Diff Staging Table 🧭

┌─────────────────────────────────────────────────────────────────────────────┐
│ 🧭 STAGING AREA: PRICE UPDATE (3 ITEMS)                                     │
├──────┬──────────────┬────────────────────────┬──────────────────────────────┤
│ #    │ ID / SKU     │ Product Name           │ Price Diff (Before ➔ After)  │
├──────┼──────────────┼────────────────────────┼──────────────────────────────┤
│ 1    │ #1042 / SH01 │ Air Pro Running Shoes  │ ~~$120.00~~ ➔ $102.00 (-15%) │
│ 2    │ #1045 / SH02 │ Leather City Sneakers  │ ~~$85.00~~  ➔ $72.25 (-15%)  │
│ 3    │ #1049 / SH03 │ Trail Running Boots    │ ~~$150.00~~ ➔ $127.50 (-15%) │
├──────┴──────────────┴────────────────────────┴──────────────────────────────┤
│ [ 🚀 Apply Changes to WooCommerce (3 items) ]                               │
└─────────────────────────────────────────────────────────────────────────────┘

​

🔍 Visual Hierarchy & Safety Standards

1. Deterministic Column Structure:
   • Left side (Locked Context): Product ID, SKU, title, and current category remain stable.
   • Right side (Diff Badges): Modified attributes are rendered as high-contrast comparison badges with strikethrough styling: ~~Old Value~~ ➔ New Value.
2. Chunked Execution Pipeline (50 items / 100ms):
   • Tapping Apply Changes triggers sequential processing in batches of 50 items with 100ms pauses to prevent server memory limits or gateway timeouts.
3. Live Telegram Chat Button Synchronization:
   • The instant the batch update finishes, the Telegram chat message button automatically updates its appearance: [ 👁️ Review & Apply (3 items) ] $\to$ [ ✅ Completed (3 items) ].
4. Stepper Multi-Step Sequences:
   • When an operation involves multiple stages (e.g. Step 1: Set discount $\to$ Step 2: Move to Sale category), the top banner displays [ 📑 Step 1 of 2: Apply 15% Discount ].
   • Completing Step 1 automatically posts Step 2 into your Telegram chat.