- 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>
59 lines
1.7 KiB
TypeScript
59 lines
1.7 KiB
TypeScript
import { useState } from 'react'
|
|
import { toast } from '@/lib/toast'
|
|
|
|
interface Props {
|
|
ticketId: string
|
|
sessionId?: string
|
|
onPosted: () => void
|
|
}
|
|
|
|
export function TicketAddNote({ sessionId, onPosted }: Props) {
|
|
const [text, setText] = useState('')
|
|
const [posting, setPosting] = useState(false)
|
|
|
|
if (!sessionId) {
|
|
return (
|
|
<div className="px-4 py-3">
|
|
<p className="text-xs text-muted-foreground">
|
|
Start a FlowPilot or ResolutionAssist session linked to this ticket to post notes.
|
|
</p>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
async function handlePost() {
|
|
if (!text.trim()) return
|
|
setPosting(true)
|
|
try {
|
|
// Post note via session link — requires a linked session
|
|
// Import and call the session PSA API here
|
|
toast.success('Note posted to ticket')
|
|
setText('')
|
|
onPosted()
|
|
} catch {
|
|
toast.error('Failed to post note')
|
|
} finally {
|
|
setPosting(false)
|
|
}
|
|
}
|
|
|
|
return (
|
|
<div className="px-4 py-3 space-y-2">
|
|
<textarea
|
|
className="w-full bg-input border border-default rounded-[5px] px-3 py-2 text-sm text-primary placeholder:text-muted-foreground focus:border-accent focus:outline-none resize-none"
|
|
rows={3}
|
|
placeholder="Add a note to this ticket…"
|
|
value={text}
|
|
onChange={e => setText(e.target.value)}
|
|
/>
|
|
<button
|
|
disabled={!text.trim() || posting}
|
|
onClick={handlePost}
|
|
className="px-3 py-1.5 bg-accent text-white text-xs font-medium rounded-[5px] hover:bg-accent/90 disabled:opacity-40 disabled:cursor-not-allowed transition-colors"
|
|
>
|
|
{posting ? 'Posting…' : 'Post Note'}
|
|
</button>
|
|
</div>
|
|
)
|
|
}
|