import { DataGrid } from "@mui/x-data-grid";
import type { GridRowsProp, GridColDef } from "@mui/x-data-grid";
import Container from '@mui/material/Container';
import { ruRU } from '@mui/x-data-grid/locales';

import ram_prices from "../table";

function RamGrid() {
  const rows: GridRowsProp = ram_prices;
  const columns: GridColDef[] = [
    { field: 'type', headerName: 'Type', flex: 0.5},
    { field: 'name', headerName: 'Model', flex: 1},
    { field: 'maker', headerName: 'Maker', flex: 0.5},
    { field: 'size',  headerName: 'Size (GB)',lex: 0.5},
    { field: 'release',  headerName: 'Release Year-month'},
    { field: 'price' ,headerName: 'Price(USD)'},
  ]
  return (
   <Container maxWidth="lg" sx={{height: '700px', mt: '20px'}}>
     <DataGrid
       localeText={ruRU.components.MuiDataGrid.defaultProps.localeText}
       rows={rows}
       columns={columns}
    />
   </Container>
 )
}
export default RamGrid;