اضافه کردن customize toolbar در muitable

سلام به این شکل میتونید انجامش بدید

import React from "react";
import IconButton from "@material-ui/core/IconButton";
import Tooltip from "@material-ui/core/Tooltip";
import AddIcon from "@material-ui/icons/Add";
import { withStyles } from "@material-ui/core/styles";

const defaultToolbarStyles = {
  iconButton: {}
};

class CustomToolbar extends React.Component {
  state = {
    button: true
  };
  handleClick = () => {
    this.setState({
      button: !this.state.button
    });
  };

  render() {
    const { classes } = this.props;
    const sina = (
      <React.Fragment>
        <div style={{ backgroundColor: "red" }}>
          <h1>test test test</h1>
        </div>
      </React.Fragment>
    );
    return (
      <React.Fragment>
        <Tooltip title={"add item"}>
          <IconButton className={classes.iconButton} onClick={this.handleClick}>
            {this.state.button ? sina : null}
            <AddIcon className={classes.deleteIcon} />
          </IconButton>
        </Tooltip>
      </React.Fragment>
    );
  }
}

export default withStyles(defaultToolbarStyles, { name: "CustomToolbar" })(
  CustomToolbar
);