как отобразить имя отправителя в сообщении для группового чата в приложении для работы с родными сообщениями и не показывать его имя, если следующие сообщения отправлены им?

Question

У меня есть приложение для обмена сообщениями на собственном языке, и оно содержит групповые сообщения. Теперь я хочу показать имя отправителя в конкретном сообщении. Я уже показываю имя отправителя в сообщении. но я хочу сделать, как, когда есть несколько сообщений о нем подряд, показывать его имя только в первом сообщении.

вот снимки экрана.

посмотрите, что имя отображается во всех сообщениях на первом изображении.

теперь хочу сделать это так, поэтому показывать его имя только в первом сообщении.

в листе рассылки, где я использовал, чтобы отобразить имя, как это

`<Text numberOfLines={1} style={{
                              flexDirection: 'row',alignItems:'center',textAlignVertical:'center',
                              flexWrap: 'wrap', color: 'rgb(44,88,157)', fontWeight: '600',
                              paddingLeft: 0,
                              justifyContent: 'flex-start',
                            }}
                            >{item.sender_user_id.nick_name
                              }</Text>`

Answer 1

Создайте Message компонент, который имеет логическое свойство showName

renderMessage(showName = true, name, body) {
    return <Message showName={showName} name={name} body={body}/>
}

Чтобы отобразить имя в первом из нескольких сообщений:

1. В визуализации сообщений используйте переменную, которая отслеживает идентификатор отправителя последнего сообщения.
2. Установите для showName значение true, если последний идентификатор не определен или отличается.

Пример

renderMessages(messages) {
    let lastSenderId = undefined;

    messages.map(message => {
        let showName = !lastSenderId || message.senderId !== lastSenderId;
        lastSenderId = message.senderId;
        renderMessage(showName, message.name, message.body)
    });
}

Для отображения имени в последнем из нескольких сообщений:

1. Если следующего сообщения нет, покажите имя
2. Если следующее сообщение имеет другого отправителя, покажите имя

Пример

renderMessages(messages) {
    const lastIndex = messages.length - 1;
    messages.map((message, i) => {
        let showName = false;
        if(i === lastIndex) {
            showName = true;
        }
        else {
            const nextName = messages[i+1].name;
            if(message.name !== nextName) {
                showName = true;
            }
        }
        renderMessage(showName, message.name, message.body)
    });
}