Skip to content

Commit c4f0ecc

Browse files
themisvaltinosthemisvaltinos
committed
run the pnpm linter
1 parent 8d93e96 commit c4f0ecc

7 files changed

Lines changed: 202 additions & 76 deletions

File tree

‎vscode/react/src/components/tablediff/ColumnStatsSection.tsx‎

Lines changed: 35 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,10 @@ interface StatHeaderProps {
1515
const StatHeader = ({ stat }: StatHeaderProps) => (
1616
<th
1717
key={stat}
18-
className={twMerge('text-left py-2 px-1 font-medium w-16', twColors.textMuted)}
18+
className={twMerge(
19+
'text-left py-2 px-1 font-medium w-16',
20+
twColors.textMuted,
21+
)}
1922
title={stat}
2023
>
2124
{stat.length > 6 ? stat.slice(0, 6) + '..' : stat}
@@ -28,7 +31,10 @@ interface StatCellProps {
2831

2932
const StatCell = ({ value }: StatCellProps) => (
3033
<td
31-
className={twMerge('py-2 px-1 font-mono text-xs truncate', twColors.textMuted)}
34+
className={twMerge(
35+
'py-2 px-1 font-mono text-xs truncate',
36+
twColors.textMuted,
37+
)}
3238
title={String(value)}
3339
>
3440
{typeof value === 'number'
@@ -49,7 +55,7 @@ const ColumnStatRow = ({ columnName, statsValue }: ColumnStatRowProps) => (
4955
className={twMerge(
5056
'transition-colors border-b',
5157
twColors.borderPanel,
52-
twColors.bgHover
58+
twColors.bgHover,
5359
)}
5460
>
5561
<td
@@ -59,10 +65,20 @@ const ColumnStatRow = ({ columnName, statsValue }: ColumnStatRowProps) => (
5965
{columnName}
6066
</td>
6167
{statsValue && typeof statsValue === 'object'
62-
? Object.values(statsValue as Record<string, SampleValue>).map((value, idx) => (
63-
<StatCell key={idx} value={value} />
64-
))
65-
: [<StatCell key="single-value" value={statsValue} />]}
68+
? Object.values(statsValue as Record<string, SampleValue>).map(
69+
(value, idx) => (
70+
<StatCell
71+
key={idx}
72+
value={value}
73+
/>
74+
),
75+
)
76+
: [
77+
<StatCell
78+
key="single-value"
79+
value={statsValue}
80+
/>,
81+
]}
6682
</tr>
6783
)
6884

@@ -91,7 +107,7 @@ export function ColumnStatsSection({
91107
'px-2 py-1 text-xs rounded border',
92108
twColors.bgInput,
93109
'text-[var(--vscode-symbolIcon-classForeground,#9b59b6)]',
94-
'border-[var(--vscode-symbolIcon-classForeground,#9b59b6)]'
110+
'border-[var(--vscode-symbolIcon-classForeground,#9b59b6)]',
95111
)}
96112
expanded={expanded}
97113
onToggle={onToggle}
@@ -101,11 +117,19 @@ export function ColumnStatsSection({
101117
<table className="w-full text-xs table-fixed">
102118
<thead className={twMerge('sticky top-0 z-10', twColors.bgEditor)}>
103119
<tr className={twMerge('border-b', twColors.borderPanel)}>
104-
<th className={twMerge('text-left py-2 pr-2 font-medium w-28', twColors.textMuted)}>
120+
<th
121+
className={twMerge(
122+
'text-left py-2 pr-2 font-medium w-28',
123+
twColors.textMuted,
124+
)}
125+
>
105126
Column
106127
</th>
107128
{statKeys.map(stat => (
108-
<StatHeader key={stat} stat={stat} />
129+
<StatHeader
130+
key={stat}
131+
stat={stat}
132+
/>
109133
))}
110134
</tr>
111135
</thead>
@@ -123,4 +147,4 @@ export function ColumnStatsSection({
123147
</div>
124148
</SectionToggle>
125149
)
126-
}
150+
}

‎vscode/react/src/components/tablediff/RowStatsSection.tsx‎

Lines changed: 17 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ export function RowStatsSection({
3333
'px-2 py-1 text-xs rounded border',
3434
twColors.bgInput,
3535
twColors.textInfo,
36-
twColors.borderInfo
36+
twColors.borderInfo,
3737
)}
3838
expanded={expanded}
3939
onToggle={onToggle}
@@ -65,15 +65,28 @@ export function RowStatsSection({
6565
</div>
6666
{/* Match rate progress bar */}
6767
<div className="mt-3 space-y-1">
68-
<div className={twMerge('flex items-center gap-2 text-xs', twColors.textMuted)}>
68+
<div
69+
className={twMerge(
70+
'flex items-center gap-2 text-xs',
71+
twColors.textMuted,
72+
)}
73+
>
6974
<span>Match Rate</span>
7075
<span className="font-medium">
7176
{formatPercentage(fullMatchPct)}
7277
</span>
7378
</div>
74-
<div className={twMerge('h-2 rounded-full overflow-hidden', twColors.bgInput)}>
79+
<div
80+
className={twMerge(
81+
'h-2 rounded-full overflow-hidden',
82+
twColors.bgInput,
83+
)}
84+
>
7585
<div
76-
className={twMerge('h-full transition-all duration-300', twColors.textSuccess.replace('text-', 'bg-'))}
86+
className={twMerge(
87+
'h-full transition-all duration-300',
88+
twColors.textSuccess.replace('text-', 'bg-'),
89+
)}
7790
style={{ width: `${fullMatchPct * 100}%` }}
7891
/>
7992
</div>

‎vscode/react/src/components/tablediff/SampleDataSection.tsx‎

Lines changed: 67 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -17,17 +17,21 @@ interface TableHeaderCellProps {
1717
targetName?: SampleValue
1818
}
1919

20-
const TableHeaderCell = ({ columnKey, sourceName, targetName }: TableHeaderCellProps) => {
20+
const TableHeaderCell = ({
21+
columnKey,
22+
sourceName,
23+
targetName,
24+
}: TableHeaderCellProps) => {
2125
const isSource = columnKey === sourceName
2226
const isTarget = columnKey === targetName
23-
27+
2428
return (
2529
<th
2630
className={twMerge(
2731
'text-left py-2 px-2 font-medium whitespace-nowrap',
2832
isSource && twColors.textInfo,
2933
isTarget && twColors.textSuccess,
30-
!isSource && !isTarget && twColors.textMuted
34+
!isSource && !isTarget && twColors.textMuted,
3135
)}
3236
>
3337
{columnKey}
@@ -43,17 +47,23 @@ interface DiffTableCellProps {
4347
decimals?: number
4448
}
4549

46-
const DiffTableCell = ({ columnKey, value, sourceName, targetName, decimals = 3 }: DiffTableCellProps) => {
50+
const DiffTableCell = ({
51+
columnKey,
52+
value,
53+
sourceName,
54+
targetName,
55+
decimals = 3,
56+
}: DiffTableCellProps) => {
4757
const isSource = columnKey === sourceName
4858
const isTarget = columnKey === targetName
49-
59+
5060
return (
5161
<td
5262
className={twMerge(
5363
'py-2 px-2 font-mono whitespace-nowrap',
5464
isSource && twColors.textInfo + ' bg-blue-500/10',
5565
isTarget && twColors.textSuccess + ' bg-green-500/10',
56-
!isSource && !isTarget && twColors.textForeground
66+
!isSource && !isTarget && twColors.textForeground,
5767
)}
5868
>
5969
{formatCellValue(value, decimals)}
@@ -68,13 +78,18 @@ interface DiffTableRowProps {
6878
decimals?: number
6979
}
7080

71-
const DiffTableRow = ({ row, sourceName, targetName, decimals }: DiffTableRowProps) => (
81+
const DiffTableRow = ({
82+
row,
83+
sourceName,
84+
targetName,
85+
decimals,
86+
}: DiffTableRowProps) => (
7287
<tr
7388
className={twMerge(
7489
'transition-colors',
7590
twColors.borderPanel,
7691
'border-b',
77-
twColors.bgHover
92+
twColors.bgHover,
7893
)}
7994
>
8095
{Object.entries(row)
@@ -98,7 +113,11 @@ interface SimpleTableCellProps {
98113
decimals?: number
99114
}
100115

101-
const SimpleTableCell = ({ value, colorClass, decimals = 3 }: SimpleTableCellProps) => (
116+
const SimpleTableCell = ({
117+
value,
118+
colorClass,
119+
decimals = 3,
120+
}: SimpleTableCellProps) => (
102121
<td className={twMerge('py-2 px-2 font-mono whitespace-nowrap', colorClass)}>
103122
{formatCellValue(value, decimals)}
104123
</td>
@@ -111,12 +130,17 @@ interface SimpleTableRowProps {
111130
decimals?: number
112131
}
113132

114-
const SimpleTableRow = ({ row, colorClass, borderColorClass, decimals }: SimpleTableRowProps) => (
133+
const SimpleTableRow = ({
134+
row,
135+
colorClass,
136+
borderColorClass,
137+
decimals,
138+
}: SimpleTableRowProps) => (
115139
<tr
116140
className={twMerge(
117141
'transition-colors border-b',
118142
borderColorClass,
119-
twColors.bgHover
143+
twColors.bgHover,
120144
)}
121145
>
122146
{Object.values(row).map((cell, cellIdx) => (
@@ -136,7 +160,11 @@ interface ColumnDifferenceGroupProps {
136160
decimals: number
137161
}
138162

139-
const ColumnDifferenceGroup = ({ columnName, rows, decimals }: ColumnDifferenceGroupProps) => {
163+
const ColumnDifferenceGroup = ({
164+
columnName,
165+
rows,
166+
decimals,
167+
}: ColumnDifferenceGroupProps) => {
140168
if (!rows || rows.length === 0) return null
141169

142170
const sourceName = rows[0].__source_name__
@@ -147,10 +175,12 @@ const ColumnDifferenceGroup = ({ columnName, rows, decimals }: ColumnDifferenceG
147175
className={twMerge(
148176
'border rounded-lg p-4',
149177
twColors.bgInactiveSelection,
150-
twColors.borderPanel
178+
twColors.borderPanel,
151179
)}
152180
>
153-
<h5 className={twMerge('font-medium mb-2 underline', twColors.textAccent)}>
181+
<h5
182+
className={twMerge('font-medium mb-2 underline', twColors.textAccent)}
183+
>
154184
Column: {columnName}
155185
</h5>
156186
<div className="overflow-auto max-h-80">
@@ -249,26 +279,33 @@ export function SampleDataSection({ rowDiff }: SampleDataSectionProps) {
249279
{/* SOURCE ONLY & TARGET ONLY tables */}
250280
{source_only && source_only.length > 0 && (
251281
<div>
252-
<h4 className={twMerge('text-sm font-medium mb-3', twColors.textWarning)}>
282+
<h4
283+
className={twMerge(
284+
'text-sm font-medium mb-3',
285+
twColors.textWarning,
286+
)}
287+
>
253288
SOURCE ONLY Rows:
254289
</h4>
255290
<div
256291
className={twMerge(
257292
'border rounded-lg p-4',
258293
twColors.bgModified,
259-
twColors.borderModified
294+
twColors.borderModified,
260295
)}
261296
>
262297
<div className="overflow-auto max-h-80">
263298
<table className="w-full text-xs">
264-
<thead className={twMerge('sticky top-0 z-10', twColors.bgModified)}>
299+
<thead
300+
className={twMerge('sticky top-0 z-10', twColors.bgModified)}
301+
>
265302
<tr className={twMerge('border-b', twColors.borderModified)}>
266303
{Object.keys(source_only[0] || {}).map(col => (
267304
<th
268305
key={col}
269306
className={twMerge(
270307
'text-left py-2 px-2 font-medium whitespace-nowrap',
271-
twColors.textModified
308+
twColors.textModified,
272309
)}
273310
>
274311
{col}
@@ -300,26 +337,33 @@ export function SampleDataSection({ rowDiff }: SampleDataSectionProps) {
300337

301338
{target_only && target_only.length > 0 && (
302339
<div>
303-
<h4 className={twMerge('text-sm font-medium mb-3', twColors.textSuccess)}>
340+
<h4
341+
className={twMerge(
342+
'text-sm font-medium mb-3',
343+
twColors.textSuccess,
344+
)}
345+
>
304346
TARGET ONLY Rows:
305347
</h4>
306348
<div
307349
className={twMerge(
308350
'border rounded-lg p-4',
309351
twColors.bgAdded,
310-
twColors.borderAdded
352+
twColors.borderAdded,
311353
)}
312354
>
313355
<div className="overflow-auto max-h-80">
314356
<table className="w-full text-xs">
315-
<thead className={twMerge('sticky top-0 z-10', twColors.bgAdded)}>
357+
<thead
358+
className={twMerge('sticky top-0 z-10', twColors.bgAdded)}
359+
>
316360
<tr className={twMerge('border-b', twColors.borderAdded)}>
317361
{Object.keys(target_only[0] || {}).map(col => (
318362
<th
319363
key={col}
320364
className={twMerge(
321365
'text-left py-2 px-2 font-medium whitespace-nowrap',
322-
twColors.textAdded
366+
twColors.textAdded,
323367
)}
324368
>
325369
{col}
@@ -350,4 +394,4 @@ export function SampleDataSection({ rowDiff }: SampleDataSectionProps) {
350394
)}
351395
</div>
352396
)
353-
}
397+
}

0 commit comments

Comments
 (0)