przyporządkowanie do danej nazwy zagadki

Wyświetlam sobie nazwy, obok kazdej nazwy tworze button, po kliknieciu w button otwiera mi sie modal i chciałym aby w kazdym modalu byla przyporządkowana jedna zagadka dla danej nazwy. Proszę o pomoc.

state = 
{history: [{Name:"nazwa1"},{Name:"nazwa2"},{Name:"nazwa3"}],
currentHistoryIndex: 0
}
render(){
return(
 {this.state.history[this.state.currentHistoryIndex] && (
                  <ul>
                    {this.state.history[this.state.currentHistoryIndex].map((historyRecord, index) => {
                      return 
		     <>
                        <li key={index}>{`Nazwa: ${historyRecord.Name}`}</li>
                        <button className="btn" onClick={this.openModal}>Zagraj</button>
                      </>
                    })}
                  </ul>
                )}
)}

Troche nieprecyzyjnie określiłeś co ma robić ten kod. Możesz doprecyzować ?

mam zwykłę nazwy:
-nazwa 1 <button>Graj</button>
-nazwa 2 <button>Graj</button>
-nazwa 3 <button>Graj</button>
i po kliknieciu graj dla danej nazwy bylo przyporzadkowane jedno pytanie np ile masz lat , dla drugiej nazwy np jak masz na imie. I pytanie jak uzyskac taki efekt ?

Musisz użyć pętli. Dla każdego elementu z Twojego statu history stwórz element listy w którym umieścisz nazwę historyRecord i button z funkcją onClick={openModel()}

https://daveceddia.com/display-a-list-in-react/
https://stackoverflow.com/questions/41374572/how-to-render-an-array-of-objects-in-react

no to tak zrobilem :

 {this.state.history[this.state.currentHistoryIndex].map((historyRecord, index) => {
                      return 
             <>
                        <li key={index}>{`Nazwa: ${historyRecord.Name}`}</li>
                        <button className="btn" onClick={this.openModal}>Zagraj</button>
                      </>

musze do this.state.history dodać do obiektu kolejny element np question:"ile masz lat" ?

Widzę nie do końca rozumiesz jak działa pętla. Powinno to wyglądać tak .
{this.state.history.map((item, i) => {
return {item.Name}<button>Graj</button></li>
})}
u Ciebie nie wiadomo po co jest to : [this.state.currentHistoryIndex], no i button renderujesz poza elementem li

no dobrze, ale gdy klikne graj to odpala mi sie jak na razie pusty modal, a chcialbym zeby np 1 nazwie bylo przyporzadkowane 1 pytanie dla 2 nazwy bylo przyporzakowane inne pytanie, czy musze dodać do stanu osobna tablice? czy do history musze dodac element z pytaniem?

Do funkcji opemodal możesz przekazywać parametr i w ten sposób openModal(i). Wtedy będziesz w niej miał index klikniętego buttona w funkcji openModal(), więc możesz stworzyc osobną tablicę na modale i wyświetlać odpowiedni modal na podstawie tego parametru i który wpadł do funkcji. Tak bym kombinował