Implement message preview feature for support tickets
- Added a new property `MessagePreview` to the `TicketSummaryDto` to display the truncated first message of a ticket. - Updated the `TicketMapping` class to retrieve the first message for each ticket and truncate it for preview purposes. - Modified the `SupportTicketList` and `AdminSupportPage` components to conditionally render the message preview in the ticket list, enhancing user experience by providing context at a glance.
This commit is contained in:
@@ -52,7 +52,8 @@ export function SupportTicketList() {
|
||||
<CardTitle className="text-base">{t(`support.type.${ticket.type}`)}</CardTitle>
|
||||
<TicketStatusBadge status={ticket.status} />
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<CardContent className="flex flex-col gap-1">
|
||||
{ticket.messagePreview && <p className="truncate text-xs text-muted-foreground">{ticket.messagePreview}</p>}
|
||||
<p className="text-xs text-muted-foreground">
|
||||
{t('support.lastActivity', { date: new Date(ticket.lastActivityAt).toLocaleString() })}
|
||||
</p>
|
||||
|
||||
@@ -55,7 +55,8 @@ function AdminSupportPage() {
|
||||
</CardTitle>
|
||||
<TicketStatusBadge status={ticket.status} />
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<CardContent className="flex flex-col gap-1">
|
||||
{ticket.messagePreview && <p className="truncate text-xs text-muted-foreground">{ticket.messagePreview}</p>}
|
||||
<p className="text-xs text-muted-foreground">
|
||||
{t('support.lastActivity', { date: new Date(ticket.lastActivityAt).toLocaleString() })}
|
||||
</p>
|
||||
|
||||
@@ -267,6 +267,7 @@ export type TicketSummaryDto = {
|
||||
status: TicketStatus
|
||||
createdAt: string
|
||||
lastActivityAt: string
|
||||
messagePreview: string | null
|
||||
}
|
||||
|
||||
export type TicketDetailDto = {
|
||||
|
||||
Reference in New Issue
Block a user