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 list_files 13 54 $0.0000 1 read_file, get_guidelines, list_components 81 56 $0.0000 2 get_component, get_component, get_component, get_component, get_component, get_component, get_component, get_component, get_component, get_component, get_component, get_component, get_component, get_component, get_component, get_component, get_component 5,388 461
Output cap The provider's default 4 Card,
5 CardBody,
6 CardDescription,
7 CardFooter,
8 CardHeader,
9 CardTitle,
10 Clipboard,
11 DataList,
12 FormatDate,
13 FormatNumber,
14 Heading,
15 Link,
16 Stack,
17 Table,
18 TableBody,
19 TableCell,
20 TableHead,
21 TableHeader,
22 TableRow,
23 Text,
24 Tooltip,
25 } from "@vektos/ds";
26
27 export default function AccountPage() {
28 const account = data.account;
29
30 return (
31 <Stack gap="6">
32 <Breadcrumb
33 items={[
34 { label: "Accounts", href: "/accounts" },
35 { label: account.name },
36 ]}
37 />
38 <Heading level={1}>{account.name}</Heading>
39
40 <Card>
41 <CardHeader>
42 <CardTitle>Account details</CardTitle>
43 </CardHeader>
44 <CardBody>
45 <DataList
46 items={[
47 { label: "Holder", value: account.holder },
48 {
49 label: "IBAN",
50 value: (
51 <Stack flexDirection="row" alignItems="center" gap="2">
52 <Text as="span" mono>
53 {account.iban}
54 </Text>
55 <Tooltip content="Copies the IBAN to the clipboard">
56 <Clipboard
57 label="IBAN"
58 value={account.iban}
59 showValue={false}
60 />
61 </Tooltip>
62 </Stack>
63 ),
64 },
65 {
66 label: "BIC",
67 value: <Text as="span" mono>{account.bic}</Text>,
68 },
69 {
70 label: "Balance",
71 value: (
72 <FormatNumber
73 value={account.balance}
74 format="currency"
75 currency={account.currency}
76 />
77 ),
78 },
79 {
80 label: "Available balance",
81 value: (
82 <FormatNumber
83 value={account.available}
84 format="currency"
85 currency={account.currency}
86 />
87 ),
88 },
89 ]}
90 />
91 </CardBody>
92 </Card>
93
94 <Card>
95 <CardHeader>
96 <CardTitle>Recent transactions</CardTitle>
97 <CardDescription>The five most recent.</CardDescription>
98 </CardHeader>
99 <Table aria-label="Recent transactions">
100 <TableHead>
101 <TableRow>
102 <TableHeader>Date</TableHeader>
103 <TableHeader>Description</TableHeader>
104 <TableHeader numeric>Amount</TableHeader>
105 </TableRow>
106 </TableHead>
107 <TableBody>
108 {data.recent.map((transaction) => (
109 <TableRow key={transaction.id}>
110 <TableCell>
111 <FormatDate value={transaction.date} />
112 </TableCell>
113 <TableCell>{transaction.description}</TableCell>
114 <TableCell numeric>
115 <FormatNumber
116 value={transaction.amount}
117 format="currency"
118 currency={account.currency}
119 signDisplay="exceptZero"
120 />
121 </TableCell>
122 </TableRow>
123 ))}
124 </TableBody>
125 </Table>
126 <CardFooter>
127 <Link href="/accounts/business/transactions" variant="plain">
128 View all transactions
129 </Link>
130 </CardFooter>
131 </Card>
132 </Stack>
133 );
134 }
3 list_files 14,584 810 $0.0000
8 list_tokens, list_tokens 1,042 46 $0.0000
9 write_file 493 3,538 $0.0000
10 check_code 3,607 704 $0.0000
11 write_file 742 2,569 $0.0000
12 check_code 2,631 709 $0.0000