Runs / transactions Batch Runs from different design-system versions should not be compared.
The page A screenshot in each theme, as the benchmark took it.
page.tsx As the agent left it; marked lines broke a rule.
Violations None. The run followed every rule that was checked.
Steps One row per model call, with the tools it asked for. An agent that reads the guidelines before writing shows it here; what a checker or submit_view answered is under its call.
Step Tools Tokens in Tokens out Cost 0 list_files 1,362 49 $0.0000 1 read_file 1,431 47 $0.0000 2 list_components 3,520 127 $0.0000 3
cdb5d9e77633
Output cap The provider's default 4 import {
5 SegmentGroup,
6 Table,
7 TableHead,
8 TableBody,
9 TableRow,
10 TableHeader,
11 TableCell,
12 Badge,
13 FormatNumber,
14 FormatDate,
15 Pagination,
16 Stack,
17 } from "@vektos/ds";
18 import { useState } from "react";
19
20 const pageSize = data.pageSize;
21 const transactions = data.transactions.toSorted(
22 (a, b) => new Date(b.date).valueOf() - new Date(a.date).valueOf()
23 );
24
25 export default function Page() {
26 const [view, setView] = useState<string>("all");
27 const [currentPage, setCurrentPage] = useState(1);
28
29 const filtered = transactions.filter((tx) => {
30 if (view === "in") return tx.amount > 0;
31 if (view === "out") return tx.amount < 0;
32 return true;
33 });
34
35 const totalPages = Math.ceil(filtered.length / pageSize) || 1;
36 const start = (currentPage - 1) * pageSize;
37 const pageTransactions = filtered.slice(start, start + pageSize);
38
39 const handleViewChange = (val: string) => {
40 setView(val);
41 setCurrentPage(1);
42 };
43
44 return (
45 <Stack>
46 <h1>{data.account.name}</h1>
47
48 <SegmentGroup
49 aria-label="View"
50 defaultValue="all"
51 options={[
52 { label: "All", value: "all" },
53 { label: "Money In", value: "in" },
54 { label: "Money Out", value: "out" },
55 ]}
56 onValueChange={handleViewChange}
57 size="sm"
58 />
59
60 <Table aria-label="Transactions">
61 <TableHead>
62 <TableRow>
63 <TableHeader>Date</TableHeader>
64 <TableHeader>Description</TableHeader>
65 <TableHeader>Amount</TableHeader>
66 <TableHeader>Status</TableHeader>
67 </TableRow>
68 </TableHead>
69 <TableBody>
70 {pageTransactions.map((tx) => (
71 <TableRow key={tx.id}>
72 <TableCell>
73 <FormatDate value={tx.date} dateStyle="medium" />
74 </TableCell>
75 <TableCell>{tx.description}</TableCell>
76 <TableCell>
77 <FormatNumber
78 value={tx.amount}
79 format="currency"
80 currency="EUR"
81 signDisplay="exceptZero"
82 />
83 </TableCell>
84 <TableCell>
85 <Badge
86 tone={
87 tx.status === "pending"
88 ? "warning"
89 : tx.status === "booked"
90 ? "neutral"
91 : "neutral"
92 }
93 >
94 {tx.status}
95 </Badge>
96 </TableCell>
97 </TableRow>
98 ))}
99 </TableBody>
100 </Table>
101
102 <Pagination
103 page={currentPage}
104 count={totalPages}
105 onPageChange={(page) => setCurrentPage(page)}
106 aria-label="Transaction pages"
107 />
108 </Stack>
109 );
110 }
4 get_component 7,470 129 $0.0000
5 get_component 2,376 42 $0.0000
6 get_component 940 34 $0.0000
7 get_component 2,074 30 $0.0000
8 write_file 622 1,329 $0.0000
9 check_code 1,977 944 $0.0000
10 write_file 1,295 3,221 $0.0000
11 check_code 4,543 839 $0.0000
12 write_file 1,338 2,275 $0.0000
13 check_code 1,544 726 $0.0000
14 write_file 287 823 $0.0000
15 check_code 1,137 719 $0.0000
16 write_file 1,921 1,759 $0.0000
17 check_code 3,707 708 $0.0000