How to update this to work with new MUI v6 Grid2?

I’m trying to update my project to the new Material UI v6 version, but I’m encountering layout issues after upgrading to the new Grid v2. The layout of the chart (and possibly other components) gets compressed and loses its full width. I tried removing the item property from the Grid, but that didn’t fix the issue.

I’m using Vite as the bundler and Material UI v6. Below is the code for my dashboard page:

import React from "react";
import Grid from "@mui/material/Grid";
import { Box, useMediaQuery, useTheme } from "@mui/material";
import PageContainer from "../../components/container/PageContainer";
import StockOverview from "./components/StockOverview";
import StockUnderSafety from "./components/StockUnderSafety";
import SalesOverview from "./components/SalesOverview";

const Dashboard = () => {
  const theme = useTheme();
  const isSmallScreen = useMediaQuery(theme.breakpoints.down("sm"));

  return (
    <PageContainer title="Dashboard" description="This is Dashboard">
      <Box
        sx={{
          display: "flex",
          justifyContent: "center",
          alignItems: "center",
          minHeight: "100vh",
          padding: isSmallScreen ? theme.spacing(2) : theme.spacing(8),
        }}
      >
        <Grid container spacing={2} maxWidth={"100%"}>
         
          <Grid item xs={12} lg={8}>
            <SalesOverview />
          </Grid>

          
          <Grid item xs={12} lg={4} container direction="column" spacing={2}>
            <Grid item>
              <StockOverview />
            </Grid>
            <Grid item>
              <StockUnderSafety />
            </Grid>
          </Grid>
        </Grid>
      </Box>
    </PageContainer>
  );
};
export default Dashboard;







[[enter image description here](https://i.sstatic.net/rEbr93ik.png)](https://i.sstatic.net/LML2VBdr.png)

The problem is that after updating to the new Grid v2, the chart layout shrinks, especially in width. I tried removing the item property from the Grid, but nothing changed. Here's an image showing the issue.

Environment:

Material UI v6
Vite
React
Any suggestions on how to resolve this problem are appreciated.