# Plan: Change ID Text Inputs to Dropdowns

## Current State
In `src\routes\(app)\master-data\testmap\+page.svelte`, the filter section has:
- Host ID filter (lines 239-244): text input
- Client ID filter (lines 260-265): text input

## Changes Required

### 1. Add Derived State for Dropdown Options
Add after line 41 (after filter states):
```javascript
// Derived unique values for dropdowns
let uniqueHostIDs = $derived([...new Set(testMaps.map(m => m.HostID).filter(Boolean))].sort());
let uniqueClientIDs = $derived([...new Set(testMaps.map(m => m.ClientID).filter(Boolean))].sort());
```

### 2. Replace Host ID Input with Dropdown
Replace lines 239-244 with:
```svelte
<select
  class="select select-sm select-bordered w-full"
  bind:value={filterHostID}
>
  <option value="">All IDs</option>
  {#each uniqueHostIDs as id}
    <option value={id}>{id}</option>
  {/each}
</select>
```

### 3. Replace Client ID Input with Dropdown
Replace lines 260-265 with:
```svelte
<select
  class="select select-sm select-bordered w-full"
  bind:value={filterClientID}
>
  <option value="">All IDs</option>
  {#each uniqueClientIDs as id}
    <option value={id}>{id}</option>
  {/each}
</select>
```

## Benefits
- Users can select from existing IDs rather than typing
- Prevents typos in filter values
- Shows all available options at a glance
- Maintains exact matching instead of substring matching for IDs

Ready to implement?