Skip to content

Commit

Permalink
refactor(chat-view): temporarily disable message bubble read receipts…
Browse files Browse the repository at this point in the history 
… processing (#2079)

* refactor(chat-view): temporarily disable message bubble read receipts processing

* refactor: disable tests
  • Loading branch information
@domw30
domw30 committed Jul 6, 2024
1 parent 394e9b4 commit 8d16205
Show file tree
Hide file tree
Showing 3 changed files with 101 additions and 101 deletions.
38 changes: 19 additions & 19 deletions src/components/chat-view-container/chat-view.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -137,25 +137,25 @@ export class ChatView extends React.Component<Properties, State> {
return this.props.user && message?.sender && this.props.user.id == message.sender.userId;
}

isRead() {
const lastMessage = this.getUsersLastNonAdminMessage();
if (!lastMessage) return false;
return lastMessage?.readBy && lastMessage.readBy.length > 0;
}

getUsersLastNonAdminMessage() {
const { messages } = this.props;
const currentUser = this.props.user;
for (let i = messages.length - 1; i >= 0; i--) {
if (!messages[i].isAdmin && messages[i].sender?.userId === currentUser?.id) {
return messages[i];
}
}
return null;
}
// isRead() {
// const lastMessage = this.getUsersLastNonAdminMessage();
// if (!lastMessage) return false;
// return lastMessage?.readBy && lastMessage.readBy.length > 0;
// }

// getUsersLastNonAdminMessage() {
// const { messages } = this.props;
// const currentUser = this.props.user;
// for (let i = messages.length - 1; i >= 0; i--) {
// if (!messages[i].isAdmin && messages[i].sender?.userId === currentUser?.id) {
// return messages[i];
// }
// }
// return null;
// }

renderMessageGroup(groupMessages) {
const lastMessage = this.getUsersLastNonAdminMessage();
// const lastMessage = this.getUsersLastNonAdminMessage();

return groupMessages.map((message, index) => {
if (message.isAdmin) {
Expand Down Expand Up @@ -199,8 +199,8 @@ export class ChatView extends React.Component<Properties, State> {
showTimestamp={messageRenderProps.showTimestamp}
showAuthorName={messageRenderProps.showAuthorName}
onHiddenMessageInfoClick={this.props.onHiddenMessageInfoClick}
isMessageRead={this.isRead()}
isLastMessage={message.id === lastMessage?.id}
// isMessageRead={this.isRead()}
// isLastMessage={message.id === lastMessage?.id}
{...message}
/>
</div>
Expand Down
118 changes: 59 additions & 59 deletions src/components/message/index.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -472,63 +472,63 @@ describe('message', () => {
});
});

describe('getReceiptIcon', () => {
it('renders IconCheck for in-progress messages', () => {
const wrapper = subject({
message: 'text',
sendStatus: MessageSendStatus.IN_PROGRESS,
isOwner: true,
isLastMessage: true,
});

expect(wrapper.find('.message__sent-icon')).toExist();
});

it('renders IconCheckDouble with "read" class for read messages', () => {
const wrapper = subject({
message: 'text',
sendStatus: MessageSendStatus.SUCCESS,
isOwner: true,
isLastMessage: true,
isMessageRead: true,
});

expect(wrapper.find('.message__read-icon--read')).toExist();
});

it('renders IconCheckDouble with "delivered" class for delivered messages', () => {
const wrapper = subject({
message: 'text',
sendStatus: MessageSendStatus.SUCCESS,
isOwner: true,
isLastMessage: true,
isMessageRead: false,
});

expect(wrapper.find('.message__read-icon--delivered')).toExist();
});

it('renders IconCheckDouble with "delivered" class when sendStatus is undefined', () => {
const wrapper = subject({
message: 'text',
sendStatus: undefined,
isOwner: true,
isLastMessage: true,
});

expect(wrapper.find('.message__read-icon--delivered')).toExist();
});

it('renders nothing for failed messages', () => {
const wrapper = subject({
message: 'text',
sendStatus: MessageSendStatus.FAILED,
isOwner: true,
isLastMessage: true,
});

expect(wrapper.find('.message__read-icon')).not.toExist();
expect(wrapper.find('.message__sent-icon')).not.toExist();
});
});
// describe('getReceiptIcon', () => {
// it('renders IconCheck for in-progress messages', () => {
// const wrapper = subject({
// message: 'text',
// sendStatus: MessageSendStatus.IN_PROGRESS,
// isOwner: true,
// isLastMessage: true,
// });

// expect(wrapper.find('.message__sent-icon')).toExist();
// });

// it('renders IconCheckDouble with "read" class for read messages', () => {
// const wrapper = subject({
// message: 'text',
// sendStatus: MessageSendStatus.SUCCESS,
// isOwner: true,
// isLastMessage: true,
// isMessageRead: true,
// });

// expect(wrapper.find('.message__read-icon--read')).toExist();
// });

// it('renders IconCheckDouble with "delivered" class for delivered messages', () => {
// const wrapper = subject({
// message: 'text',
// sendStatus: MessageSendStatus.SUCCESS,
// isOwner: true,
// isLastMessage: true,
// isMessageRead: false,
// });

// expect(wrapper.find('.message__read-icon--delivered')).toExist();
// });

// it('renders IconCheckDouble with "delivered" class when sendStatus is undefined', () => {
// const wrapper = subject({
// message: 'text',
// sendStatus: undefined,
// isOwner: true,
// isLastMessage: true,
// });

// expect(wrapper.find('.message__read-icon--delivered')).toExist();
// });

// it('renders nothing for failed messages', () => {
// const wrapper = subject({
// message: 'text',
// sendStatus: MessageSendStatus.FAILED,
// isOwner: true,
// isLastMessage: true,
// });

// expect(wrapper.find('.message__read-icon')).not.toExist();
// expect(wrapper.find('.message__sent-icon')).not.toExist();
// });
// });
});
46 changes: 23 additions & 23 deletions src/components/message/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import { UserForMention } from '../message-input/utils';
import EditMessageActions from './edit-message-actions/edit-message-actions';
import { MessageMenu } from '../../platform-apps/channels/messages-menu';
import AttachmentCards from '../../platform-apps/channels/attachment-cards';
import { IconAlertCircle, IconCheck } from '@zero-tech/zui/icons';
import { IconAlertCircle } from '@zero-tech/zui/icons';
import { Avatar } from '@zero-tech/zui/components';
import { ContentHighlighter } from '../content-highlighter';
import { bemClassName } from '../../lib/bem';
Expand Down Expand Up @@ -50,8 +50,8 @@ interface Properties extends MessageModel {
showAuthorName: boolean;
isHidden: boolean;
onHiddenMessageInfoClick: () => void;
isMessageRead: boolean;
isLastMessage: boolean;
// isMessageRead: boolean;
// isLastMessage: boolean;
}

export interface State {
Expand Down Expand Up @@ -152,25 +152,25 @@ export class Message extends React.Component<Properties, State> {
return '';
}

getReceiptIcon() {
const { sendStatus, isMessageRead } = this.props;
// getReceiptIcon() {
// const { sendStatus, isMessageRead } = this.props;

if (sendStatus === MessageSendStatus.IN_PROGRESS) {
return <IconCheck {...cn('sent-icon')} size={14} />;
}
// if (sendStatus === MessageSendStatus.IN_PROGRESS) {
// return <IconCheck {...cn('sent-icon')} size={14} />;
// }

if (sendStatus === MessageSendStatus.SUCCESS || sendStatus === undefined) {
const iconClass = isMessageRead ? 'read' : 'delivered';
return (
<div {...cn('read-icon-container')}>
<IconCheck {...cn('read-icon', `${iconClass}`)} size={12} />
<IconCheck {...cn('read-icon', `${iconClass}`)} size={12} />
</div>
);
}
// if (sendStatus === MessageSendStatus.SUCCESS || sendStatus === undefined) {
// const iconClass = isMessageRead ? 'read' : 'delivered';
// return (
// <div {...cn('read-icon-container')}>
// <IconCheck {...cn('read-icon', `${iconClass}`)} size={12} />
// <IconCheck {...cn('read-icon', `${iconClass}`)} size={12} />
// </div>
// );
// }

return null;
}
// return null;
// }

renderFooter() {
if (this.state.isEditing) {
Expand All @@ -194,10 +194,10 @@ export class Message extends React.Component<Properties, State> {
</div>
);
}
if (this.props.isOwner && this.props.isLastMessage) {
const icon = this.getReceiptIcon();
icon && footerElements.push(icon);
}
// if (this.props.isOwner && this.props.isLastMessage) {
// const icon = this.getReceiptIcon();
// icon && footerElements.push(icon);
// }

if (footerElements.length === 0) {
return;
Expand Down

0 comments on commit 8d16205

Please sign in to comment.