Align ticket status colors across views

This commit is contained in:
codex-bot 2025-10-24 16:48:24 -03:00
parent 296e02cf0c
commit 6702811f4a
6 changed files with 110 additions and 89 deletions

View file

@ -25,6 +25,7 @@ import { Button } from "@/components/ui/button"
import { Separator } from "@/components/ui/separator"
import { Input } from "@/components/ui/input"
import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"
import { getTicketStatusDotClass, getTicketStatusLabel } from "@/lib/ticket-status-style"
import {
Bold,
Italic,
@ -115,20 +116,6 @@ type TicketMentionAttributes = Record<string, unknown>
const TICKET_MENTION_FALLBACK_STATUS = "PENDING"
const TICKET_MENTION_FALLBACK_PRIORITY = "MEDIUM"
const statusLabels: Record<string, string> = {
PENDING: "Pendente",
AWAITING_ATTENDANCE: "Em andamento",
PAUSED: "Pausado",
RESOLVED: "Resolvido",
}
const statusTone: Record<string, string> = {
PENDING: "bg-amber-400",
AWAITING_ATTENDANCE: "bg-sky-500",
PAUSED: "bg-violet-500",
RESOLVED: "bg-emerald-500",
}
function toPlainString(value: unknown): string {
if (value === null || value === undefined) return ""
return String(value)
@ -162,11 +149,11 @@ function updateTicketMentionNodeElements(elements: TicketMentionNodeElements, at
const displayedReference = referenceLabel ? `#${referenceLabel}` : "#"
const formattedSubject = normalized.subject ? formatMentionSubject(normalized.subject) : ""
const additionalClass = toPlainString(attrs.class ?? attrs.className)
const statusToneClass = statusTone[normalized.status] ?? "bg-slate-400"
const dotClass = getTicketStatusDotClass(normalized.status)
root.className = cn(TICKET_MENTION_BASE_CLASSES, additionalClass)
root.dataset.ticketMention = "true"
dotEl.className = cn(TICKET_MENTION_DOT_BASE_CLASSES, statusToneClass)
dotEl.className = cn(TICKET_MENTION_DOT_BASE_CLASSES, dotClass)
referenceEl.className = TICKET_MENTION_REF_CLASSES
subjectEl.className = TICKET_MENTION_SUBJECT_CLASSES
separatorEl.className = TICKET_MENTION_SEP_CLASSES
@ -244,8 +231,7 @@ function buildTicketMentionAnchorHtml(attrs: {
const url = attrs.url ?? ""
const displayedReference = reference || id
const formattedSubject = subject ? formatMentionSubject(subject) : ""
const dotToneClass = statusTone[status] ?? "bg-slate-400"
const dotClass = `${TICKET_MENTION_DOT_BASE_CLASSES} ${dotToneClass}`
const dotClass = `${TICKET_MENTION_DOT_BASE_CLASSES} ${getTicketStatusDotClass(status)}`
const title = formattedSubject ? `#${displayedReference}${formattedSubject}` : `#${displayedReference}`
return `<a data-ticket-mention="true" data-ticket-id="${escapeHtml(id)}" data-ticket-reference="${escapeHtml(reference)}" data-ticket-status="${escapeHtml(status)}" data-ticket-priority="${escapeHtml(priority)}" data-ticket-subject="${escapeHtml(subject)}" status="${escapeHtml(status)}" href="${escapeHtml(url)}" class="${escapeHtml(TICKET_MENTION_BASE_CLASSES)}" rel="noopener noreferrer" target="_self" title="${escapeHtml(title)}"><span class="${escapeHtml(dotClass)}"></span><span class="${escapeHtml(TICKET_MENTION_REF_CLASSES)}">#${escapeHtml(displayedReference)}</span><span class="${escapeHtml(TICKET_MENTION_SEP_CLASSES)}">•</span><span class="${escapeHtml(TICKET_MENTION_SUBJECT_CLASSES)}">${escapeHtml(formattedSubject)}</span></a>`
@ -424,8 +410,8 @@ function TicketMentionList({ items, command, onRegister }: TicketMentionSuggesti
<div className="max-h-72 min-w-[320px] space-y-1 overflow-y-auto p-2">
{items.map((item, index) => {
const isActive = index === selectedIndex
const status = statusLabels[item.status] ?? item.status
const statusDot = statusTone[item.status] ?? "bg-slate-400"
const status = getTicketStatusLabel(item.status)
const statusDot = getTicketStatusDotClass(item.status)
const priority = priorityLabels[item.priority] ?? item.priority
return (
<button
@ -579,8 +565,7 @@ const TicketMentionExtension = Mention.extend({
const priority = String(HTMLAttributes.priority ?? HTMLAttributes["data-ticket-priority"] ?? "MEDIUM").toUpperCase()
const href = String(HTMLAttributes.url ?? HTMLAttributes.href ?? "#")
const anchorClass = cn(TICKET_MENTION_BASE_CLASSES, toPlainString(HTMLAttributes.class ?? HTMLAttributes.className))
const statusToneClass = statusTone[status] ?? "bg-slate-400"
const dotClass = cn(TICKET_MENTION_DOT_BASE_CLASSES, statusToneClass)
const dotClass = cn(TICKET_MENTION_DOT_BASE_CLASSES, getTicketStatusDotClass(status))
return [
"a",
{