# Flag and Indicator Verification Guide

**Purpose**: Test that flags and fee data indicators are displaying correctly

---

## 🧪 Test Orders

Use these specific order numbers to verify the indicators are working:

### 1. Yellow Flag Test (DATE_PART_MATCH)
**Order**: #229621297
- **Should show**: 🚩 (Yellow flag) + ≈ (Orange approximation sign)
- **Remarks**: DATE_PART_MATCH
- **Fee Data**: Estimated

**How to test**:
1. Navigate to Profitability page
2. Search for order: 229621297
3. Look at the order number in collapsed row
4. Verify yellow flag appears after order number
5. Verify orange ≈ appears after flag

---

### 2. Red Flag Test (NO_SUPPLIER_DATA)
**Order**: #229621344
- **Should show**: 🚩 (Red flag) + ≈ (Orange approximation sign)
- **Remarks**: NO_SUPPLIER_DATA
- **Fee Data**: Estimated

**How to test**:
1. Search for order: 229621344
2. Look at the order number in collapsed row
3. Verify red flag appears after order number
4. Verify orange ≈ appears after flag

---

### 3. Approximation Sign Only (Estimated Fees, No Remarks)
**Order**: #229615948
- **Should show**: ≈ (Orange approximation sign) only
- **Remarks**: None
- **Fee Data**: Estimated

**How to test**:
1. Search for order: 229615948
2. Look at the order number in collapsed row
3. Verify NO flag appears
4. Verify orange ≈ appears after order number

---

### 4. Equals Sign Test (Actual Fees)
**Order**: #340616
- **Should show**: 🚩 (Red flag) + = (Green equals sign)
- **Remarks**: MANUAL_PRICE (will show red flag)
- **Fee Data**: Actual

**How to test**:
1. Search for order: 340616
2. Look at the order number in collapsed row
3. Verify red flag appears (for MANUAL_PRICE remark)
4. Verify green = appears after flag

---

## 📊 Database Statistics

Current distribution in database:

### Remarks Field:
- **EXACT_MATCH**: 17,112 orders (no flag shown)
- **DATE_PART_MATCH**: 1,392 orders (yellow flag)
- **NO_SUPPLIER_DATA**: 702 orders (red flag)
- **Other text**: 126,811 orders (red flag with custom tooltip)
- **Total with remarks**: 146,017 orders

### Fee Data Source:
- **Actual**: 9,374 orders (green = sign)
- **Estimated**: 226,516 orders (orange ≈ sign)

---

## 🔍 Why You Might Not See Flags

### 1. Filtering by Date Range
Most test orders are from 2024. If you're viewing August 2025 data, these test orders won't appear.

**Solution**: Clear date filters or search for specific order numbers

### 2. Looking at Wrong Orders
Most orders (17,112) have "EXACT_MATCH" remarks which DON'T show a flag.

**Solution**: Use the specific test order numbers listed above

### 3. Custom Remarks
Most remarks (126,811 orders) have custom text like:
- "Return rate not found for the category: Cooling Fans"
- "MANUAL_PRICE"

These WILL show a red flag, but you need to look carefully.

---

## 🎨 Visual Reference

### What You Should See:

```
Yellow Flag Example:
#229621297 🚩 ≈
               ↑  ↑
            yellow orange
             flag  approx

Red Flag Example:
#229621344 🚩 ≈
            ↑  ↑
           red orange
          flag approx

Estimated Only:
#229615948 ≈
            ↑
         orange
        approx

Actual Fees:
#340616 🚩 =
         ↑  ↑
        red green
       flag equals
```

---

## 🐛 Troubleshooting

### If NO indicators show at all:

1. **Check FontAwesome is loaded**:
   - Open browser DevTools (F12)
   - Go to Network tab
   - Refresh page
   - Look for fontawesome CSS file
   - If missing, Filament may not have FA loaded

2. **Check browser console for errors**:
   - Open DevTools Console tab
   - Look for JavaScript errors
   - CSS errors might prevent icons from rendering

3. **Clear all caches**:
   ```bash
   php artisan view:clear
   php artisan cache:clear
   php artisan config:clear
   ```

4. **Check HTML source**:
   - Right-click on order number
   - Select "Inspect Element"
   - Look for `<i class="fa fa-flag">` in HTML
   - If it exists but not visible, it's a CSS issue

### If approximation sign (≈) doesn't show:

The ≈ character is Unicode U+2248. It should display in all modern browsers.

1. **Check character encoding**:
   - Page should be UTF-8
   - Look for `<meta charset="utf-8">` in page head

2. **Check font support**:
   - Some fonts don't include ≈
   - Try different browser or system

---

## ✅ Expected Behavior

### Flags (fa-flag icon):
- **Yellow** (#ffc107): DATE_PART_MATCH
- **Red** (#dc3545): NO_SUPPLIER_DATA or other custom remarks
- **No flag**: EXACT_MATCH or null remarks

### Fee Data Indicators (text symbols):
- **= (Green #28a745)**: Actual fee data
- **≈ (Orange #ff9800)**: Estimated fee data
- **Nothing**: null fee_data_source

### Hover Tooltips:
- Flag: Shows the actual remarks text
- = sign: "Fee Data: Actual"
- ≈ sign: "Fee Data: Estimated"

---

## 📝 Testing Checklist

- [ ] Search for order 229621297
  - [ ] Yellow flag visible
  - [ ] Orange ≈ visible
  - [ ] Hover shows "DATE_PART_MATCH"

- [ ] Search for order 229621344
  - [ ] Red flag visible
  - [ ] Orange ≈ visible
  - [ ] Hover shows "NO_SUPPLIER_DATA"

- [ ] Search for order 229615948
  - [ ] No flag
  - [ ] Orange ≈ visible
  - [ ] Hover shows "Fee Data: Estimated"

- [ ] Search for order 340616
  - [ ] Red flag visible
  - [ ] Green = visible
  - [ ] Hover on flag shows "MANUAL_PRICE"
  - [ ] Hover on = shows "Fee Data: Actual"

- [ ] Test in dark mode
  - [ ] All indicators still visible
  - [ ] Colors maintain contrast

---

## 🎯 Most Likely Issue

**The flags ARE working**, but:

1. You're looking at August 2025 data where test orders don't exist
2. Most visible orders have "EXACT_MATCH" (no flag)
3. The approximation sign ≈ might be hard to see if you're not looking for it

**Solution**: Search for the specific test order numbers listed above to verify functionality.

---

## 💡 Quick Test

1. Go to profitability page
2. Clear all filters
3. Search: **229621297**
4. Look immediately after the order number
5. You should see: `#229621297` followed by a small yellow flag icon and orange ≈ symbol

If you see these, the feature is working correctly! 🎉