Skip to content

Commit 697ddae

Browse files
clee2000clee2000
authored
[HUD] Upgrade yarn packages: next, next-auth, @mui (#7044)
Upgrades some yarn packages Reason: * good to be up to date * I had some sort of build problem and thought upgrading things would help. The build problem went away on its own but now I have this PR to upgrade stuff Pros: * Staying up to date Cons: * Build time for packages got really big (previously <1s, now some are >2s?) when running yarn build. I assume this only affects local dev, so hopefully its ok? * Churn Changes: * Grid2 renamed to Grid * Some event handlers got stricter typing -> changed dateRange etc in date pickers to by typed better (also theres a lot of sort of dup date/time pickers) * something in the next typing changed so you can't return res.status().end * GridCloseIcon got removed? I swapped to CloseIcon, but I think the only place its used is dead code atm so I didn't check what it looks like * `next-env.d.ts` got updated automatically * `next.config.json` additions are for https://mui.com/x/react-data-grid/quickstart/#next-js (source https://togithub.com/mui/mui-x/issues/19201#issuecomment-3210006736) Testing: * not great * Sanity checked that main hud page works, metrics page, kpis, commit page Things can can probably still be updated: * react * typescript
1 parent c8b1b04 commit 697ddae

29 files changed

Lines changed: 798 additions & 654 deletions

File tree

‎torchci/app/v2/benchmark/v3/page.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Card, CardContent, Grid2, Typography } from "@mui/material";
1+
import { Card, CardContent, Grid, Typography } from "@mui/material";
22

33
export default function Page() {
44
const list = ["torhchAo", "vllm", "torch compiler"];
@@ -7,9 +7,9 @@ export default function Page() {
77
<Typography variant="h4" gutterBottom>
88
Benchmarks
99
</Typography>
10-
<Grid2 container spacing={2}>
10+
<Grid container spacing={2}>
1111
{list.map((item, index) => (
12-
<Grid2 key={index}>
12+
<Grid key={index}>
1313
<Card variant="outlined">
1414
<CardContent>
1515
<Typography variant="h6" component="div">
@@ -20,9 +20,9 @@ export default function Page() {
2020
</Typography>
2121
</CardContent>
2222
</Card>
23-
</Grid2>
23+
</Grid>
2424
))}
25-
</Grid2>
25+
</Grid>
2626
</div>
2727
);
2828
}

‎torchci/app/v2/benchmark/v3/regression/page.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
1-
import { Card, CardContent, Grid2, Typography } from "@mui/material";
1+
import { Card, CardContent, Grid, Typography } from "@mui/material";
22

33
export default function Page() {
44
return (
55
<div style={{ padding: 20 }}>
66
<Card>
77
<CardContent>
8-
<Grid2 container spacing={2}>
9-
<Grid2>
8+
<Grid container spacing={2}>
9+
<Grid>
1010
<Typography variant="h4" gutterBottom>
1111
Benchmark Regression Page Rendering Custommized Component
1212
Dynamically
1313
</Typography>
14-
</Grid2>
15-
</Grid2>
14+
</Grid>
15+
</Grid>
1616
</CardContent>
1717
</Card>
1818
<br />

‎torchci/components/benchmark/compilers/ModelGraphPanel.tsx‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Grid2, Skeleton } from "@mui/material";
1+
import { Grid, Skeleton } from "@mui/material";
22
import {
33
COMMIT_TO_WORKFLOW_ID,
44
WORKFLOW_ID_TO_COMMIT,
@@ -146,8 +146,8 @@ export function GraphPanel({
146146
<>
147147
<div>
148148
<h2>Details for {model}</h2>
149-
<Grid2 container spacing={2}>
150-
<Grid2 size={{ xs: 12, lg: 4 }} height={GRAPH_ROW_HEIGHT}>
149+
<Grid container spacing={2}>
150+
<Grid size={{ xs: 12, lg: 4 }} height={GRAPH_ROW_HEIGHT}>
151151
<TimeSeriesPanelWithData
152152
data={chartData}
153153
series={geomeanSeries}
@@ -169,9 +169,9 @@ export function GraphPanel({
169169
},
170170
}}
171171
/>
172-
</Grid2>
172+
</Grid>
173173

174-
<Grid2 size={{ xs: 12, lg: 4 }} height={GRAPH_ROW_HEIGHT}>
174+
<Grid size={{ xs: 12, lg: 4 }} height={GRAPH_ROW_HEIGHT}>
175175
<TimeSeriesPanelWithData
176176
data={chartData}
177177
series={compTimeSeries}
@@ -194,9 +194,9 @@ export function GraphPanel({
194194
},
195195
}}
196196
/>
197-
</Grid2>
197+
</Grid>
198198

199-
<Grid2 size={{ xs: 12, lg: 4 }} height={GRAPH_ROW_HEIGHT}>
199+
<Grid size={{ xs: 12, lg: 4 }} height={GRAPH_ROW_HEIGHT}>
200200
<TimeSeriesPanelWithData
201201
data={chartData}
202202
series={memorySeries}
@@ -218,9 +218,9 @@ export function GraphPanel({
218218
},
219219
}}
220220
/>
221-
</Grid2>
221+
</Grid>
222222

223-
<Grid2 size={{ xs: 12, lg: 4 }} height={GRAPH_ROW_HEIGHT}>
223+
<Grid size={{ xs: 12, lg: 4 }} height={GRAPH_ROW_HEIGHT}>
224224
<TimeSeriesPanelWithData
225225
data={chartData}
226226
series={absTimeSeries}
@@ -243,9 +243,9 @@ export function GraphPanel({
243243
},
244244
}}
245245
/>
246-
</Grid2>
246+
</Grid>
247247

248-
<Grid2 size={{ xs: 12, lg: 4 }} height={GRAPH_ROW_HEIGHT}>
248+
<Grid size={{ xs: 12, lg: 4 }} height={GRAPH_ROW_HEIGHT}>
249249
<TimeSeriesPanelWithData
250250
data={chartData}
251251
series={peakMemoryUsageTimeSeries}
@@ -268,8 +268,8 @@ export function GraphPanel({
268268
},
269269
}}
270270
/>
271-
</Grid2>
272-
</Grid2>
271+
</Grid>
272+
</Grid>
273273
</div>
274274
<div>
275275
<table>

‎torchci/components/benchmark/compilers/ModelPanel.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Grid2 } from "@mui/material";
1+
import { Grid } from "@mui/material";
22
import { GridCellParams, GridRenderCellParams } from "@mui/x-data-grid";
33
import { LOG_PREFIX, SHA_DISPLAY_LENGTH } from "components/benchmark/common";
44
import {
@@ -142,8 +142,8 @@ export function ModelPanel({
142142

143143
const minEntries = data.length > MIN_ENTRIES ? data.length : MIN_ENTRIES;
144144
return (
145-
<Grid2 container spacing={2} style={{ height: "100%" }}>
146-
<Grid2
145+
<Grid container spacing={2} style={{ height: "100%" }}>
146+
<Grid
147147
size={{ xs: 12, lg: 12 }}
148148
height={minEntries * ROW_HEIGHT + ROW_GAP}
149149
>
@@ -544,7 +544,7 @@ export function ModelPanel({
544544
]}
545545
dataGridProps={{ getRowId: (el: any) => el.name }}
546546
/>
547-
</Grid2>
548-
</Grid2>
547+
</Grid>
548+
</Grid>
549549
);
550550
}

‎torchci/components/benchmark/compilers/SummaryGraphPanel.tsx‎

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Grid2, Skeleton } from "@mui/material";
1+
import { Grid, Skeleton } from "@mui/material";
22
import { COMMIT_TO_WORKFLOW_ID } from "components/benchmark/BranchAndCommitPicker";
33
import { TIME_FIELD_NAME } from "components/benchmark/common";
44
import { SUITES } from "components/benchmark/compilers/SuitePicker";
@@ -247,8 +247,8 @@ function SuiteGraphPanel({
247247
);
248248

249249
return (
250-
<Grid2 container spacing={2}>
251-
<Grid2 size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
250+
<Grid container spacing={2}>
251+
<Grid size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
252252
<TimeSeriesPanelWithData
253253
data={passrate}
254254
series={passrateSeries}
@@ -272,9 +272,9 @@ function SuiteGraphPanel({
272272
}}
273273
legendPadding={310}
274274
/>
275-
</Grid2>
275+
</Grid>
276276

277-
<Grid2 size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
277+
<Grid size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
278278
<TimeSeriesPanelWithData
279279
data={passrate}
280280
series={totalModelCountSeries}
@@ -297,9 +297,9 @@ function SuiteGraphPanel({
297297
}}
298298
legendPadding={310}
299299
/>
300-
</Grid2>
300+
</Grid>
301301

302-
<Grid2 size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
302+
<Grid size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
303303
<TimeSeriesPanelWithData
304304
data={geomean}
305305
series={geomeanSeries}
@@ -323,9 +323,9 @@ function SuiteGraphPanel({
323323
}}
324324
legendPadding={310}
325325
/>
326-
</Grid2>
326+
</Grid>
327327

328-
<Grid2 size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
328+
<Grid size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
329329
<TimeSeriesPanelWithData
330330
data={compTime}
331331
series={compTimeSeries}
@@ -349,9 +349,9 @@ function SuiteGraphPanel({
349349
}}
350350
legendPadding={310}
351351
/>
352-
</Grid2>
352+
</Grid>
353353

354-
<Grid2 size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
354+
<Grid size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
355355
<TimeSeriesPanelWithData
356356
data={memory}
357357
series={memorySeries}
@@ -374,9 +374,9 @@ function SuiteGraphPanel({
374374
}}
375375
legendPadding={310}
376376
/>
377-
</Grid2>
377+
</Grid>
378378

379-
<Grid2 size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
379+
<Grid size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
380380
<TimeSeriesPanelWithData
381381
data={peakMemory}
382382
series={peakMemorySeries}
@@ -400,9 +400,9 @@ function SuiteGraphPanel({
400400
}}
401401
legendPadding={310}
402402
/>
403-
</Grid2>
403+
</Grid>
404404

405-
<Grid2 size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
405+
<Grid size={{ xs: 12, lg: 6 }} height={GRAPH_ROW_HEIGHT}>
406406
<TimeSeriesPanelWithData
407407
data={executionTime}
408408
series={executionTimeSeries}
@@ -426,7 +426,7 @@ function SuiteGraphPanel({
426426
}}
427427
legendPadding={310}
428428
/>
429-
</Grid2>
430-
</Grid2>
429+
</Grid>
430+
</Grid>
431431
);
432432
}

‎torchci/components/benchmark/compilers/SummaryPanel.tsx‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Grid2 } from "@mui/material";
1+
import { Grid } from "@mui/material";
22
import { GridCellParams, GridRenderCellParams } from "@mui/x-data-grid";
33
import {
44
ACCURACY_THRESHOLD,
@@ -214,8 +214,8 @@ export function SummaryPanel({
214214

215215
return (
216216
<div>
217-
<Grid2 container spacing={2} style={{ height: "100%" }}>
218-
<Grid2
217+
<Grid container spacing={2} style={{ height: "100%" }}>
218+
<Grid
219219
size={{ xs: 12, lg: 6 }}
220220
height={ROW_HEIGHT * Object.keys(passrate).length + ROW_GAP}
221221
>
@@ -307,9 +307,9 @@ export function SummaryPanel({
307307
)}
308308
dataGridProps={{ getRowId: (el: any) => el.suite + el.compiler }}
309309
/>
310-
</Grid2>
310+
</Grid>
311311

312-
<Grid2
312+
<Grid
313313
size={{ xs: 12, lg: 6 }}
314314
height={ROW_HEIGHT * Object.keys(geomean).length + ROW_GAP}
315315
>
@@ -400,9 +400,9 @@ export function SummaryPanel({
400400
)}
401401
dataGridProps={{ getRowId: (el: any) => el.suite + el.compiler }}
402402
/>
403-
</Grid2>
403+
</Grid>
404404

405-
<Grid2
405+
<Grid
406406
size={{ xs: 12, lg: 6 }}
407407
height={ROW_HEIGHT * Object.keys(compTime).length + ROW_GAP}
408408
>
@@ -489,9 +489,9 @@ export function SummaryPanel({
489489
)}
490490
dataGridProps={{ getRowId: (el: any) => el.suite + el.compiler }}
491491
/>
492-
</Grid2>
492+
</Grid>
493493

494-
<Grid2
494+
<Grid
495495
size={{ xs: 12, lg: 6 }}
496496
height={ROW_HEIGHT * Object.keys(memory).length + ROW_GAP}
497497
>
@@ -584,8 +584,8 @@ export function SummaryPanel({
584584
)}
585585
dataGridProps={{ getRowId: (el: any) => el.suite + el.compiler }}
586586
/>
587-
</Grid2>
588-
</Grid2>
587+
</Grid>
588+
</Grid>
589589
</div>
590590
);
591591
}

‎torchci/components/benchmark/llms/components/LLMsGraphPanel.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
22
import {
33
Box,
44
Button,
5-
Grid2,
5+
Grid,
66
IconButton,
77
Link,
88
Paper,
@@ -231,11 +231,11 @@ export default function LLMsGraphPanel({
231231
return (
232232
<>
233233
<div>
234-
<Grid2 container spacing={2}>
234+
<Grid container spacing={2}>
235235
{metricNames
236236
.filter((metric) => chartData[metric].length !== 0)
237237
.map((metric: string) => (
238-
<Grid2
238+
<Grid
239239
size={{ xs: 12, lg: modelName === DEFAULT_MODEL_NAME ? 12 : 6 }}
240240
height={GRAPH_ROW_HEIGHT}
241241
key={metric}
@@ -264,9 +264,9 @@ export default function LLMsGraphPanel({
264264
}}
265265
legendPadding={320}
266266
/>
267-
</Grid2>
267+
</Grid>
268268
))}
269-
</Grid2>
269+
</Grid>
270270
</div>
271271
{modelName !== DEFAULT_MODEL_NAME && (
272272
<Box mt={4} px={2}>

‎torchci/components/benchmark/llms/components/LLMsSummaryPanel.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Grid2, styled, Tooltip } from "@mui/material";
1+
import { Grid, styled, Tooltip } from "@mui/material";
22
import { GridCellParams, GridRenderCellParams } from "@mui/x-data-grid";
33
import styles from "components/metrics.module.css";
44
import { TablePanelWithData } from "components/metrics/panels/TablePanel";
@@ -415,8 +415,8 @@ export default function LLMsSummaryPanel({
415415

416416
// TODO (huydhn): Table bigger than 100 rows requires x-data-grid-pro
417417
return (
418-
<Grid2 container spacing={10}>
419-
<Grid2 size={{ xs: 12, lg: 11.8 }}>
418+
<Grid container spacing={10}>
419+
<Grid size={{ xs: 12, lg: 11.8 }}>
420420
<TablePanelWithData
421421
title={"Models"}
422422
data={data}
@@ -428,8 +428,8 @@ export default function LLMsSummaryPanel({
428428
maxHeight: 1200,
429429
}}
430430
/>
431-
</Grid2>
432-
</Grid2>
431+
</Grid>
432+
</Grid>
433433
);
434434
}
435435

0 commit comments

Comments
 (0)