Runs / account-details 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 read_file 1,408 40 $0.0000 1 list_components 1,870 52 $0.0000 2 get_component 4,371 265 $0.0000 3
cdb5d9e77633
Output cap The provider's default 4 import data from "./fixture.json";
5
6 import {
7 Breadcrumb,
8 Card,
9 CardHeader,
10 CardTitle,
11 CardBody,
12 DataList,
13 FormatNumber,
14 Tooltip,
15 Clipboard,
16 Stack,
17 Text,
18 Link,
19 } from "@vektos/ds";
20
21 export default function Page() {
22 const {
23 account: { name, holder, iban, bic, balance, available },
24 recent,
25 } = data;
26
27 return (
28 <div>
29 {/* Breadcrumb navigation */}
30 <Breadcrumb
31 items={[
32 { label: "Accounts", href: "/accounts" },
33 { label: name },
34 ]}
35 />
36
37 {/* Account card */}
38 <Card>
39 <CardHeader>
40 <CardTitle>{name}</CardTitle>
41 </CardHeader>
42
43 <CardBody>
44 <DataList
45 items={[
46 { label: "Holder", value: holder },
47 {
48 label: "IBAN",
49 value: (
50 <Stack flexDirection="row" alignItems="center" gap="1">
51 <Text mono>{iban}</Text>
52 <Tooltip content="Copies the IBAN to the clipboard" placement="top">
53 <Clipboard label="IBAN" value={iban} showValue={false} />
54 </Tooltip>
55 </Stack>
56 ),
57 },
58 { label: "BIC", value: bic },
59 {
60 label: "Balance",
61 value: (
62 <FormatNumber
63 value={balance}
64 format="currency"
65 currency="EUR"
66 signDisplay="exceptZero"
67 />
68 ),
69 },
70 {
71 label: "Available",
72 value: (
73 <FormatNumber
74 value={available}
75 format="currency"
76 currency="EUR"
77 signDisplay="exceptZero"
78 />
79 ),
80 },
81 ]}
82 orientation="vertical"
83 />
84 </CardBody>
85 </Card>
86
87 {/* Recent transactions */}
88 <Stack>
89 <Text size="sm" weight="medium">
90 Recent transactions
91 </Text>
92 <Stack gap="2">
93 {recent.map((tx) => (
94 <Stack
95 key={tx.id}
96 flexDirection="row"
97 alignItems="center"
98 justifyContent="space-between"
99 gap="1"
100 >
101 <Text>{tx.date}</Text>
102 <Stack flexDirection="row" alignItems="center" gap="1">
103 <Text>{tx.description}</Text>
104 <FormatNumber
105 value={tx.amount}
106 format="currency"
107 currency="EUR"
108 signDisplay="exceptZero"
109 />
110 </Stack>
111 </Stack>
112 ))}
113 </Stack>
114
115 <Link
116 href="/accounts/business/transactions"
117 variant="underline"
118 >
119 View all transactions
120 </Link>
121 </Stack>
122 </div>
123 );
124 }
4 get_component 1,820 757 $0.0000
5 get_component 1,046 75 $0.0000
6 write_file 2,221 944 $0.0000
7 check_code 3,191 726 $0.0000
8 check_code 2,771 809 $0.0000
9 get_component 2,098 173 $0.0000
10 get_component 2,820 217 $0.0000
11 write_file 1,953 766 $0.0000
12 check_code 2,746 668 $0.0000
13 write_file 3,502 1,098 $0.0000
14 check_code 435 653 $0.0000
15 write_file 1,176 1,253 $0.0000
16 check_code 2,456 658 $0.0000