How can I create a property for a tooltip component in react which allows fellow developers to not render a certain part of the component?

See more:

Javascript

React

Having the code of a tooltip component + a triangle indicator around it, I am supposed to create a property within this component which allows my fellow developers to remove the indicator when necessary. However, the indicator is after my attempts still showing


demo.index.js

  return (
    <div>
      <h1>tooltip Demo</h1>

      <Tooltip
        title={"Text für Länge des Tooltips - noch länger"}
        body={
          <span>
            Test in Kursiv
          </span>
        }
        hide_indicator={true}
      >
        <button style={{ width: 200, margin: "0 auto" }}>Tooltip</button>
      </Tooltip>
    </div>
  );
};

What I have tried:

in the src.index.js I have created a function and the react.fragment in the return block taking up this function.

FUNCTION

handleIndicator = node => {
  this.setState({
    hide_indicator: false,
  });
};

RETURN BLOCK

render() {
    const { className, classes, light, isHtml, hideIndicator } = this.props;

...

hide_indicator={
           <React.Fragment>
             <span hide_indicator={true} ref={this.handleIndicator} />
           </React.Fragment>
         }