runfix: Missing OutlineCheck Icon (#17609) (#17610)

Author: przemvs

src/script/components/MessagesList/Message/ContentMessage/ContentMessage.tsx

@@ -23,7 +23,8 @@ import {QualifiedId} from '@wireapp/api-client/lib/user';
 import cx from 'classnames';
 import ko from 'knockout';
 
-import {Icon} from 'Components/Icon';
+import {OutlineCheck} from '@wireapp/react-ui-kit';
+
 import {ReadIndicator} from 'Components/MessagesList/Message/ReadIndicator';
 import {Conversation} from 'src/script/entity/Conversation';
 import {CompositeMessage} from 'src/script/entity/message/CompositeMessage';
@@ -270,7 +271,7 @@ export const ContentMessageComponent = ({
         <div css={deliveredMessageIndicator}>
           {showDeliveredMessageIcon && (
             <div data-uie-name="status-message-read-receipt-delivered" title={t('conversationMessageDelivered')}>
-              <Icon.OutlineCheck />
+              <OutlineCheck />
             </div>
           )}
         </div>

src/script/components/MessagesList/Message/PingMessage.tsx

@@ -19,7 +19,8 @@
 
 import cx from 'classnames';
 
-import {Icon} from 'Components/Icon';
+import {OutlineCheck} from '@wireapp/react-ui-kit';
+
 import {useKoSubscribableChildren} from 'Util/ComponentUtil';
 import {t} from 'Util/LocalizerUtil';
 import {checkIsMessageDelivered} from 'Util/util';
@@ -67,7 +68,7 @@ const PingMessage = ({message, is1to1Conversation, isLastDeliveredMessage}: Ping
 
         {showDeliveredMessageIcon ? (
           <div className="message-ping-delivered-icon" title={t('conversationMessageDelivered')}>
-            <Icon.OutlineCheck />
+            <OutlineCheck />
           </div>
         ) : (
           <ReadReceiptStatus message={message} is1to1Conversation={is1to1Conversation} />

src/script/components/MessagesList/Message/ReadReceiptStatus.tsx

@@ -42,7 +42,7 @@ export const ReadReceiptStatus = ({message, is1to1Conversation, onClickDetails}:
       const text = is1to1Conversation ? formatTimeShort(readReceipts[0].time) : readReceipts.length.toString(10);
       setReadReceiptText(text);
     }
-  }, [is1to1Conversation, message.expectsReadConfirmation, readReceipts]);
+  }, [is1to1Conversation, readReceipts]);
 
   const showEyeIndicator = !!readReceiptText;
 

src/script/util/util.ts

@@ -320,7 +320,7 @@ export const removeAnimationsClass = (element: HTMLElement | null) => {
   }
 };
 
-export const checkIsMessageDelivered = (isLastDeliveredMessage: boolean, readReceipts: ReadReceipt[]) => {
-  const readReceiptText = readReceipts.length ? formatTimeShort(readReceipts[0].time) : '';
+export const checkIsMessageDelivered = (isLastDeliveredMessage: boolean, readReceipts?: ReadReceipt[]) => {
+  const readReceiptText = readReceipts?.length ? formatTimeShort(readReceipts[0].time) : '';
   return isLastDeliveredMessage && readReceiptText === '';
 };