Como eu posso fazer que um <button> só apareça quando meu for chegar em determinado valor?

Estou querendo mostrar um com uma rota para outra pag, mas que isso apareça só quando o meu chegar em 4. Poderiam me ajudar ?

import React from 'react';
import ReactDOM from 'react-dom';
import './style.css'
export default function Status(){

let estados = ['Geração Iniciada', 'Geração Finalizada', 'Registro Inciado', 'Registro Finalizado', 'Revogação Iniciada', 'Revogação Finalizada']

const button = [(<button>Continuar</button>)]

for(let i = 0; i < estados.length; i++){
    if(i == 4){
        button.push()  
    } 
}
return(
    <div className="container">
        <div className="box-statusA">
            <div className="spinner">
            </div>
            {button}
        </div>
    </div>
)
}
ReactDOM.render(
    <Status/>,
    document.getElementById('root'))