Skip to content

Commit 27bd28e

Browse files
adityatoshniwaladityatoshniwal
committed
Replace Grid with Grid2 as the former is deprecated by MUI
1 parent fb4d25d commit 27bd28e

File tree

19 files changed

+113
-116
lines changed

19 files changed

+113
-116
lines changed

‎web/pgadmin/about/static/js/AboutComponent.jsx‎

Lines changed: 21 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
import gettext from 'sources/gettext';
1111
import url_for from 'sources/url_for';
1212
import React, { useEffect, useState, useRef } from 'react';
13-
import { Box, Grid, InputLabel } from '@mui/material';
13+
import { Box, Grid2 as Grid, InputLabel } from '@mui/material';
1414
import { InputSQL } from '../../../static/js/components/FormComponents';
1515
import getApiInstance from '../../../static/js/api_instance';
1616
import { usePgAdmin } from '../../../static/js/PgAdminProvider';
@@ -34,89 +34,89 @@ export default function AboutComponent() {
3434
return (
3535
<Box sx={{ padding: '16px', height: '100%', display: 'flex',flexDirection: 'column'}} ref={containerRef}>
3636
<Grid container spacing={0} style={{marginBottom: '8px'}}>
37-
<Grid item lg={3} md={3} sm={3} xs={12}>
37+
<Grid size={{ lg: 3, md: 3, sm: 3, xs: 12 }}>
3838
<InputLabel style={{fontWeight: 'bold'}}>{gettext('Version')}</InputLabel>
3939
</Grid>
40-
<Grid item lg={9} md={9} sm={9} xs={12}>
40+
<Grid size={{ lg: 9, md: 9, sm: 9, xs: 12 }}>
4141
<InputLabel>{aboutData.version}</InputLabel>
4242
</Grid>
4343
</Grid>
4444
<Grid container spacing={0} style={{marginBottom: '8px'}}>
45-
<Grid item lg={3} md={3} sm={3} xs={12}>
45+
<Grid size={{ lg: 3, md: 3, sm: 3, xs: 12 }}>
4646
<InputLabel style={{fontWeight: 'bold'}}>{gettext('Application Mode')}</InputLabel>
4747
</Grid>
48-
<Grid item lg={9} md={9} sm={9} xs={12}>
48+
<Grid size={{ lg: 9, md: 9, sm: 9, xs: 12 }}>
4949
<InputLabel>{aboutData.app_mode}</InputLabel>
5050
</Grid>
5151
</Grid>
5252
<Grid container spacing={0} style={{marginBottom: '8px'}}>
53-
<Grid item lg={3} md={3} sm={3} xs={12}>
53+
<Grid size={{ lg: 3, md: 3, sm: 3, xs: 12 }}>
5454
<InputLabel style={{fontWeight: 'bold'}}>{gettext('Commit')}</InputLabel>
5555
</Grid>
56-
<Grid item lg={9} md={9} sm={9} xs={12}>
56+
<Grid size={{ lg: 9, md: 9, sm: 9, xs: 12 }}>
5757
<InputLabel>{aboutData.commit_hash}</InputLabel>
5858
</Grid>
5959
</Grid>
6060
<Grid container spacing={0} style={{marginBottom: '8px'}}>
61-
<Grid item lg={3} md={3} sm={3} xs={12}>
61+
<Grid size={{ lg: 3, md: 3, sm: 3, xs: 12 }}>
6262
<InputLabel style={{fontWeight: 'bold'}}>{gettext('Python Version')}</InputLabel>
6363
</Grid>
64-
<Grid item lg={9} md={9} sm={9} xs={12}>
64+
<Grid size={{ lg: 9, md: 9, sm: 9, xs: 12 }}>
6565
<InputLabel>{aboutData.python_version}</InputLabel>
6666
</Grid>
6767
</Grid>
6868
<Grid container spacing={0} style={{marginBottom: '8px'}}>
69-
<Grid item lg={3} md={3} sm={3} xs={12}>
69+
<Grid size={{ lg: 3, md: 3, sm: 3, xs: 12 }}>
7070
<InputLabel style={{fontWeight: 'bold'}}>{gettext('Current User')}</InputLabel>
7171
</Grid>
72-
<Grid item lg={9} md={9} sm={9} xs={12}>
72+
<Grid size={{ lg: 9, md: 9, sm: 9, xs: 12 }}>
7373
<InputLabel>{aboutData.current_user}</InputLabel>
7474
</Grid>
7575
</Grid>
7676
{ aboutData.electron &&
7777
<Grid container spacing={0} style={{marginBottom: '8px'}}>
78-
<Grid item lg={3} md={3} sm={3} xs={12}>
78+
<Grid size={{ lg: 3, md: 3, sm: 3, xs: 12 }}>
7979
<InputLabel style={{fontWeight: 'bold'}}>{gettext('Electron Version')}</InputLabel>
8080
</Grid>
81-
<Grid item lg={9} md={9} sm={9} xs={12}>
81+
<Grid size={{ lg: 9, md: 9, sm: 9, xs: 12 }}>
8282
<InputLabel>{aboutData.electron}</InputLabel>
8383
</Grid>
8484
</Grid>
8585
}
8686
<Grid container spacing={0} style={{marginBottom: '8px'}}>
87-
<Grid item lg={3} md={3} sm={3} xs={12}>
87+
<Grid size={{ lg: 3, md: 3, sm: 3, xs: 12 }}>
8888
<InputLabel style={{fontWeight: 'bold'}}>{gettext('Browser')}</InputLabel>
8989
</Grid>
90-
<Grid item lg={9} md={9} sm={9} xs={12}>
90+
<Grid size={{ lg: 9, md: 9, sm: 9, xs: 12 }}>
9191
<InputLabel>{aboutData.browser_details}</InputLabel>
9292
</Grid>
9393
</Grid>
9494
{ aboutData.os_details &&
9595
<Grid container spacing={0} style={{marginBottom: '8px'}}>
96-
<Grid item lg={3} md={3} sm={3} xs={12}>
96+
<Grid size={{ lg: 3, md: 3, sm: 3, xs: 12 }}>
9797
<InputLabel style={{fontWeight: 'bold'}}>{gettext('Operating System')}</InputLabel>
9898
</Grid>
99-
<Grid item lg={9} md={9} sm={9} xs={12}>
99+
<Grid size={{ lg: 9, md: 9, sm: 9, xs: 12 }}>
100100
<InputLabel>{aboutData.os_details}</InputLabel>
101101
</Grid>
102102
</Grid>
103103
}
104104
{ aboutData.config_db &&
105105
<Grid container spacing={0} style={{marginBottom: '8px'}}>
106-
<Grid item lg={3} md={3} sm={3} xs={12}>
106+
<Grid size={{ lg: 3, md: 3, sm: 3, xs: 12 }}>
107107
<InputLabel style={{fontWeight: 'bold'}}>{gettext('pgAdmin Database File')}</InputLabel>
108108
</Grid>
109-
<Grid item lg={9} md={9} sm={9} xs={12}>
109+
<Grid size={{ lg: 9, md: 9, sm: 9, xs: 12 }}>
110110
<InputLabel>{aboutData.config_db}</InputLabel>
111111
</Grid>
112112
</Grid>
113113
}
114114
{ aboutData.log_file &&
115115
<Grid container spacing={0} style={{marginBottom: '8px'}}>
116-
<Grid item lg={3} md={3} sm={3} xs={12}>
116+
<Grid size={{ lg: 3, md: 3, sm: 3, xs: 12 }}>
117117
<InputLabel style={{fontWeight: 'bold'}}>{gettext('Log File')}</InputLabel>
118118
</Grid>
119-
<Grid item lg={9} md={9} sm={9} xs={12}>
119+
<Grid size={{ lg: 9, md: 9, sm: 9, xs: 12 }}>
120120
<InputLabel>{aboutData.log_file}</InputLabel>
121121
</Grid>
122122
</Grid>

‎web/pgadmin/dashboard/static/js/Graphs.jsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import {getGCD, getEpoch} from 'sources/utils';
1616
import {useInterval, usePrevious} from 'sources/custom_hooks';
1717
import PropTypes from 'prop-types';
1818
import StreamingChart from '../../../static/js/components/PgChart/StreamingChart';
19-
import { Grid, useTheme } from '@mui/material';
19+
import { Grid2 as Grid, useTheme } from '@mui/material';
2020
import { getChartColor, toPrettySize } from '../../../static/js/utils';
2121

2222
export const X_AXIS_LENGTH = 75;
@@ -253,30 +253,30 @@ export function GraphsWrapper(props) {
253253
return (
254254
<>
255255
<Grid container spacing={0.5}>
256-
<Grid item md={6}>
256+
<Grid size={{ md: 6 }}>
257257
<ChartContainer id='sessions-graph' title={props.isDatabase ? gettext('Database sessions') : gettext('Server sessions')}
258258
datasets={props.sessionStats.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
259259
<StreamingChart data={props.sessionStats} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options} valueFormatter={(v)=>toPrettySize(v, '')}/>
260260
</ChartContainer>
261261
</Grid>
262-
<Grid item md={6}>
262+
<Grid size={{ md: 6 }}>
263263
<ChartContainer id='tps-graph' title={gettext('Transactions per second')} datasets={props.tpsStats.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
264264
<StreamingChart data={props.tpsStats} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options} valueFormatter={(v)=>toPrettySize(v, '')}/>
265265
</ChartContainer>
266266
</Grid>
267267
</Grid>
268268
<Grid container spacing={0.5} style={{marginTop: '4px', marginBottom: '4px'}}>
269-
<Grid item md={4}>
269+
<Grid size={{ md: 4 }}>
270270
<ChartContainer id='ti-graph' title={gettext('Tuples in')} datasets={props.tiStats.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
271271
<StreamingChart data={props.tiStats} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options} valueFormatter={(v)=>toPrettySize(v, '')}/>
272272
</ChartContainer>
273273
</Grid>
274-
<Grid item md={4}>
274+
<Grid size={{ md: 4 }}>
275275
<ChartContainer id='to-graph' title={gettext('Tuples out')} datasets={props.toStats.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
276276
<StreamingChart data={props.toStats} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options} valueFormatter={(v)=>toPrettySize(v, '')}/>
277277
</ChartContainer>
278278
</Grid>
279-
<Grid item md={4}>
279+
<Grid size={{ md: 4 }}>
280280
<ChartContainer id='bio-graph' title={gettext('Block I/O')} datasets={props.bioStats.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
281281
<StreamingChart data={props.bioStats} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options} valueFormatter={(v)=>toPrettySize(v, '')}/>
282282
</ChartContainer>

‎web/pgadmin/dashboard/static/js/Replication/PGDReplication.jsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
//
88
//////////////////////////////////////////////////////////////
99

10-
import { Box, Grid, useTheme } from '@mui/material';
10+
import { Box, Grid2 as Grid, useTheme } from '@mui/material';
1111
import React, { useEffect, useMemo, useReducer, useRef, useState } from 'react';
1212

1313
import gettext from 'sources/gettext';
@@ -406,14 +406,14 @@ export default function PGDReplication({preferences, treeNodeInfo, pageVisible,
406406
return (
407407
<Box height="100%" display="flex" flexDirection="column">
408408
<Grid container spacing={0.5}>
409-
<Grid item md={6}>
409+
<Grid size={{ md: 6 }}>
410410
<ChartContainer id='sessions-graph' title={gettext('Replication lag (Time)')}
411411
datasets={replicationLagTimeData.datasets} errorMsg={errorMsg} isTest={props.isTest}>
412412
<StreamingChart data={replicationLagTimeData} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options}
413413
valueFormatter={(v)=>toPrettySize(v, 's')} />
414414
</ChartContainer>
415415
</Grid>
416-
<Grid item md={6}>
416+
<Grid size={{ md: 6 }}>
417417
<ChartContainer id='tps-graph' title={gettext('Replication lag (Size)')} datasets={replicationLagBytesData.datasets} errorMsg={errorMsg} isTest={props.isTest}>
418418
<StreamingChart data={replicationLagBytesData} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options}
419419
valueFormatter={toPrettySize} />

‎web/pgadmin/dashboard/static/js/SystemStats/CpuDetails.jsx‎

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,14 @@
66
// This software is released under the PostgreSQL Licence
77
//
88
//////////////////////////////////////////////////////////////
9-
9+
1010
import React, { useState, useEffect, useRef, useReducer, useMemo } from 'react';
1111
import PgTable from 'sources/components/PgTable';
1212
import gettext from 'sources/gettext';
1313
import PropTypes from 'prop-types';
1414
import {getGCD, getEpoch} from 'sources/utils';
1515
import ChartContainer from '../components/ChartContainer.jsx';
16-
import { Box, Grid } from '@mui/material';
16+
import { Box, Grid2 as Grid } from '@mui/material';
1717
import { DATA_POINT_SIZE } from 'sources/chartjs';
1818
import StreamingChart from '../../../../static/js/components/PgChart/StreamingChart.jsx';
1919
import {useInterval, usePrevious} from 'sources/custom_hooks';
@@ -217,14 +217,14 @@ export function CPUWrapper(props) {
217217
lineBorderWidth: props.lineBorderWidth,
218218
}), [props.showTooltip, props.showDataPoints, props.lineBorderWidth]);
219219
return (
220-
(<Box display="flex" flexDirection="column" height="100%">
220+
<Box display="flex" flexDirection="column" height="100%">
221221
<Grid container spacing={0.5} sx={{marginBottom: '4px'}}>
222-
<Grid item md={6}>
222+
<Grid size={{ md: 6 }}>
223223
<ChartContainer id='cu-graph' title={gettext('CPU usage')} datasets={props.cpuUsageInfo.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
224224
<StreamingChart data={props.cpuUsageInfo} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options} />
225225
</ChartContainer>
226226
</Grid>
227-
<Grid item md={6} >
227+
<Grid size={{ md: 6 }}>
228228
<ChartContainer id='la-graph' title={gettext('Load average')} datasets={props.loadAvgInfo.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
229229
<StreamingChart data={props.loadAvgInfo} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options} />
230230
</ChartContainer>
@@ -243,7 +243,6 @@ export function CPUWrapper(props) {
243243
</SectionContainer>
244244
</Box>
245245
</Box>
246-
)
247246
);
248247
}
249248

‎web/pgadmin/dashboard/static/js/SystemStats/Memory.jsx‎

Lines changed: 27 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import gettext from 'sources/gettext';
1212
import PropTypes from 'prop-types';
1313
import {getGCD, getEpoch} from 'sources/utils';
1414
import ChartContainer from '../components/ChartContainer';
15-
import { Box, Grid } from '@mui/material';
15+
import { Box, Grid2 as Grid } from '@mui/material';
1616
import { DATA_POINT_SIZE } from 'sources/chartjs';
1717
import StreamingChart from '../../../../static/js/components/PgChart/StreamingChart';
1818
import {useInterval, usePrevious} from 'sources/custom_hooks';
@@ -222,36 +222,34 @@ export function MemoryWrapper(props) {
222222
}), [props.showTooltip, props.showDataPoints, props.lineBorderWidth]);
223223

224224
return (
225-
(
226-
<Box display="flex" flexDirection="column" height="100%">
227-
<Grid container spacing={0.5} sx={{marginBottom: '4px'}}>
228-
<Grid item md={6}>
229-
<ChartContainer id='m-graph' title={gettext('Memory')} datasets={props.memoryUsageInfo.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
230-
<StreamingChart data={props.memoryUsageInfo} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options}
231-
valueFormatter={toPrettySize}/>
232-
</ChartContainer>
233-
</Grid>
234-
<Grid item md={6}>
235-
<ChartContainer id='sm-graph' title={gettext('Swap memory')} datasets={props.swapMemoryUsageInfo.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
236-
<StreamingChart data={props.swapMemoryUsageInfo} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options}
237-
valueFormatter={toPrettySize}/>
238-
</ChartContainer>
239-
</Grid>
225+
<Box display="flex" flexDirection="column" height="100%">
226+
<Grid container spacing={0.5} sx={{marginBottom: '4px'}}>
227+
<Grid size={{ md: 6 }}>
228+
<ChartContainer id='m-graph' title={gettext('Memory')} datasets={props.memoryUsageInfo.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
229+
<StreamingChart data={props.memoryUsageInfo} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options}
230+
valueFormatter={toPrettySize}/>
231+
</ChartContainer>
232+
</Grid>
233+
<Grid size={{ md: 6 }}>
234+
<ChartContainer id='sm-graph' title={gettext('Swap memory')} datasets={props.swapMemoryUsageInfo.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
235+
<StreamingChart data={props.swapMemoryUsageInfo} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options}
236+
valueFormatter={toPrettySize}/>
237+
</ChartContainer>
240238
</Grid>
241-
<Box flexGrow={1} minHeight={0}>
242-
<SectionContainer title={gettext('Process memory usage')}>
243-
<PgTable
244-
columns={props.tableHeader}
245-
data={props.processMemoryUsageStats}
246-
msg={props.errorMsg}
247-
type={'panel'}
248-
caveTable={false}
249-
tableNoBorder={false}
250-
></PgTable>
251-
</SectionContainer>
252-
</Box>
239+
</Grid>
240+
<Box flexGrow={1} minHeight={0}>
241+
<SectionContainer title={gettext('Process memory usage')}>
242+
<PgTable
243+
columns={props.tableHeader}
244+
data={props.processMemoryUsageStats}
245+
msg={props.errorMsg}
246+
type={'panel'}
247+
caveTable={false}
248+
tableNoBorder={false}
249+
></PgTable>
250+
</SectionContainer>
253251
</Box>
254-
)
252+
</Box>
255253
);
256254
}
257255

‎web/pgadmin/dashboard/static/js/SystemStats/Storage.jsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import PropTypes from 'prop-types';
1313
import url_for from 'sources/url_for';
1414
import {getGCD, getEpoch} from 'sources/utils';
1515
import ChartContainer from '../components/ChartContainer';
16-
import { Grid } from '@mui/material';
16+
import { Grid2 as Grid } from '@mui/material';
1717
import { DATA_POINT_SIZE } from 'sources/chartjs';
1818
import StreamingChart from '../../../../static/js/components/PgChart/StreamingChart';
1919
import {useInterval, usePrevious} from 'sources/custom_hooks';
@@ -424,7 +424,7 @@ export function StorageWrapper(props) {
424424
<DiskStatsTable tableHeader={props.tableHeader} data={props.diskStats} />
425425
</div>
426426
<Grid container spacing={0.5} sx={{marginBottom: '4px'}}>
427-
<Grid item md={6} sm={12}>
427+
<Grid size={{ md: 6, sm: 12 }}>
428428
<ChartContainer
429429
id='t-space-graph'
430430
title={''}
@@ -450,7 +450,7 @@ export function StorageWrapper(props) {
450450
/>
451451
</ChartContainer>
452452
</Grid>
453-
<Grid item md={6} sm={12}>
453+
<Grid size={{ md: 6, sm: 12 }}>
454454
<ChartContainer id='ua-space-graph' title={''} datasets={[{borderColor: '#FF6384', label: 'Used space'}, {borderColor: '#36a2eb', label: 'Available space'}]} errorMsg={props.errorMsg} isTest={props.isTest}>
455455
<BarChart data={{
456456
labels: props.diskStats.map((item, index) => getLabel(item, index)),
@@ -502,7 +502,7 @@ export function StorageWrapper(props) {
502502
<SectionContainer key={drive} title={drive} style={{minHeight: 'unset', height: 'auto', marginBottom: '0.5px'}}>
503503
<Grid container spacing={0.5} p={0.5}>
504504
{Object.keys(props.ioInfo[drive]).map((type, innerKeyIndex) => (
505-
<Grid key={`${type}-${innerKeyIndex}`} item md={4} sm={6}>
505+
<Grid key={`${type}-${innerKeyIndex}`} size={{ md: 4, sm: 6 }}>
506506
<ChartContainer id={`io-graph-${type}`} title={getChartContainerTitle(type)} datasets={transformData(props.ioInfo[drive][type], props.ioRefreshRate).datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
507507
<StreamingChart data={transformData(props.ioInfo[drive][type], props.ioRefreshRate)} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options}
508508
valueFormatter={(v)=>{

‎web/pgadmin/dashboard/static/js/SystemStats/Summary.jsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import url_for from 'sources/url_for';
1414
import getApiInstance from 'sources/api_instance';
1515
import {getGCD, getEpoch} from 'sources/utils';
1616
import ChartContainer from '../components/ChartContainer';
17-
import { Grid } from '@mui/material';
17+
import { Grid2 as Grid } from '@mui/material';
1818
import { DATA_POINT_SIZE } from 'sources/chartjs';
1919
import StreamingChart from '../../../../static/js/components/PgChart/StreamingChart';
2020
import {useInterval, usePrevious} from 'sources/custom_hooks';
@@ -250,26 +250,26 @@ function SummaryWrapper(props) {
250250
return (
251251
<>
252252
<Grid container spacing={0.5} sx={{height: 'auto', padding: '0px !important', marginBottom: '4px'}}>
253-
<Grid item md={6}>
253+
<Grid size={{ md: 6 }}>
254254
<div className='Summary-tableContainer'>
255255
<div className='Summary-containerHeader'>{gettext('OS information')}</div>
256256
<SummaryTable data={props.osStats} />
257257
</div>
258258
</Grid>
259-
<Grid item md={6} sx={{padding: '4px'}}>
259+
<Grid sx={{padding: '4px'}} size={{ md: 6 }}>
260260
<ChartContainer id='hpc-graph' title={gettext('Process & handle count')} datasets={props.processHandleCount.datasets} errorMsg={props.errorMsg} isTest={props.isTest}>
261261
<StreamingChart data={props.processHandleCount} dataPointSize={DATA_POINT_SIZE} xRange={X_AXIS_LENGTH} options={options} showSecondAxis={true} />
262262
</ChartContainer>
263263
</Grid>
264264
</Grid>
265265
<Grid container spacing={0.5} sx={{height: 'auto', padding: '0px !important', marginBottom: '4px'}}>
266-
<Grid item md={6}>
266+
<Grid size={{ md: 6 }}>
267267
<div className='Summary-tableContainer'>
268268
<div className='Summary-containerHeader'>{gettext('CPU information')}</div>
269269
<SummaryTable data={props.cpuStats} />
270270
</div>
271271
</Grid>
272-
<Grid item md={6} sm={12}>
272+
<Grid size={{ md: 6, sm: 12 }}>
273273
</Grid>
274274
</Grid>
275275
</>

0 commit comments

Comments
 (0)