ReactJS: How to Disable toolbar from material table but not add functionality

Question

I want to remove toolbar, as it is creating a blank space between table and button. But as i set toolbar:false, it also disable my add new row functionality. What is the way to disable toolbar but not add functionality?

  <MaterialTable
            title=" "
           
            options={{
              search: false,
              selection: true,
              showTitle: false,
             toolbar:false,
             
            
              paging: false,
            }}
           
            columns={columns}
            data={a}
            icons={tableIcons}
            editable={{
              onRowUpdate: (newData, oldData) =>
                new Promise((resolve) => {
                  handleRowUpdate(newData, oldData, resolve);
                }),
              onRowAdd: (newData) =>
                new Promise((resolve) => {
                  handleRowAdd(newData, resolve);
                }),
              onRowDelete: (oldData) =>
                new Promise((resolve) => {
                  handleRowDelete(oldData, resolve);
                }),
            }}
          />

Answer 1

I think this code snippet shall solve your problem.

<MaterialTable
  title=" "
  components={{
    Toolbar: (props) => (
      <div
        style={{
          height: "0px",
        }}
      >
        <MTableToolbar {...props} />
      </div>
    ),
  }}
  options={{
    search: false,
    selection: true,
    showTitle: false,
    toolbar: false,

    paging: false,
  }}
  columns={columns}
  data={a}
  icons={tableIcons}
  editable={{
    onRowUpdate: (newData, oldData) =>
      new Promise((resolve) => {
        handleRowUpdate(newData, oldData, resolve);
      }),
    onRowAdd: (newData) =>
      new Promise((resolve) => {
        handleRowAdd(newData, resolve);
      }),
    onRowDelete: (oldData) =>
      new Promise((resolve) => {
        handleRowDelete(oldData, resolve);
      }),
  }}
/>;