Add multi-select support to Transaction Detail Report filters

[Copilot]

Merchant, Operator, and Product filters now support multi-select to enable filtering by multiple values simultaneously using a modern dropdown with checkboxes UI component.

Changes

Backend

• Updated GetTransactionDetailQuery signature to accept List<Guid>? instead of Guid? for each filter type
• Modified filter logic in TestMediatorService and StubTestData to use Contains() with deferred execution

Frontend

• Created reusable MultiSelectDropdown.razor component with dropdown and checkboxes
• Replaced single-select dropdowns with the new multi-select dropdown component
• Implemented component callback handlers for selection changes
• Added ParseGuidList() helper to safely parse selected values with TryParse()
• Added accessibility attributes (aria-label)

UI Component Features

The new dropdown component provides:

• Shows selected count (e.g., "3 items selected")
• Checkboxes for intuitive selection (no keyboard modifiers needed)
• Better mobile and touch device support
• Accessible with proper ARIA attributes
• Consistent with modern web application patterns

Example

// Before: single filter value
Guid? merchantId = string.IsNullOrEmpty(_selectedMerchantId) ? null : Guid.Parse(_selectedMerchantId);

// After: list of filter values
List<Guid>? merchantIds = ParseGuidList(_selectedMerchantIds);

// Backend filtering
transactions.Where(t => query.MerchantIds.Contains(t.MerchantId))

When no options are selected, the filter returns null (show all). When options are selected, only matching transactions are returned.

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Transaction Detail Report - Additional Filters</issue_title>
<issue_description>Merchant Filter must allow multi select
Operator Filter must allow multi select
Product Filter must allow multi select</issue_description>

Comments on the Issue (you are @copilot in this section)

• Fixes Transaction Detail Report - Additional Filters #661

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[StuartFerguson]

@copilot is there no better ui component to display this (i.e. a dropdown with checkboxes)

e.g.

[Copilot]

@copilot is there no better ui component to display this (i.e. a dropdown with checkboxes)

e.g.
...

Replaced the standard multi-select with a custom dropdown checkbox component. The new UI shows a cleaner interface with:

• Dropdown button showing selected count (e.g., "3 items selected")
• Checkboxes for each option (no Ctrl/Cmd needed)
• Better mobile and accessibility support
• Consistent with modern web application patterns

Implemented in commit 7fc55ee