Как визуализировать различный контент в сопоставленном компоненте

Question

У меня есть компонент <OnGoingSurveyCard/>, где пользователь может нажать 2 кнопки: да или нет. Когда пользователь нажал одну из этих кнопок, я хочу отобразить <ActivityIndicator/> при публикации данных в веб-сервисе. После успешного добавления данных в базу данных я хочу показать сообщение, пришедшее с веб-сервиса. Этот компонент рендеринг с функцией .map().

Пока это мои работы; я могу показать <ActivityIndicator/> во время публикации, и сообщение из БД после успешного размещения. Моя проблема заключается в том, что при нажатии кнопки все отображенные компоненты <OnGoingSurveyCard/> показывают <ActivityIndicator/>, а после этого все они показывают одно и то же сообщение.

Это мой <OnGoingSurveyCard/>:

  render() {
    const { questionId, cardTitle, cardDescription, handleAnswerPress, isQuestionAdding } = this.props;
    return (
      <View style={styles.container}>
        <Card containerStyle={styles.votingCardContainer} title={cardTitle}>
          <View style={styles.votingCard}>
            <Text style={{ alignItems: 'center', fontSize: 23 }}>
              {cardDescription}
            </Text>
            {isQuestionAdding ? this.renderActivityIndicator() : this.renderButtons(handleAnswerPress, questionId)}
          </View>
        </Card>
      </View>
    );
  }

Вот как я отображаю <OnGoingSurveyCard/> в <MainScreen/>, где происходят все действия:

const { activeSurveys, isQuestionAdding } = this.state;
{activeSurveys.map(activeSurvey => {
                return (
                  <OnGoingSurveyCard
                    questionId={activeSurvey.QuestionId}
                    handleAnswerPress={this.handleAnswerPress}
                    cardTitle={activeSurvey.Title}
                    cardDescription={activeSurvey.Description}
                    isQuestionAdding={isQuestionAdding}
                  />
                );
              })}

Получение и управление состояниями:

    fetch(url, {
      headers: headers,
      method: 'GET',
      body: JSON.stringify({
        UserId: userId,
        QuestionId: questionId,
        QuestionVote: yesPressed,
      }),
    })
      .then(response => response.json())
      .then(responseJson => {
        if(responseJson.statusCode === "200"){
          this.setState({
            isQuestionAdding: false,
          })
        }
      })
      .catch(error => console.log('Error: ', error));

Любая помощь будет оценена, спасибо.