Skip to content

Commit 1e2680f

Browse files
nakrovatinakrovati
committed
style: format code
1 parent 251c4d2 commit 1e2680f

File tree

9 files changed

+119
-180
lines changed

9 files changed

+119
-180
lines changed

‎webdriver-ts-results/src/components/BoxPlotTable/BoxPlotTable.tsx

Lines changed: 3 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,5 @@
11
import React from "react";
2-
import {
3-
SORT_BY_NAME,
4-
Benchmark,
5-
Framework,
6-
ResultLookup,
7-
CpuDurationMode,
8-
} from "@/Common";
2+
import { SORT_BY_NAME, Benchmark, Framework, ResultLookup, CpuDurationMode } from "@/Common";
93
import BoxPlotTableRows from "./BoxPlotTableRows";
104

115
interface Props {
@@ -17,14 +11,7 @@ interface Props {
1711
cpuDurationMode: CpuDurationMode;
1812
}
1913

20-
const BoxPlotTable = ({
21-
frameworks,
22-
benchmarks,
23-
results,
24-
currentSortKey,
25-
sortBy,
26-
cpuDurationMode,
27-
}: Props) => {
14+
const BoxPlotTable = ({ frameworks, benchmarks, results, currentSortKey, sortBy, cpuDurationMode }: Props) => {
2815
const handleSortByName = (event: React.MouseEvent) => {
2916
event.preventDefault();
3017
sortBy(SORT_BY_NAME);
@@ -39,9 +26,7 @@ const BoxPlotTable = ({
3926
<tr>
4027
<th className="benchname">
4128
<button
42-
className={`button button__text ${
43-
currentSortKey === SORT_BY_NAME ? "sort-key" : ""
44-
}`}
29+
className={`button button__text ${currentSortKey === SORT_BY_NAME ? "sort-key" : ""}`}
4530
aria-label="Sort frameworks in ascending order (asc)"
4631
onClick={handleSortByName}
4732
>

‎webdriver-ts-results/src/components/BoxPlotTable/BoxPlotTableRow.tsx

Lines changed: 3 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -11,16 +11,8 @@ interface Props {
1111
cpuDurationMode: CpuDurationMode;
1212
}
1313

14-
const BoxPlotTableRow = ({
15-
frameworks,
16-
benchmark,
17-
results,
18-
currentSortKey,
19-
sortBy,
20-
cpuDurationMode,
21-
}: Props) => {
22-
const resultsValues = (framework: Framework) =>
23-
results(benchmark, framework)?.results[cpuDurationMode].values ?? [];
14+
const BoxPlotTableRow = ({ frameworks, benchmark, results, currentSortKey, sortBy, cpuDurationMode }: Props) => {
15+
const resultsValues = (framework: Framework) => results(benchmark, framework)?.results[cpuDurationMode].values ?? [];
2416

2517
const handleSortByBenchmarkResults = (event: React.MouseEvent) => {
2618
event.preventDefault();
@@ -36,9 +28,7 @@ const BoxPlotTableRow = ({
3628
<tr key={benchmark.id} style={{ height: 400 }}>
3729
<th className="benchname">
3830
<button
39-
className={`button button__text ${
40-
currentSortKey === benchmark.id ? "sort-key" : ""
41-
}`}
31+
className={`button button__text ${currentSortKey === benchmark.id ? "sort-key" : ""}`}
4232
onClick={handleSortByBenchmarkResults}
4333
aria-label="Sort by benchmark results (from best to worst)"
4434
>

‎webdriver-ts-results/src/components/BoxPlotTable/BoxPlotTableRows.tsx

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -10,14 +10,7 @@ interface Props {
1010
cpuDurationMode: CpuDurationMode;
1111
}
1212

13-
const BoxPlotTableRows = ({
14-
frameworks,
15-
benchmarks,
16-
results,
17-
currentSortKey,
18-
sortBy,
19-
cpuDurationMode,
20-
}: Props) => {
13+
const BoxPlotTableRows = ({ frameworks, benchmarks, results, currentSortKey, sortBy, cpuDurationMode }: Props) => {
2114
return (
2215
<>
2316
{benchmarks.map((benchmark) => (

‎webdriver-ts-results/src/components/tables/CompareRow.tsx

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,7 @@ const CompareRow = ({ comparison, compareWith }: Props) => {
1010
const compare = useRootStore((state) => state.compare);
1111
const stopCompare = useRootStore((state) => state.stopCompare);
1212

13-
const renderComparisonCell = (
14-
result: TableResultComparisonEntry | null,
15-
idx: number,
16-
) => {
13+
const renderComparisonCell = (result: TableResultComparisonEntry | null, idx: number) => {
1714
if (!result) {
1815
return <th key={idx}></th>;
1916
}
@@ -37,9 +34,7 @@ const CompareRow = ({ comparison, compareWith }: Props) => {
3734
<button
3835
className="button button__text sortKey"
3936
onClick={handleToggleComparing}
40-
aria-label={
41-
isComparing ? "Stop comparing" : "Compare with other frameworks"
42-
}
37+
aria-label={isComparing ? "Stop comparing" : "Compare with other frameworks"}
4338
>
4439
{isComparing ? "stop compare" : "compare"}
4540
</button>
@@ -49,9 +44,7 @@ const CompareRow = ({ comparison, compareWith }: Props) => {
4944

5045
return (
5146
<tr>
52-
<th>
53-
compare: Green means significantly faster, red significantly slower
54-
</th>
47+
<th>compare: Green means significantly faster, red significantly slower</th>
5548
{comparison.map((result, idx) => renderComparisonCell(result, idx))}
5649
</tr>
5750
);

‎webdriver-ts-results/src/components/tables/CpuResultsTable.tsx

Lines changed: 79 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,5 @@
11
import React from "react";
2-
import {
3-
ResultTableData,
4-
SORT_BY_NAME,
5-
SORT_BY_GEOMMEAN_CPU,
6-
BenchmarkType,
7-
} from "@/Common";
2+
import { ResultTableData, SORT_BY_NAME, SORT_BY_GEOMMEAN_CPU, BenchmarkType } from "@/Common";
83
import GeomMeanRow from "./GeomMeanRow";
94
import CompareRow from "./CompareRow";
105
import ValueResultRow from "./ValueResultRow";
@@ -25,7 +20,7 @@ const CpuResultsTable = ({ data, currentSortKey, sortBy }: Props) => {
2520

2621
return resultsCPU.results.length === 0 ? null : (
2722
<>
28-
{/* Dummy row for fixed td width */}
23+
{/* Dummy row for fixed td width */}
2924
<thead className="dummy">
3025
<tr>
3126
<th></th>
@@ -41,95 +36,83 @@ const CpuResultsTable = ({ data, currentSortKey, sortBy }: Props) => {
4136
</td>
4237
</tr>
4338
</thead>
44-
<thead>
45-
<tr>
46-
<th className="benchname">
47-
<button
48-
className={`button button__text ${
49-
currentSortKey === SORT_BY_NAME ? "sort-key" : ""
50-
}`}
51-
onClick={handleSortByName}
52-
>
53-
Name
54-
</button>
55-
<br />
56-
Duration for...
57-
</th>
58-
{data.frameworks.map((f, idx) => (
59-
<th key={idx}>
60-
{f.frameworkHomeURL ? (
61-
<a
62-
target="_blank"
63-
rel="noreferrer"
64-
href={f.frameworkHomeURL}
65-
>
66-
{f.displayname}
67-
</a>
68-
) : (
69-
f.displayname
70-
)}
71-
</th>
72-
))}
73-
</tr>
74-
</thead>
75-
<thead>
76-
<tr>
77-
<th>Implementation notes</th>
78-
{data.frameworks.map((f) => (
79-
<th key={f.name}>
80-
{f.issues &&
81-
f.issues.map((i) => (
82-
<React.Fragment key={i.toFixed()}>
83-
<a href={"#" + i.toFixed()}>{i.toFixed()}</a>
84-
<span> </span>
85-
</React.Fragment>
86-
))}
87-
</th>
88-
))}
89-
</tr>
90-
</thead>
91-
<thead>
92-
<tr>
93-
<th>Implementation link</th>
94-
{data.frameworks.map((f) => (
95-
<th key={f.name}>
96-
<a
97-
target="_blank"
98-
rel="noreferrer"
99-
href={
100-
"https://github.com/krausest/js-framework-benchmark/tree/master/frameworks/" +
101-
f.dir
102-
}
103-
>
104-
code
105-
</a>
106-
</th>
107-
))}
108-
</tr>
109-
</thead>
110-
<tbody>
111-
{resultsCPU.results.map((resultsForBenchmark, benchIdx) => (
112-
<ValueResultRow
113-
key={resultsCPU.benchmarks[benchIdx]?.id}
114-
benchIdx={benchIdx}
115-
resultsForBenchmark={resultsForBenchmark}
116-
benchmarks={resultsCPU.benchmarks}
117-
currentSortKey={currentSortKey}
118-
sortBy={sortBy}
119-
/>
120-
))}
121-
<GeomMeanRow
122-
weighted={true}
123-
currentSortKey={currentSortKey}
124-
sortBy={sortBy}
125-
geomMean={resultsCPU.geomMean}
126-
sortbyGeommeanEnum={SORT_BY_GEOMMEAN_CPU}
127-
/>
128-
<CompareRow
129-
comparison={resultsCPU.comparison}
130-
compareWith={data.compareWith}
131-
/>
132-
</tbody>
39+
<thead>
40+
<tr>
41+
<th className="benchname">
42+
<button
43+
className={`button button__text ${currentSortKey === SORT_BY_NAME ? "sort-key" : ""}`}
44+
onClick={handleSortByName}
45+
>
46+
Name
47+
</button>
48+
<br />
49+
Duration for...
50+
</th>
51+
{data.frameworks.map((f, idx) => (
52+
<th key={idx}>
53+
{f.frameworkHomeURL ? (
54+
<a target="_blank" rel="noreferrer" href={f.frameworkHomeURL}>
55+
{f.displayname}
56+
</a>
57+
) : (
58+
f.displayname
59+
)}
60+
</th>
61+
))}
62+
</tr>
63+
</thead>
64+
<thead>
65+
<tr>
66+
<th>Implementation notes</th>
67+
{data.frameworks.map((f) => (
68+
<th key={f.name}>
69+
{f.issues &&
70+
f.issues.map((i) => (
71+
<React.Fragment key={i.toFixed()}>
72+
<a href={"#" + i.toFixed()}>{i.toFixed()}</a>
73+
<span> </span>
74+
</React.Fragment>
75+
))}
76+
</th>
77+
))}
78+
</tr>
79+
</thead>
80+
<thead>
81+
<tr>
82+
<th>Implementation link</th>
83+
{data.frameworks.map((f) => (
84+
<th key={f.name}>
85+
<a
86+
target="_blank"
87+
rel="noreferrer"
88+
href={"https://github.com/krausest/js-framework-benchmark/tree/master/frameworks/" + f.dir}
89+
>
90+
code
91+
</a>
92+
</th>
93+
))}
94+
</tr>
95+
</thead>
96+
<tbody>
97+
{resultsCPU.results.map((resultsForBenchmark, benchIdx) => (
98+
<ValueResultRow
99+
key={resultsCPU.benchmarks[benchIdx]?.id}
100+
benchIdx={benchIdx}
101+
resultsForBenchmark={resultsForBenchmark}
102+
benchmarks={resultsCPU.benchmarks}
103+
currentSortKey={currentSortKey}
104+
sortBy={sortBy}
105+
/>
106+
))}
107+
<GeomMeanRow
108+
weighted={true}
109+
currentSortKey={currentSortKey}
110+
sortBy={sortBy}
111+
geomMean={resultsCPU.geomMean}
112+
sortbyGeommeanEnum={SORT_BY_GEOMMEAN_CPU}
113+
/>
114+
<CompareRow comparison={resultsCPU.comparison} compareWith={data.compareWith} />
115+
</tbody>
133116
</>
134117
);
135118
};

‎webdriver-ts-results/src/components/tables/GeomMeanRow.tsx

Lines changed: 5 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,7 @@ interface Props {
99
sortbyGeommeanEnum: T_SORT_BY_GEOMMEAN;
1010
}
1111

12-
const GeomMeanRow = ({
13-
weighted,
14-
geomMean,
15-
currentSortKey,
16-
sortBy,
17-
sortbyGeommeanEnum,
18-
}: Props) => {
12+
const GeomMeanRow = ({ weighted, geomMean, currentSortKey, sortBy, sortbyGeommeanEnum }: Props) => {
1913
const handleSort = (sortValue: string) => (event: React.SyntheticEvent) => {
2014
event.preventDefault();
2115
sortBy(sortValue);
@@ -25,26 +19,21 @@ const GeomMeanRow = ({
2519
<tr>
2620
<th>
2721
<button
28-
className={`button button__text ${
29-
currentSortKey === sortbyGeommeanEnum ? "sort-key" : ""
30-
}`}
22+
className={`button button__text ${currentSortKey === sortbyGeommeanEnum ? "sort-key" : ""}`}
3123
onClick={handleSort(sortbyGeommeanEnum)}
3224
>
33-
{weighted ? 'weighted ' : ''} geometric mean
25+
{weighted ? "weighted " : ""} geometric mean
3426
</button>
3527
of all factors in the table
3628
</th>
3729
{geomMean.map((result, idx) =>
3830
result == null ? (
3931
<th key={idx}></th>
4032
) : (
41-
<th
42-
key={result.key}
43-
style={{ backgroundColor: result.bgColor, color: result.textColor }}
44-
>
33+
<th key={result.key} style={{ backgroundColor: result.bgColor, color: result.textColor }}>
4534
{result.mean.toFixed(2)}
4635
</th>
47-
),
36+
)
4837
)}
4938
</tr>
5039
);

‎webdriver-ts-results/src/components/tables/MemResultsTable.tsx

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,10 @@ const MemResultsTable = ({ data, currentSortKey, sortBy }: Props) => {
2929
<thead>
3030
<tr>
3131
<th className="benchname">
32-
<button className={`button button__text ${currentSortKey === SORT_BY_NAME ? "sort-key" : ""}`} onClick={handleSortByName}>
32+
<button
33+
className={`button button__text ${currentSortKey === SORT_BY_NAME ? "sort-key" : ""}`}
34+
onClick={handleSortByName}
35+
>
3336
Name
3437
</button>
3538
</th>
@@ -49,7 +52,13 @@ const MemResultsTable = ({ data, currentSortKey, sortBy }: Props) => {
4952
sortBy={sortBy}
5053
/>
5154
))}
52-
<GeomMeanRow weighted={false} currentSortKey={currentSortKey} sortBy={sortBy} geomMean={resultsMEM.geomMean} sortbyGeommeanEnum={SORT_BY_GEOMMEAN_MEM} />
55+
<GeomMeanRow
56+
weighted={false}
57+
currentSortKey={currentSortKey}
58+
sortBy={sortBy}
59+
geomMean={resultsMEM.geomMean}
60+
sortbyGeommeanEnum={SORT_BY_GEOMMEAN_MEM}
61+
/>
5362
</tbody>
5463
</>
5564
);

0 commit comments

Comments
 (0)