Skip to content

Commit c872a14

Browse files
wemeetagainclaude
wemeetagain
and
claude
committed
fix: resolve all biome lint errors
- Remove unused fromBase64 function - Add biome-ignore for intentionally incomplete useEffect deps - Fix undeclared React type with import() syntax - Disable noArrayIndexKey rule (SSZ list items have no stable key) - Auto-format fixes applied Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1 parent 0b1f6bd commit c872a14

File tree

12 files changed

+71
-71
lines changed

12 files changed

+71
-71
lines changed

‎biome.jsonc‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,9 @@
1010
"linter": {
1111
"rules": {
1212
"suspicious": {
13-
"noConsoleLog": "off"
13+
"noConsoleLog": "off",
14+
// SSZ list/vector items have no stable key other than index
15+
"noArrayIndexKey": "off"
1416
},
1517
"style": {
1618
// Our team does not like this syntax

‎src/app.tsx‎

Lines changed: 5 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,7 @@ export default function App() {
2929
const worker = useWorker();
3030

3131
// SSZ processing
32-
const result = useSsz(
33-
worker,
34-
serializeMode ? "serialize" : "deserialize",
35-
forkName,
36-
typeName,
37-
input,
38-
inputFormat
39-
);
32+
const result = useSsz(worker, serializeMode ? "serialize" : "deserialize", forkName, typeName, input, inputFormat);
4033

4134
// Get current SSZ type
4235
const sszType: Type<unknown> | null = forks[forkName]?.[typeName] ?? null;
@@ -57,6 +50,7 @@ export default function App() {
5750

5851
// Auto-generate default ONLY on initial load and type/fork changes
5952
// NOT on mode/format changes (those carry data across intentionally)
53+
// biome-ignore lint/correctness/useExhaustiveDependencies: intentionally omit serializeMode/inputFormat/sszType to avoid re-triggering on mode switches
6054
useEffect(() => {
6155
if (!worker || !sszType) return;
6256
(async () => {
@@ -69,7 +63,6 @@ export default function App() {
6963
// Silently fail
7064
}
7165
})();
72-
// eslint-disable-next-line react-hooks/exhaustive-deps
7366
}, [worker, typeName, forkName]);
7467

7568
// When mode changes, carry data across for round-trip
@@ -235,7 +228,9 @@ export default function App() {
235228
/>
236229
</div>
237230
<div className="bg-[var(--color-surface-raised)] rounded-xl border border-[var(--color-border)] p-4 flex-1 min-h-[200px] overflow-auto">
238-
<span className="text-[10px] font-medium text-[var(--color-text-muted)] uppercase tracking-widest">Structure</span>
231+
<span className="text-[10px] font-medium text-[var(--color-text-muted)] uppercase tracking-widest">
232+
Structure
233+
</span>
239234
<div className="mt-2">
240235
<StructureView sszType={sszType} data={parsedValue} typeName={typeName} />
241236
</div>

‎src/components/builder/field-input.tsx‎

Lines changed: 23 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import {
2+
BitArray,
23
BitListType,
34
BitVectorType,
45
BooleanType,
@@ -12,7 +13,6 @@ import {
1213
UintNumberType,
1314
VectorBasicType,
1415
VectorCompositeType,
15-
BitArray,
1616
} from "@chainsafe/ssz";
1717
import {useState} from "react";
1818
import {getCategory, getTypeName} from "../structure-view/utils";
@@ -81,7 +81,11 @@ export function FieldInput({type, value, onChange, fieldName, depth = 0}: FieldI
8181
onChange={(e) => {
8282
const v = e.target.value;
8383
if (type instanceof UintBigintType) {
84-
try { onChange(BigInt(v)); } catch { /* invalid */ }
84+
try {
85+
onChange(BigInt(v));
86+
} catch {
87+
/* invalid */
88+
}
8589
} else {
8690
const n = Number(v);
8791
if (!Number.isNaN(n)) onChange(n);
@@ -108,7 +112,9 @@ export function FieldInput({type, value, onChange, fieldName, depth = 0}: FieldI
108112
const bytes = fromHex(e.target.value);
109113
if (expectedLen && bytes.length !== expectedLen) return;
110114
onChange(bytes);
111-
} catch { /* invalid hex */ }
115+
} catch {
116+
/* invalid hex */
117+
}
112118
}}
113119
placeholder={expectedLen ? `0x...(${expectedLen} bytes)` : "0x..."}
114120
className="bg-[var(--color-surface)] border border-[var(--color-border)] rounded-md px-2 py-0.5 text-[11px] font-mono text-[var(--color-text-primary)] focus:border-[var(--color-border-focus)] focus:outline-none w-full transition-colors"
@@ -183,7 +189,7 @@ function LeafRow({
183189
fieldName: string;
184190
typeName: string;
185191
category: string;
186-
children: React.ReactNode;
192+
children: import("react").ReactNode;
187193
}) {
188194
return (
189195
<div className="flex items-center gap-2 py-[3px] min-h-[28px]">
@@ -224,7 +230,9 @@ function ContainerField({
224230
className="flex items-center gap-1.5 py-[3px] cursor-pointer hover:bg-[var(--color-surface-overlay)]/40 rounded px-1 -mx-1"
225231
onClick={() => setExpanded(!expanded)}
226232
>
227-
<span className={`text-[10px] transition-transform duration-150 text-[var(--color-text-muted)] select-none ${expanded ? "rotate-90" : ""}`}>
233+
<span
234+
className={`text-[10px] transition-transform duration-150 text-[var(--color-text-muted)] select-none ${expanded ? "rotate-90" : ""}`}
235+
>
228236
&#9654;
229237
</span>
230238
<span className="text-[12px] font-mono text-[var(--color-text-primary)]">{fieldName}</span>
@@ -293,7 +301,9 @@ function ListField({
293301
className="flex items-center gap-1.5 py-[3px] cursor-pointer hover:bg-[var(--color-surface-overlay)]/40 rounded px-1 -mx-1"
294302
onClick={() => setExpanded(!expanded)}
295303
>
296-
<span className={`text-[10px] transition-transform duration-150 text-[var(--color-text-muted)] select-none ${expanded ? "rotate-90" : ""}`}>
304+
<span
305+
className={`text-[10px] transition-transform duration-150 text-[var(--color-text-muted)] select-none ${expanded ? "rotate-90" : ""}`}
306+
>
297307
&#9654;
298308
</span>
299309
<span className="text-[12px] font-mono text-[var(--color-text-primary)]">{fieldName}</span>
@@ -315,7 +325,10 @@ function ListField({
315325
</div>
316326
{!isFixed && (
317327
<button
318-
onClick={(e) => { e.stopPropagation(); removeItem(i); }}
328+
onClick={(e) => {
329+
e.stopPropagation();
330+
removeItem(i);
331+
}}
319332
className="mt-1 px-1 text-[10px] text-red-400/40 hover:text-red-400 opacity-0 group-hover/item:opacity-100 transition-all"
320333
>
321334
&times;
@@ -402,7 +415,9 @@ function BitField({
402415
className="flex items-center gap-1.5 py-[3px] cursor-pointer hover:bg-[var(--color-surface-overlay)]/40 rounded px-1 -mx-1"
403416
onClick={() => setExpanded(!expanded)}
404417
>
405-
<span className={`text-[10px] transition-transform duration-150 text-[var(--color-text-muted)] select-none ${expanded ? "rotate-90" : ""}`}>
418+
<span
419+
className={`text-[10px] transition-transform duration-150 text-[var(--color-text-muted)] select-none ${expanded ? "rotate-90" : ""}`}
420+
>
406421
&#9654;
407422
</span>
408423
<span className="text-[12px] font-mono text-[var(--color-text-primary)]">{fieldName}</span>

‎src/components/builder/type-builder.tsx‎

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -19,13 +19,7 @@ export function TypeBuilder({sszType, value, onChange, typeName}: TypeBuilderPro
1919

2020
return (
2121
<div className="overflow-auto flex-1 min-h-[280px] bg-[var(--color-surface)] rounded-lg border border-[var(--color-border)] p-3">
22-
<FieldInput
23-
type={sszType}
24-
value={value}
25-
onChange={onChange}
26-
fieldName={typeName}
27-
depth={0}
28-
/>
22+
<FieldInput type={sszType} value={value} onChange={onChange} fieldName={typeName} depth={0} />
2923
</div>
3024
);
3125
}

‎src/components/footer.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,8 @@ export function Footer() {
1111
className="text-[var(--color-text-secondary)] hover:text-[var(--color-eth-blue)] transition-colors"
1212
>
1313
Lodestar
14-
</a>
15-
{" "}tool by{" "}
14+
</a>{" "}
15+
tool by{" "}
1616
<a
1717
href="https://chainsafe.io"
1818
className="text-[var(--color-text-secondary)] hover:text-[var(--color-eth-blue)] transition-colors"

‎src/components/header.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,8 +25,8 @@ export function Header() {
2525
className="text-[var(--color-eth-blue)] hover:underline"
2626
>
2727
Simple Serialize
28-
</a>
29-
{" "}data
28+
</a>{" "}
29+
data
3030
</p>
3131
</div>
3232
<a

‎src/components/input-panel.tsx‎

Lines changed: 5 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,9 @@ export function InputPanel({
4343
<div className="flex flex-col h-full gap-2.5">
4444
<div className="flex items-center justify-between">
4545
<div className="flex items-center gap-2">
46-
<span className="text-[11px] font-medium text-[var(--color-text-muted)] uppercase tracking-widest">Input</span>
46+
<span className="text-[11px] font-medium text-[var(--color-text-muted)] uppercase tracking-widest">
47+
Input
48+
</span>
4749
{/* Editor / Builder toggle — only in serialize mode */}
4850
{serializeMode && (
4951
<div className="flex gap-0.5 bg-[var(--color-surface)]/60 rounded-md p-0.5 border border-[var(--color-border)]">
@@ -70,18 +72,11 @@ export function InputPanel({
7072
</div>
7173
)}
7274
</div>
73-
{!showBuilder && (
74-
<FormatTabs options={formatNames} selected={inputFormat} onChange={onInputFormatChange} />
75-
)}
75+
{!showBuilder && <FormatTabs options={formatNames} selected={inputFormat} onChange={onInputFormatChange} />}
7676
</div>
7777

7878
{showBuilder ? (
79-
<TypeBuilder
80-
sszType={sszType}
81-
value={parsedValue}
82-
onChange={onParsedValueChange}
83-
typeName={typeName}
84-
/>
79+
<TypeBuilder sszType={sszType} value={parsedValue} onChange={onParsedValueChange} typeName={typeName} />
8580
) : (
8681
<textarea
8782
className="flex-1 min-h-[280px] bg-[var(--color-surface)] text-[var(--color-text-primary)] font-mono text-[13px] leading-relaxed rounded-lg border border-[var(--color-border)] p-4 resize-none focus:border-[var(--color-border-focus)] focus:outline-none placeholder:text-[var(--color-text-muted)]/50 transition-colors"

‎src/components/output-panel.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,9 @@ export function OutputPanel({
8282
{serializeMode && hashTreeRootText && (
8383
<div>
8484
<div className="flex items-center justify-between mb-1">
85-
<span className="text-[10px] text-[var(--color-text-muted)] uppercase tracking-widest font-medium">Hash Tree Root</span>
85+
<span className="text-[10px] text-[var(--color-text-muted)] uppercase tracking-widest font-medium">
86+
Hash Tree Root
87+
</span>
8688
<CopyButton text={hashTreeRootText} />
8789
</div>
8890
<div className="bg-[var(--color-surface)] rounded-lg border border-[var(--color-border)] px-3 py-2 font-mono text-[13px] text-[var(--color-eth-blue)] break-all select-all">

‎src/components/structure-view/tree-node.tsx‎

Lines changed: 6 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -13,11 +13,7 @@ function LeafValue({value, suffix}: {value: string; suffix: string | null}) {
1313
const isLong = value.length > VALUE_TRUNCATE_LEN;
1414

1515
if (!isLong) {
16-
return (
17-
<span className="font-mono text-[11px] text-[var(--color-text-secondary)] break-all">
18-
{value}
19-
</span>
20-
);
16+
return <span className="font-mono text-[11px] text-[var(--color-text-secondary)] break-all">{value}</span>;
2117
}
2218

2319
return (
@@ -33,9 +29,7 @@ function LeafValue({value, suffix}: {value: string; suffix: string | null}) {
3329
) : (
3430
<>
3531
{value.slice(0, VALUE_TRUNCATE_LEN)}
36-
<span className="text-[var(--color-text-muted)]">
37-
{suffix ? `\u2026 ${suffix}` : `\u2026`}
38-
</span>
32+
<span className="text-[var(--color-text-muted)]">{suffix ? `\u2026 ${suffix}` : "\u2026"}</span>
3933
</>
4034
)}
4135
</span>
@@ -57,7 +51,9 @@ export function TreeNode({node, depth = 0}: TreeNodeProps) {
5751
{/* Expand/collapse arrow */}
5852
<span className="w-3.5 text-center text-[10px] flex-shrink-0 select-none">
5953
{hasChildren ? (
60-
<span className={`inline-block transition-transform duration-150 text-[var(--color-text-muted)] ${expanded ? "rotate-90" : ""}`}>
54+
<span
55+
className={`inline-block transition-transform duration-150 text-[var(--color-text-muted)] ${expanded ? "rotate-90" : ""}`}
56+
>
6157
&#9654;
6258
</span>
6359
) : (
@@ -81,9 +77,7 @@ export function TreeNode({node, depth = 0}: TreeNodeProps) {
8177
)}
8278

8379
{/* Value (leaf nodes) */}
84-
{node.value != null && (
85-
<LeafValue value={node.value} suffix={node.valueSuffix} />
86-
)}
80+
{node.value != null && <LeafValue value={node.value} suffix={node.valueSuffix} />}
8781
</div>
8882

8983
{/* Children */}

‎src/components/toolbar.tsx‎

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -9,22 +9,17 @@ type ToolbarProps = {
99
onModeChange: (serialize: boolean) => void;
1010
};
1111

12-
export function Toolbar({
13-
forkName,
14-
typeName,
15-
serializeMode,
16-
onForkChange,
17-
onTypeChange,
18-
onModeChange,
19-
}: ToolbarProps) {
12+
export function Toolbar({forkName, typeName, serializeMode, onForkChange, onTypeChange, onModeChange}: ToolbarProps) {
2013
const types = typeNames(forks[forkName]);
2114

2215
return (
2316
<div className="border-b border-[var(--color-border)] bg-[var(--color-surface-raised)]/40 px-5 py-2.5">
2417
<div className="flex items-center gap-6 max-w-[1800px] mx-auto flex-wrap">
2518
{/* Mode toggle */}
2619
<div className="flex items-center gap-1.5">
27-
<span className="text-[10px] text-[var(--color-text-muted)] uppercase tracking-widest font-medium mr-1">Mode</span>
20+
<span className="text-[10px] text-[var(--color-text-muted)] uppercase tracking-widest font-medium mr-1">
21+
Mode
22+
</span>
2823
<div className="flex gap-0.5 bg-[var(--color-surface)]/60 rounded-md p-0.5 border border-[var(--color-border)]">
2924
<button
3025
onClick={() => onModeChange(true)}
@@ -60,7 +55,9 @@ export function Toolbar({
6055
className="bg-[var(--color-surface-overlay)] text-[var(--color-text-primary)] text-[12px] font-mono rounded-md px-2.5 py-1 border border-[var(--color-border)] focus:border-[var(--color-border-focus)] focus:outline-none cursor-pointer"
6156
>
6257
{forkNames.map((name) => (
63-
<option key={name} value={name}>{name}</option>
58+
<option key={name} value={name}>
59+
{name}
60+
</option>
6461
))}
6562
</select>
6663
</div>
@@ -74,7 +71,9 @@ export function Toolbar({
7471
className="bg-[var(--color-surface-overlay)] text-[var(--color-text-primary)] text-[12px] font-mono rounded-md px-2.5 py-1 border border-[var(--color-border)] focus:border-[var(--color-border-focus)] focus:outline-none cursor-pointer max-w-[280px]"
7572
>
7673
{types.map((name) => (
77-
<option key={name} value={name}>{name}</option>
74+
<option key={name} value={name}>
75+
{name}
76+
</option>
7877
))}
7978
</select>
8079
</div>

0 commit comments

Comments
 (0)