Mathematics Lifecycle Render

mathematics-lifecycle-render.js

render() {
  const {start, finish, init, lvl} = this.state;

  return (
    <div class={`mathematics mathematics--lvl-${lvl.internalLabel}`}>

      <div class={'mathematics__body'}>
        {init && (
          <div class={'mathematics__init'}>
            {this.renderInitGame()}
          </div>
        )}

        {start && (
          <div class={'mathematics__start'}>
            {this.renderStartGame()}
          </div>
        )}

        {finish && (
          <div class={'mathematics__finish'}>
            {this.renderFinishGame()}
          </div>
        )}
      </div>
    </div>
  );
}