style: align active session badge with timer

This commit is contained in:
esdrasrenan 2025-10-05 00:15:30 -03:00
parent c5a537a833
commit d56bb3e7b3

View file

@ -3,7 +3,7 @@
import { useEffect, useMemo, useState } from "react"
import { format, formatDistanceToNow } from "date-fns"
import { ptBR } from "date-fns/locale"
import { IconPlayerPause, IconPlayerPlay } from "@tabler/icons-react"
import { IconClock, IconPlayerPause, IconPlayerPlay } from "@tabler/icons-react"
import { useMutation, useQuery } from "convex/react"
import { toast } from "sonner"
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
@ -199,6 +199,11 @@ export function TicketSummaryHeader({ ticket }: TicketHeaderProps) {
return (
<div className={cardClass}>
<div className="absolute right-6 top-6 flex items-center gap-3">
{isPlaying ? (
<Badge className="inline-flex h-9 items-center gap-2 rounded-full border border-black bg-black px-3 text-sm font-semibold text-white">
<IconClock className="size-4" /> Sessão atual: {formattedCurrentSession}
</Badge>
) : null}
{workSummary ? (
<Badge className="inline-flex h-9 items-center gap-2 rounded-full border border-slate-200 bg-white px-3 text-sm font-semibold text-neutral-700">
Tempo total: {formattedTotalWorked}
@ -256,15 +261,6 @@ export function TicketSummaryHeader({ ticket }: TicketHeaderProps) {
)}
</Button>
</div>
{workSummary ? (
<div className="flex flex-wrap items-center gap-2">
{isPlaying ? (
<Badge className="inline-flex items-center gap-1 rounded-full border border-black bg-black px-3 py-1 text-xs font-semibold text-white">
Sessão atual: {formattedCurrentSession}
</Badge>
) : null}
</div>
) : null}
{editing ? (
<div className="space-y-2">
<Input