I need small help regarding custom component called as SectionButton who acts as button and perform operation on click of button. Whenever for first time I tried to click to button it wont work but for second time it do work properly and I am not getting why it didn't work.

    import React, {Component} from 'react';
import './section-button.scss';

class SectionButton extends Component {
  constructor(props) {
    super(props);
  }
  
  render() {
    let classButton = "section-button";
    this.props.type == "form" ? classButton += " form" : "";
    this.props.type == "done" ? classButton += " done" : "";
    this.props.active == true ? classButton += " active" : "";
    return (
      <div className={classButton} onClick={() => this.props.select(this.props.typeMethod || "")}>
        <span>{this.props.title}</span>
      </div>
    );
  }
}

export default SectionButton;

Where the type method is

<SectionButton title="Use a Card" type="form" active={this.state.methodPay == "card" ? true : false}
                               typeMethod={"card"} select={this.changeMethodPay}/>

But when I click another button without typemethod tag in that it won't work for first time.

Here is that button :

<div className="button-form" onClick={this.state.activeContinue ? this.state.paymentmethod === "Enter New Method" ? this.goToPay : this.confirmationPay : ()=>{}}>
              <SectionButton title={this.state.paymentmethod !== "Enter New Method" ? "REVIEW PAYMENT" : "NEXT"}  type="form" active={this.state.activeContinue}/>
            </div>

The error we got on inspect