show div when selecting a checkbox - reactjs

Question

1. I have two buttons, one is called "select" the other "selected", when I click the "select" button it loads a "div", this "div" has three more "div" and each one has a checkbox, it works for me No problem.

2. When I click the second "selected" button, it loads a different div and it contains three "div" with the checkboxes, with the same names that it shows when I click the "select" button, it works for me without problems.

What I need: when I click the "selected" button it shows me only the "div" whose checkbox has been selected in the div that contains the "select" button. i tried to solve it but it doesn't work for me, sent my source code.

import React,{useState} from 'react'

function Pruebas3() {

  const [value2, setValue2] = useState("");

  const handlerOnClick = (e) => {
    setValue2(e.target.value)
  }
  
  return (
    <div>
        <div className="col-sm-6">
        <div className="form-check">

        <input
            type="button"
            name="boton1"
            value="seleccionar"           
            onClick={handlerOnClick}
        /> 
        
  &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 
          <input
            type="button"
            name="boton1"
            value="seleccionados"           
            onClick={handlerOnClick}
          /> 
        </div>
      </div>

      <div className="col-sm-7">
        {value2 === "seleccionar" && (
          <div className="card">
            <div className="card-body">

        <div>Div1<input type="checkbox" name="check_1" /></div>
        <div>Div2<input type="checkbox" name="check_2"/></div>
        <div>Div3<input type="checkbox" name="check_3"/></div>

            </div>
          </div>
        )}
      </div>

      <div className="col-sm-7">
        {value2 === "seleccionados" && (
          <div className="card">
            <div className="card-body">
              <h1>CHECK seleccionados</h1>
             {
                this.checkbox =="check_1"
               ? <div>Div1<input type="checkbox" name="check_1" /></div> : ""
             } 
             {
                this.checkbox =="check_2"
               ? <div>Div2<input type="checkbox" name="check_2" /></div> : ""
             } 
              {
                this.checkbox =="check_3"
               ? <div>Div3<input type="checkbox" name="check_3" /></div> : ""
             } 
            </div>
          </div>
        )}
      </div>
      
    </div>
  )
}

export default Pruebas3