# Subscription Service Management

Guidance for the unified Service Management area in the Subscriptions detail page. This area provides a dropdown to switch between different service types for a given subscription.

- Location: `Subscriptions > [Subscription] > Service Management`
- Selector: Service dropdown with options: `SIM`, `Internet`, `Netgear`, `VPN`
- Current status: `SIM` available now; others are placeholders (coming soon)

## UI Structure

```
apps/portal/src/features/service-management/
├── components/
│   └── ServiceManagementSection.tsx  # Container with service dropdown
└── index.ts
```

- Header: Title + description, service dropdown selector
- Body: Renders the active service panel
- Default selection: `SIM` for SIM products; otherwise `Internet`

## Service Panels

- SIM: Renders the existing SIM management UI
  - Source: `apps/portal/src/features/sim-management/components/SimManagementSection.tsx`
  - Backend: `/api/subscriptions/{id}/sim/*`
- Internet: Placeholder (coming soon)
- Netgear: Placeholder (coming soon)
- VPN: Placeholder (coming soon)

## Integration

- Entry point: `apps/portal/src/app/(authenticated)/subscriptions/[id]/page.tsx` renders `ServiceManagementSection`
- Detection: SIM availability is inferred from `subscription.productName` including `sim` (case-insensitive)

## Future Expansion

- Replace placeholders with actual feature modules per service type
- Gate options per subscription capabilities (disable/hide unsupported services)
- Deep-linking: support `?service=sim|internet|netgear|vpn` to preselect a panel
- Telemetry: track panel usage and feature adoption

## Notes

- This structure avoids breaking changes to the existing SIM workflow while preparing a clean surface for additional services.
- SIM documentation remains at `docs/FREEBIT-SIM-MANAGEMENT.md` and is unchanged functionally.