Show the assignee on the support ticket card
React · React · beginner · modification
Adds the assignee line to the support ticket card, as the triage team asked. Falls back to 'Unassigned' when there is no assignee name. Clicked through the queue locally and every card shows the right agent.
The card renders across the shared support queue, where at any moment a chunk of tickets are freshly created and still unassigned.
Requirements
- The support queue renders a TicketCard for every ticket: subject, a priority label, an assignee line, and the ticket number with the open date.
- ticket.assignee is either an object with a non-empty string name, or null. New tickets start unassigned, so assignee is null until an agent picks the ticket up — a routine state, not an error.
- Unassigned tickets must render the assignee line as 'Assigned to: Unassigned'.
- ticket.priority is exactly 'high' or 'normal'; subject, id and openedAt are always present.
Files touched
- src/components/TicketCard.jsx
--- src/components/TicketCard.jsx
export default function TicketCard({ ticket }) {
+ const assigneeName = ticket.assignee.name || 'Unassigned';
return (
<article className="ticket-card">
<span className="priority">{priorityLabel(ticket.priority)}</span>
</header>
+ <p className="assignee">Assigned to: {assigneeName}</p>
<footer>#{ticket.id} · opened {ticket.openedAt}</footer>
</article>