feat(tickets): add ticket detail subcomponents

- TicketDetailHeader: Display ticket info with status dropdown
- TicketNotesFeed: Chronological list of ticket notes with internal flag
- TicketAddNote: Form to add notes (requires linked session)
- TicketConfigs: Display related configurations/devices
- TicketRelated: List of related tickets as clickable buttons

All components use type-safe imports from psaContext and integrations APIs.
Styling follows design system (flat dark theme, electric blue accent, Tailwind v4).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-04-16 03:19:18 +00:00
parent f050afc2f7
commit a3f8bb3427
5 changed files with 230 additions and 0 deletions

View File

@@ -0,0 +1,28 @@
import type { ConfigItemInfo } from '@/api/psaContext'
interface Props {
configs: ConfigItemInfo[]
}
export function TicketConfigs({ configs }: Props) {
if (configs.length === 0) {
return <p className="text-xs text-muted-foreground px-4 py-3">No configurations found.</p>
}
return (
<div className="divide-y divide-default">
{configs.map((config, i) => (
<div key={i} className="px-4 py-3 space-y-1.5">
<p className="text-sm font-medium text-primary">{config.device_identifier}</p>
<div className="grid grid-cols-2 gap-2 text-xs text-muted-foreground">
{config.type && <span>Type: {config.type}</span>}
{config.os_type && <span>OS: {config.os_type}</span>}
{config.ip_address && <span>IP: {config.ip_address}</span>}
{config.serial_number && <span>Serial: {config.serial_number}</span>}
{config.model_number && <span>Model: {config.model_number}</span>}
</div>
</div>
))}
</div>
)
}