Runs / loan-contract Batch Runs from different design-system versions should not be compared.
page.tsx As the agent left it; marked lines broke a rule.
Violations 11 counted, under 7 rules. “Not counted” marks a compiler error that restates a design-system violation, “Ignored” one the agent silenced with a comment.
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 840 40 $0.0000 1 write_file 1,650 1,550 $0.0000 2 stop 1,131 27 $0.0000
cdb5d9e77633
Output cap The provider's default 11
12
13 const title = css({
14 fontSize: "2xl",
15 fontWeight: 600,
16 marginBottom: 1,
17 });
18
19 const section = css({
20 marginTop: 32,
21 borderTop: "1px solid #e2e8f0",
22 paddingTop: 24,
23 });
24
25 const label = css({
26 display: "block",
27 fontSize: "sm",
28 color: "#64748b",
29 marginBottom: 4,
30 });
31
32 const value = css({
33 fontSize: "lg",
34 marginBottom: 4,
35 });
36
37 const currency = css({
38 fontWeight: 500,
39 });
40
41 function formatNumber(n: number) {
42 return n.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
43 }
44
45 export default function DetailPage() {
46 const {
47 contract: {
48 number,
49 product,
50 status,
51 principal,
52 nominalRate,
53 apr,
54 termMonths,
55 monthlyPayment,
56 startDate,
57 outstanding,
58 },
59 schedule,
60 documents,
61 } = data;
62
63 return (
64 <div {...styles}>
65 <h1 {...title}>Personal Loan Contract Details</h1>
66
67 <div>
68 <p>{product}</p>
69 <p><strong>Contract number:</strong> {number}</p>
70 <p><strong>Status:</strong> {status}</p>
71 </div>
72
73 <section>
74 <label>Key Terms</label>
75 <ul>
76 <li>
77 <span className={label}>Amount borrowed</span>
78 <span className={value}>{currency}{formatNumber(principal)}</span>
79 </li>
80 <li>
81 <span className={label}>Nominal interest rate</span>
82 <span className={value}>{(nominalRate * 100).toFixed(2)}%</span>
83 </li>
84 <li>
85 <span className={label}>APR</span>
86 <span className={value}>{(apr * 100).toFixed(2)}%</span>
87 </li>
88 <li>
89 <span className={label}>Term</span>
90 <span className={value>{termMonths} months</span>
91 </li>
92 <li>
93 <span className={label}>Monthly payment</span>
94 <span className={value}>{currency}{formatNumber(monthlyPayment)}</span>
95 </li>
96 <li>
97 <span className={label}>Start date</span>
98 <span className={value}>{new Date(startDate).toLocaleDateString()}</span>
99 </li>
100 <li>
101 <span className={label}>Outstanding</span>
102 <span className={value}>{currency}{formatNumber(outstanding)}</span>
103 </li>
104 </ul>
105 </section>
106
107 <section>
108 <label>Repayment schedule</label>
109 <table>
110 <thead>
111 <tr>
112 <th>Due date</th>
113 <th>Payment</th>
114 <th>Principal</th>
115 <th>Interest</th>
116 <th>Balance left</th>
117 <th>Status</th>
118 </tr>
119 </thead>
120 <tbody>
121 {schedule.map((inst) => (
122 <tr key={inst.number}>
123 <td>{new Date(inst.dueDate).toLocaleDateString()}</td>
124 <td>{currency}{formatNumber(inst.payment)}</td>
125 <td>{formatNumber(inst.principal)}</td>
126 <td>{formatNumber(inst.interest)}</td>
127 <td>{currency}{formatNumber(inst.remaining)}</td>
128 <td>{inst.status}</td>
129 </tr>
130 ))}
131 </tbody>
132 </table>
133 </section>
134
135 <section>
136 <label>Signed documents</label>
137 <ul>
138 {documents.map((doc) => (
139 <li key={doc.name}>
140 {doc.name} – signed {new Date(doc.signedAt).toLocaleDateString()}
141 </li>
142 ))}
143 </ul>
144 </section>
145 </div>
146 );
147 }
lint/syntax-error 1 quality
render/build-failed 1 completeness typecheck/TS1003 1 quality typecheck/TS1109 1 quality typecheck/TS2657 1 quality