esdras/sistema-de-chamados
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

UI: corrigir duplicidade do Encerrar, padronizar ciano, ajustar tamanho do ícone de tempo; atualizar cabeçalho do login; inverter ordem (Novo ticket à esquerda, Compartilhar à direita) no ticket individual

Browse source
This commit is contained in:
codex-bot 2025-10-20 17:40:17 -03:00
parent 741a0b5b70
commit 2f798d934a
4 changed files with 47 additions and 45 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/app/login/login-page-client.tsx
View file

@ -55,16 +55,11 @@ export function LoginPageClient() {
<div className="grid min-h-svh lg:grid-cols-2"> <div className="grid min-h-svh lg:grid-cols-2">
<div className="flex flex-col gap-6 p-6 md:p-10"> <div className="flex flex-col gap-6 p-6 md:p-10">
<div className="flex flex-col items-center gap-1.5 text-center"> <div className="flex flex-col items-center gap-1.5 text-center">
<Link href="/" className="flex items-center gap-2 text-xl font-semibold text-neutral-900"> <Link href="/" className="text-xl font-semibold text-neutral-900">
<Image <div className="flex flex-col leading-none items-center">
src="/logo-raven.png" <span>Sistema de chamados</span>
alt="Logotipo Raven" <span className="text-xs text-muted-foreground">Por Rever Tecnologia</span>
width={40} </div>
height={40}
className="h-10 w-auto"
priority
/>
Raven
</Link> </Link>
</div> </div>
<div className="flex flex-1 items-center justify-center"> <div className="flex flex-1 items-center justify-center">

4
src/app/tickets/[id]/page.tsx
View file

@ -18,8 +18,8 @@ export default async function TicketDetailPage({ params }: TicketDetailPageProps
<SiteHeader <SiteHeader
title={`Ticket #${id}`} title={`Ticket #${id}`}
lead={"Detalhes do ticket"} lead={"Detalhes do ticket"}
secondaryAction={<SiteHeader.SecondaryButton>Compartilhar</SiteHeader.SecondaryButton>} secondaryAction={<NewTicketDialogDeferred />}
primaryAction={<NewTicketDialogDeferred />} primaryAction={<SiteHeader.SecondaryButton>Compartilhar</SiteHeader.SecondaryButton>}
/> />
} }
> >

68
src/components/tickets/status-select.tsx
View file

@ -83,11 +83,13 @@ export function StatusSelect({
value, value,
tenantId, tenantId,
requesterName, requesterName,
showCloseButton = true,
}: { }: {
ticketId: string ticketId: string
value: TicketStatus value: TicketStatus
tenantId: string tenantId: string
requesterName?: string | null requesterName?: string | null
showCloseButton?: boolean
}) { }) {
const { convexUserId } = useAuth() const { convexUserId } = useAuth()
const actorId = (convexUserId ?? null) as Id<"users"> | null const actorId = (convexUserId ?? null) as Id<"users"> | null
@ -104,38 +106,42 @@ export function StatusSelect({
<Badge className={cn(baseBadgeClass, statusStyles[status]?.badgeClass ?? statusStyles.PENDING.badgeClass)}> <Badge className={cn(baseBadgeClass, statusStyles[status]?.badgeClass ?? statusStyles.PENDING.badgeClass)}>
{statusStyles[status]?.label ?? statusStyles.PENDING.label} {statusStyles[status]?.label ?? statusStyles.PENDING.label}
</Badge> </Badge>
<Tooltip> {showCloseButton ? (
<TooltipTrigger asChild> <Tooltip>
<Button <TooltipTrigger asChild>
type="button" <Button
size="icon" type="button"
aria-label="Encerrar ticket" size="icon"
onClick={() => setCloseDialogOpen(true)} aria-label="Encerrar ticket"
className="h-9 w-9 rounded-lg border border-emerald-300 bg-white text-emerald-700 transition hover:bg-emerald-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-emerald-200" onClick={() => setCloseDialogOpen(true)}
> className="h-9 w-9 rounded-lg border border-[#00d6eb] bg-white text-[#00d6eb] transition hover:bg-[#00d6eb]/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#00d6eb]/30"
<CheckCircle2 className="size-4" /> >
</Button> <CheckCircle2 className="size-4" />
</TooltipTrigger> </Button>
<TooltipContent className="rounded-lg border border-slate-200 bg-white px-3 py-2 text-xs font-medium text-neutral-700 shadow-lg"> </TooltipTrigger>
Encerrar ticket <TooltipContent className="rounded-lg border border-slate-200 bg-white px-3 py-2 text-xs font-medium text-neutral-700 shadow-lg">
</TooltipContent> Encerrar ticket
</Tooltip> </TooltipContent>
</Tooltip>
) : null}
</div> </div>
{/* Dialog control moved to header; keep for status-only contexts */} {/* Dialog control visível apenas quando o botão de encerrar está presente */}
<CloseTicketDialog {showCloseButton ? (
open={closeDialogOpen} <CloseTicketDialog
onOpenChange={(open) => { open={closeDialogOpen}
if (!open) setCloseDialogOpen(false) onOpenChange={(open) => {
}} if (!open) setCloseDialogOpen(false)
ticketId={ticketId} }}
tenantId={tenantId} ticketId={ticketId}
actorId={actorId} tenantId={tenantId}
requesterName={requesterName} actorId={actorId}
onSuccess={() => { requesterName={requesterName}
setStatus("RESOLVED") onSuccess={() => {
setCloseDialogOpen(false) setStatus("RESOLVED")
}} setCloseDialogOpen(false)
/> }}
/>
) : null}
</> </>
) )
} }

5
src/components/tickets/ticket-summary-header.tsx
View file

@ -621,7 +621,7 @@ export function TicketSummaryHeader({ ticket }: TicketHeaderProps) {
<div className="absolute right-6 top-6 flex items-center gap-3"> <div className="absolute right-6 top-6 flex items-center gap-3">
<Button <Button
type="button" type="button"
className="inline-flex items-center gap-2 rounded-lg border border-sky-300 bg-white px-3 py-1.5 text-sm font-semibold text-sky-700 transition hover:bg-sky-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sky-200" className="inline-flex items-center gap-2 rounded-lg border border-[#00d6eb] bg-white px-3 py-1.5 text-sm font-semibold text-[#00d6eb] transition hover:bg-[#00d6eb]/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#00d6eb]/30"
onClick={() => setCloseOpen(true)} onClick={() => setCloseOpen(true)}
> >
<CheckCircle2 className="size-4" /> Encerrar <CheckCircle2 className="size-4" /> Encerrar
@ -633,7 +633,7 @@ export function TicketSummaryHeader({ ticket }: TicketHeaderProps) {
className="inline-flex h-9 cursor-help items-center gap-2 rounded-full border border-slate-200 bg-white px-3 text-sm font-semibold text-neutral-700" className="inline-flex h-9 cursor-help items-center gap-2 rounded-full border border-slate-200 bg-white px-3 text-sm font-semibold text-neutral-700"
title="Tempo total de atendimento" title="Tempo total de atendimento"
> >
<IconClock className="size-4 text-neutral-700" /> {formattedTotalWorked} <IconClock className="size-5 text-neutral-700" /> {formattedTotalWorked}
</Badge> </Badge>
</TooltipTrigger> </TooltipTrigger>
<TooltipContent className="rounded-lg border border-slate-200 bg-white px-3 py-2 text-xs font-medium text-neutral-700 shadow-lg"> <TooltipContent className="rounded-lg border border-slate-200 bg-white px-3 py-2 text-xs font-medium text-neutral-700 shadow-lg">
@ -692,6 +692,7 @@ export function TicketSummaryHeader({ ticket }: TicketHeaderProps) {
value={status} value={status}
tenantId={ticket.tenantId} tenantId={ticket.tenantId}
requesterName={ticket.requester?.name ?? ticket.requester?.email ?? null} requesterName={ticket.requester?.name ?? ticket.requester?.email ?? null}
showCloseButton={false}
/> />
{isPlaying ? ( {isPlaying ? (
<Tooltip> <Tooltip>