pch/festbench-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ui: collapse band suite rows behind clickable devlogic/sysops totals

Browse source
This commit is contained in:
PeterChrz 2026-10-07 06:22:07 -04:00
parent 2252dcd3fe
commit f5ec9ecc5e
Signed by untrusted user who does not match committer: pch
GPG key ID: 8F0826ECF7302C63
1 changed files with 33 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
resources/views/livewire/summary/index.blade.php
View file

@ -18,9 +18,18 @@
'suite' => [], 'suite' => [],
]; ];
/** @var array<int, bool> session_summary_id => expanded */
public array $expanded = [];
public function updatedFilters(): void public function updatedFilters(): void
{ {
$this->resetPage(); $this->resetPage();
$this->expanded = [];
}
public function toggleExpand(int $sessionId): void
{
$this->expanded[$sessionId] = ! ($this->expanded[$sessionId] ?? false);
} }
public function resetFilters(): void public function resetFilters(): void
@ -173,7 +182,7 @@ public function suites(): array
<div class="flex items-center justify-between"> <div class="flex items-center justify-between">
<div> <div>
<flux:heading size="xl">{{ __('FestBench - Benchmarks') }}</flux:heading> <flux:heading size="xl">{{ __('FestBench - Benchmarks') }}</flux:heading>
<flux:subheading>{{ __('GPU, model, suite scores — click a suite line for per-task detail.') }}</flux:subheading> <flux:subheading>{{ __('GPU, model, suite scores — click a total to expand benchmark rows.') }}</flux:subheading>
</div> </div>
<flux:button variant="ghost" icon="table-cells" href="{{ route('results') }}" wire:navigate>{{ __('All task rows') }}</flux:button> <flux:button variant="ghost" icon="table-cells" href="{{ route('results') }}" wire:navigate>{{ __('All task rows') }}</flux:button>
</div> </div>
@ -223,6 +232,7 @@ class="cursor-pointer"
@if ($this->sessions->count() > 0) @if ($this->sessions->count() > 0)
<div class="mt-6 flex flex-col gap-4"> <div class="mt-6 flex flex-col gap-4">
@foreach ($this->sessions as $session) @foreach ($this->sessions as $session)
@php $isExpanded = $this->expanded[$session->band->id] ?? false; @endphp
<flux:card class="!p-0"> <flux:card class="!p-0">
<div class="flex flex-wrap items-center gap-x-4 gap-y-1 border-b border-zinc-200 px-4 py-3 dark:border-zinc-700"> <div class="flex flex-wrap items-center gap-x-4 gap-y-1 border-b border-zinc-200 px-4 py-3 dark:border-zinc-700">
<flux:icon name="cpu" class="size-4 text-zinc-500" /> <flux:icon name="cpu" class="size-4 text-zinc-500" />
@ -253,11 +263,17 @@ class="cursor-pointer"
: $session->suites; : $session->suites;
$devlogicRows = $visibleSuites->filter(fn ($r) => in_array($r->suite, $devlogicSuites)); $devlogicRows = $visibleSuites->filter(fn ($r) => in_array($r->suite, $devlogicSuites));
$sysopsRows = $visibleSuites->filter(fn ($r) => in_array($r->suite, $sysopsSuites)); $sysopsRows = $visibleSuites->filter(fn ($r) => in_array($r->suite, $sysopsSuites));
$hasDevlogic = $devlogicRows->isNotEmpty() && ($suiteFilterActive || $session->band->devlogic_tps !== null);
$hasSysops = $sysopsRows->isNotEmpty() && ($suiteFilterActive || $session->band->sysops_tps !== null);
@endphp @endphp
{{-- Devlogic section: total strip + column headers + suite rows --}} {{-- Devlogic section: total strip (click to expand) + suite rows (when expanded) --}}
@if ($devlogicRows->isNotEmpty() && ($suiteFilterActive || $session->band->devlogic_tps !== null)) @if ($hasDevlogic)
@unless ($suiteFilterActive) @unless ($suiteFilterActive)
<div class="flex flex-wrap items-center gap-x-4 gap-y-1 border-l-2 border-sky-400 bg-sky-50/50 px-4 py-2 dark:border-sky-500 dark:bg-sky-950/20"> <button type="button"
wire:click="toggleExpand({{ $session->band->id }})"
class="flex w-full flex-wrap items-center gap-x-4 gap-y-1 border-l-2 border-sky-400 bg-sky-50/50 px-4 py-2 text-left transition hover:bg-sky-50 dark:border-sky-500 dark:bg-sky-950/20 dark:hover:bg-sky-950/40"
>
<flux:icon name="{{ $isExpanded ? 'chevron-down' : 'chevron-right' }}" variant="mini" class="size-4 text-sky-500" />
<span class="text-xs font-semibold uppercase tracking-wider text-sky-600 dark:text-sky-400">{{ __('Devlogic total') }}</span> <span class="text-xs font-semibold uppercase tracking-wider text-sky-600 dark:text-sky-400">{{ __('Devlogic total') }}</span>
<span class="text-sm"> <span class="text-sm">
<span class="font-mono font-semibold">{{ number_format($session->band->devlogic_tps, 1) }}</span> <span class="font-mono font-semibold">{{ number_format($session->band->devlogic_tps, 1) }}</span>
@ -271,8 +287,9 @@ class="cursor-pointer"
<flux:badge size="xs" color="emerald">✔ {{ $session->band->devlogic_passed }}</flux:badge> <flux:badge size="xs" color="emerald">✔ {{ $session->band->devlogic_passed }}</flux:badge>
<flux:badge size="xs" color="{{ $session->band->devlogic_failed > 0 ? 'rose' : 'zinc' }}">✘ {{ $session->band->devlogic_failed }}</flux:badge> <flux:badge size="xs" color="{{ $session->band->devlogic_failed > 0 ? 'rose' : 'zinc' }}">✘ {{ $session->band->devlogic_failed }}</flux:badge>
</span> </span>
</div> </button>
@endunless @endunless
@if ($isExpanded || $suiteFilterActive)
<div class="hidden px-4 pt-2 md:grid md:grid-cols-[7.5rem_4.5rem_7rem_15rem_6rem_1fr] md:gap-x-4 md:items-center"> <div class="hidden px-4 pt-2 md:grid md:grid-cols-[7.5rem_4.5rem_7rem_15rem_6rem_1fr] md:gap-x-4 md:items-center">
<span class="text-[10px] font-semibold uppercase tracking-wider text-zinc-400">{{ __('Benchmark') }}</span> <span class="text-[10px] font-semibold uppercase tracking-wider text-zinc-400">{{ __('Benchmark') }}</span>
<span class="text-[10px] font-semibold uppercase tracking-wider text-zinc-400">{{ __('Thinking') }}</span> <span class="text-[10px] font-semibold uppercase tracking-wider text-zinc-400">{{ __('Thinking') }}</span>
@ -312,11 +329,16 @@ class="flex flex-wrap items-center gap-x-4 gap-y-1 px-4 py-2.5 hover:bg-zinc-50
</a> </a>
@endforeach @endforeach
</div> </div>
@endif
@endif @endif
{{-- Sysops section: total strip + column headers + suite rows --}} {{-- Sysops section: total strip (click to expand) + suite rows (when expanded) --}}
@if ($sysopsRows->isNotEmpty() && ($suiteFilterActive || $session->band->sysops_tps !== null)) @if ($hasSysops)
@unless ($suiteFilterActive) @unless ($suiteFilterActive)
<div class="flex flex-wrap items-center gap-x-4 gap-y-1 border-l-2 border-amber-400 bg-amber-50/50 px-4 py-2 dark:border-amber-500 dark:bg-amber-950/20"> <button type="button"
wire:click="toggleExpand({{ $session->band->id }})"
class="flex w-full flex-wrap items-center gap-x-4 gap-y-1 border-l-2 border-amber-400 bg-amber-50/50 px-4 py-2 text-left transition hover:bg-amber-50 dark:border-amber-500 dark:bg-amber-950/20 dark:hover:bg-amber-950/40"
>
<flux:icon name="{{ $isExpanded ? 'chevron-down' : 'chevron-right' }}" variant="mini" class="size-4 text-amber-500" />
<span class="text-xs font-semibold uppercase tracking-wider text-amber-600 dark:text-amber-400">{{ __('Sysops total') }}</span> <span class="text-xs font-semibold uppercase tracking-wider text-amber-600 dark:text-amber-400">{{ __('Sysops total') }}</span>
<span class="text-sm"> <span class="text-sm">
<span class="font-mono font-semibold">{{ number_format($session->band->sysops_tps, 1) }}</span> <span class="font-mono font-semibold">{{ number_format($session->band->sysops_tps, 1) }}</span>
@ -330,8 +352,9 @@ class="flex flex-wrap items-center gap-x-4 gap-y-1 px-4 py-2.5 hover:bg-zinc-50
<flux:badge size="xs" color="emerald">✔ {{ $session->band->sysops_passed }}</flux:badge> <flux:badge size="xs" color="emerald">✔ {{ $session->band->sysops_passed }}</flux:badge>
<flux:badge size="xs" color="{{ $session->band->sysops_failed > 0 ? 'rose' : 'zinc' }}">✘ {{ $session->band->sysops_failed }}</flux:badge> <flux:badge size="xs" color="{{ $session->band->sysops_failed > 0 ? 'rose' : 'zinc' }}">✘ {{ $session->band->sysops_failed }}</flux:badge>
</span> </span>
</div> </button>
@endunless @endunless
@if ($isExpanded || $suiteFilterActive)
<div class="hidden px-4 pt-2 md:grid md:grid-cols-[7.5rem_4.5rem_7rem_15rem_6rem_1fr] md:gap-x-4 md:items-center"> <div class="hidden px-4 pt-2 md:grid md:grid-cols-[7.5rem_4.5rem_7rem_15rem_6rem_1fr] md:gap-x-4 md:items-center">
<span class="text-[10px] font-semibold uppercase tracking-wider text-zinc-400">{{ __('Benchmark') }}</span> <span class="text-[10px] font-semibold uppercase tracking-wider text-zinc-400">{{ __('Benchmark') }}</span>
<span class="text-[10px] font-semibold uppercase tracking-wider text-zinc-400">{{ __('Thinking') }}</span> <span class="text-[10px] font-semibold uppercase tracking-wider text-zinc-400">{{ __('Thinking') }}</span>
@ -371,6 +394,7 @@ class="flex flex-wrap items-center gap-x-4 gap-y-1 px-4 py-2.5 hover:bg-zinc-50
</a> </a>
@endforeach @endforeach
</div> </div>
@endif
@endif @endif
</flux:card> </flux:card>
@endforeach @endforeach