Merge pull request #118 from beatz174-bit/codex/reintroduce-qty-prefix-and-update-test

Restore inline quantity label and adjust popup test

e2e/picklist.spec.ts

@@ -402,13 +402,15 @@ test.describe('Active pick list responsive controls on mobile', () => {
 
     const itemDialog = page.getByRole('dialog', { name: additionalProduct });
     await expect(itemDialog).toBeVisible();
-    await expect(itemDialog.getByText(/Quantity:\s*1\s+unit/i)).toBeVisible({ timeout: 10000 });
+    const quantityDisplay = itemDialog.getByText(/Quantity/i);
+
+    await expect(quantityDisplay).toHaveText(/Quantity:\s*1\s+unit/i, { timeout: 10000 });
     await expect(itemDialog.getByLabel('Increase quantity')).toBeVisible();
 
     await itemDialog.getByLabel('Increase quantity').click();
-    await expect(itemDialog.getByText(/Quantity:\s*2\s+unit/i)).toBeVisible({ timeout: 10000 });
+    await expect(quantityDisplay).toHaveText(/Quantity:\s*2\s+unit/i, { timeout: 10000 });
     await itemDialog.getByLabel('Switch to carton packaging').click();
-    await expect(itemDialog.getByText(/Quantity:\s*2\s+carton/i)).toBeVisible({ timeout: 10000 });
+    await expect(quantityDisplay).toHaveText(/Quantity:\s*2\s+carton/i, { timeout: 10000 });
 
     await itemDialog.getByLabel('Delete item').click();
     await expect(page.getByRole('dialog', { name: 'Delete item' })).toBeVisible();

src/components/PickItemRow.test.tsx

@@ -56,7 +56,7 @@ describe('PickItemRow', () => {
     );
 
     const productName = screen.getByText(baseProduct.name);
-    const quantityLabel = screen.getByText('1 unit');
+    const quantityLabel = screen.getByText('Qty: 1 unit');
     const titleRow = screen.getByTestId('pick-item-title-row');
 
     const rowStyle = getComputedStyle(titleRow);

src/components/PickItemRow.tsx

@@ -134,7 +134,7 @@ export const PickItemRow = ({
               noWrap
               sx={{ fontWeight: 600, whiteSpace: 'nowrap' }}
             >
-              {item.quantity} {packagingLabel}
+              Qty: {item.quantity} {packagingLabel}
             </Typography>
           </Stack>
           {isNarrowScreen && (