I'm using datagrid component from material ui, I bring some data from a database and try to pass it to the datagrid component. Some fields contain long strings and not all of them appear in the column (Titre PFE) .

What I'm trying to do is to display something like that :

Développement d’une application mobile
ecommerce

     <div style={{ height: 515, width: "100%" }}>
            <DataGrid
              rows={pfeList}
              columns={columns}
              pageSize={8}
              autoPageSize
              rowsPerPageOptions={[7]}
            />
          </div>

  const columns = [
    {
      field: "titre",
      headerName: "Titre PFE",
      headerAlign: "center",
      width: 380,
    },
.
.
.
.
.
];

What should I fix here to get the desired result?