const ChildBtn = ({ handleClick, btnText }) => {
    return <button onClick={() => handleClick()}>{btnText || "default btn text"}</button>;
  };

  const Parent = (props) => {
    const parentFunction = () => {
      console.log(props.consoleString || "default console text");
    };
  
    return <div><ChildBtn handleClick={parentFunction} btnText={props.btnText} /></div>;
  };

We have a Parent component that contains the child component “ChildBtn”. Parent has the function parentFunction which is passed into the child. We can also specify the console log text and the button text. We can then use the component like so:

<ChildBtn consoleString={"string here"} btnText={"apply"} />