<!-- source-hash: aa1e11dd3e0b9d6a8141611784c7d212 -->
A reusable React filter component that renders a row of platform-selection buttons, including an "All Platforms" option, with optional platform icons.

## Key Components

### `PlatformFilterComponent`
The primary export — a client-side React component that maps a `PlatformConfig[]` array into toggle buttons, highlighting the currently selected platform using the `"accent"` variant.

### `PlatformFilterComponentProps`

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `selectedPlatform` | `string` | — | Currently active platform value (use `'all'` for the global option) |
| `onPlatformChange` | `(platform: string) => void` | — | Callback fired when a platform button is clicked |
| `platforms` | `PlatformConfig[]` | `[]` | List of platform options to render |
| `className` | `string` | `''` | Additional CSS classes for the wrapper `div` |
| `showIcons` | `boolean` | `true` | Whether to render small platform icons via `getSmallPlatformIcon` |
| `size` | `'small-legacy' \| 'default'` | `'small-legacy'` | Button size variant |

## Usage Example

```typescript
import { PlatformFilterComponent } from './platform-filter';
import type { PlatformConfig } from '../../types/platform';

const platforms: PlatformConfig[] = [
  { value: 'connectwise', label: 'ConnectWise' },
  { value: 'halo',        label: 'HaloPSA'    },
];

function TicketFilters() {
  const [platform, setPlatform] = React.useState('all');

  return (
    <PlatformFilterComponent
      selectedPlatform={platform}
      onPlatformChange={setPlatform}
      platforms={platforms}
      showIcons={true}
    />
  );
}
```

> **Note:** Platform icons are resolved via the shared `getSmallPlatformIcon` utility in `platform-config`. To add a new platform, extend the `PlatformConfig` type and register its icon there rather than modifying this component.