Improve analysis group headings

This commit is contained in:
2026-08-05 11:38:28 +02:00
parent 125b1d22ff
commit 0325631d02
+18 -8
View File
@@ -856,17 +856,22 @@ export function AnalysisPage({ onNavigate }: AnalysisPageProps) {
</TableRow>
</TableHeader>
<TableBody>
{ticketSections.map((section) => (
{ticketSections.map((section, sectionIndex) => (
<Fragment key={section.key}>
{ticketViewSettings.groupBy !== "none" ? (
<TableRow className="bg-muted/40 hover:bg-muted/40">
<TableCell colSpan={9}>
<TableRow className={`${sectionIndex > 0 ? "border-t-[12px] border-t-background" : ""} border-b-2 border-border bg-muted/70 hover:bg-muted/70`}>
<TableCell colSpan={9} className="py-0">
<div className="flex flex-wrap items-center justify-between gap-3 rounded-md border border-border/80 bg-card px-3 py-2 shadow-sm">
<div className="flex min-w-0 items-center gap-2">
<span className="rounded-sm bg-primary px-1.5 py-0.5 text-[10px] font-semibold uppercase tracking-wide text-primary-foreground">Gruppe</span>
<span className="truncate text-base font-semibold">{section.label}</span>
</div>
<div className="flex flex-wrap items-center gap-2">
<span className="font-semibold">{section.label}</span>
<Badge variant="outline">{section.ticketCount} Ticket(s)</Badge>
<Badge variant="outline">{formatMinutes(section.totalMinutes)}</Badge>
{section.openCount > 0 ? <Badge variant="warning">{section.openCount} offen</Badge> : <Badge variant="success">bewertet</Badge>}
</div>
</div>
</TableCell>
</TableRow>
) : null}
@@ -902,15 +907,20 @@ export function AnalysisPage({ onNavigate }: AnalysisPageProps) {
</div>
<div className="space-y-2 md:hidden">
{ticketSections.map((section) => (
<div key={section.key} className="space-y-2">
{ticketSections.map((section, sectionIndex) => (
<div key={section.key} className={`space-y-2 ${ticketViewSettings.groupBy !== "none" && sectionIndex > 0 ? "pt-3" : ""}`}>
{ticketViewSettings.groupBy !== "none" ? (
<div className="flex flex-wrap items-center gap-2 rounded-md border bg-muted/40 px-3 py-2">
<span className="font-semibold">{section.label}</span>
<div className="rounded-md border-2 border-border bg-card px-3 py-2 shadow-sm">
<div className="mb-2 flex min-w-0 items-center gap-2">
<span className="rounded-sm bg-primary px-1.5 py-0.5 text-[10px] font-semibold uppercase tracking-wide text-primary-foreground">Gruppe</span>
<span className="truncate text-base font-semibold">{section.label}</span>
</div>
<div className="flex flex-wrap items-center gap-2">
<Badge variant="outline">{section.ticketCount} Ticket(s)</Badge>
<Badge variant="outline">{formatMinutes(section.totalMinutes)}</Badge>
{section.openCount > 0 ? <Badge variant="warning">{section.openCount} offen</Badge> : <Badge variant="success">bewertet</Badge>}
</div>
</div>
) : null}
{section.tickets.map((ticket) => (
<div key={ticket.id} className="space-y-2 rounded-md border bg-background p-3">