diff --git a/web/chat/chat-message-list.css b/web/chat/chat-message-list.css
index 6ed583e66..b655e91e6 100644
--- a/web/chat/chat-message-list.css
+++ b/web/chat/chat-message-list.css
@@ -1,254 +1,224 @@
 div.container {
   margin-left: 400px;
   height: 100%;
   background-color: var(--bg);
   display: flex;
   flex-direction: column;
   box-sizing: border-box;
 }
 div.activeContainer {
   border: 2px solid #5989d6;
   margin-left: 402px;
 }
 div.outerMessageContainer {
   position: relative;
   height: calc(100vh - 128px);
   min-height: 0;
   display: flex;
   flex-direction: column;
 }
 div.messageContainer {
   height: 100%;
   overflow-y: auto;
   display: flex;
   flex-direction: column-reverse;
 }
 div.mirroredMessageContainer {
   flex-direction: column !important;
   transform: scaleY(-1);
 }
 div.mirroredMessageContainer > div {
   transform: scaleY(-1);
 }
 
 div.message {
   display: flex;
   flex-direction: column;
   flex-shrink: 0;
 }
 
 div.loading {
   text-align: center;
   padding: 12px;
 }
 
 div.conversationHeader {
   color: var(--chat-timestamp-color);
   font-size: var(--xs-font-12);
   line-height: var(--line-height-text);
   text-align: center;
 }
 div.conversationHeader:last-child {
   padding-top: 6px;
 }
-div.messageLeftTooltip:after {
-  top: 7px;
-  right: -14px;
-  border-color: transparent transparent transparent var(--tool-tip-bg);
-}
-div.messageRightTooltip:after {
-  top: 7px;
-  left: -14px;
-  border-color: transparent var(--tool-tip-bg) transparent transparent;
-}
-div.messageTopLeftTooltip:after {
-  bottom: -14px;
-  left: 4px;
-  border-color: var(--tool-tip-bg) transparent transparent transparent;
-}
-div.messageTopRightTooltip:after {
-  bottom: -14px;
-  right: 4px;
-  border-color: var(--tool-tip-bg) transparent transparent transparent;
-}
-div.messageBottomLeftTooltip:after {
-  top: -14px;
-  left: 4px;
-  border-color: transparent transparent var(--tool-tip-bg) transparent;
-}
-div.messageBottomRightTooltip:after {
-  top: -14px;
-  right: 4px;
-  border-color: transparent transparent var(--tool-tip-bg) transparent;
-}
 
 div.messageActionActiveArea {
   position: absolute;
   display: flex;
   top: 0;
   bottom: 0;
   align-items: center;
   padding: 0 12px;
 }
 
 div.viewerMessageActionActiveArea {
   right: 100%;
 }
 div.nonViewerMessageActiveArea {
   left: 100%;
 }
 div.messageActionActiveArea > div + div {
   margin-left: 4px;
 }
 
 div.messageActionLinkIcon:hover {
   cursor: pointer;
 }
 
 div.textMessage {
   padding: 6px 12px;
   white-space: pre-wrap;
   word-wrap: break-word;
   width: 100%;
   box-sizing: border-box;
 }
 div.textMessageDefaultBackground {
   background-color: var(--text-message-default-background);
 }
 div.normalTextMessage {
   font-size: 16px;
 }
 div.emojiOnlyTextMessage {
   font-size: 32px;
   font-family: emoji;
 }
 span.authorName {
   color: #777777;
   font-size: 14px;
   padding: 4px 24px;
 }
 div.darkTextMessage {
   color: white;
 }
 div.lightTextMessage {
   color: black;
 }
 
 div.content {
   display: flex;
   flex-shrink: 0;
   align-items: center;
   margin-bottom: 5px;
   box-sizing: border-box;
   width: 100%;
 }
 div.nonViewerContent {
   align-self: flex-start;
   justify-content: flex-start;
   padding-right: 8px;
 }
 div.viewerContent {
   align-self: flex-end;
   justify-content: flex-end;
   padding-right: 4px;
 }
 div.iconContainer {
   margin-right: 1px;
 }
 div.iconContainer > svg {
   height: 16px;
 }
 
 div.messageBoxContainer {
   position: relative;
   display: flex;
   max-width: calc(min(68%, 1000px));
   margin: 0 4px 0 12px;
 }
 div.fixedWidthMessageBoxContainer {
   width: 68%;
 }
 
 div.messageBox {
   overflow: hidden;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   flex-shrink: 0;
   max-width: 100%;
 }
 div.fixedWidthMessageBox {
   width: 100%;
 }
 
 div.failedSend {
   text-transform: uppercase;
   display: flex;
   justify-content: flex-end;
   flex-shrink: 0;
   font-size: 14px;
   margin-right: 30px;
   padding-bottom: 6px;
 }
 span.deliveryFailed {
   padding: 0 3px;
   color: #555555;
 }
 a.retrySend {
   padding: 0 3px;
   cursor: pointer;
 }
 
 div.messageBox > div.imageGrid {
   display: grid;
   width: 100%;
   grid-template-columns: repeat(6, 1fr);
   grid-gap: 5px;
 }
 div.messageBox span.multimedia > span.multimediaImage {
   min-height: initial;
   min-width: initial;
 }
 div.messageBox span.multimedia > span.multimediaImage > img {
   max-height: 600px;
 }
 
 div.imageGrid > span.multimedia {
   grid-column-end: span 3;
 }
 div.imageGrid > span.multimedia:first-child {
   margin-top: 0;
 }
 div.imageGrid > span.multimedia > span.multimediaImage {
   flex: 1;
 }
 div.imageGrid > span.multimedia > span.multimediaImage:after {
   content: '';
   display: block;
   padding-bottom: calc(min(600px, 100%));
 }
 div.imageGrid > span.multimedia > span.multimediaImage > img {
   position: absolute;
   width: 100%;
   height: 100%;
   object-fit: cover;
 }
 
 div.imageGrid > span.multimedia:nth-last-child(n + 3):first-child,
 div.imageGrid > span.multimedia:nth-last-child(n + 3):first-child ~ * {
   grid-column-end: span 2;
 }
 div.imageGrid > span.multimedia:nth-last-child(n + 4):first-child,
 div.imageGrid > span.multimedia:nth-last-child(n + 4):first-child ~ * {
   grid-column-end: span 3;
 }
 div.imageGrid > span.multimedia:nth-last-child(n + 5):first-child,
 div.imageGrid > span.multimedia:nth-last-child(n + 5):first-child ~ * {
   grid-column-end: span 2;
 }
 div.sidebarMarginBottom {
   margin-bottom: 8px;
 }
 svg.inlineSidebarIcon {
   color: #666666;
 }
diff --git a/web/chat/message-timestamp-tooltip.react.js b/web/chat/message-timestamp-tooltip.react.js
deleted file mode 100644
index 0e35c7df5..000000000
--- a/web/chat/message-timestamp-tooltip.react.js
+++ /dev/null
@@ -1,146 +0,0 @@
-// @flow
-
-import invariant from 'invariant';
-import * as React from 'react';
-
-import { isComposableMessageType } from 'lib/types/message-types';
-import { longAbsoluteDate } from 'lib/utils/date-utils';
-
-import css from './chat-message-list.css';
-import type { OnMessagePositionWithContainerInfo } from './position-types';
-import {
-  type TooltipPosition,
-  tooltipPositions,
-  sizeOfTooltipArrow,
-} from './tooltip-utils';
-import {
-  TooltipMenu,
-  type TooltipStyle,
-  TooltipTextItem,
-} from './tooltip.react';
-
-const availablePositionsForComposedViewerMessage = [
-  tooltipPositions.BOTTOM_RIGHT,
-];
-const availablePositionsForNonComposedOrNonViewerMessage = [
-  tooltipPositions.LEFT,
-];
-
-type Props = {
-  +messagePositionInfo: OnMessagePositionWithContainerInfo,
-  +timeZone: ?string,
-};
-function MessageTimestampTooltip(props: Props): React.Node {
-  const { messagePositionInfo, timeZone } = props;
-  const { time, creator, type } = messagePositionInfo.item.messageInfo;
-
-  const text = React.useMemo(() => longAbsoluteDate(time, timeZone), [
-    time,
-    timeZone,
-  ]);
-  const availableTooltipPositions = React.useMemo(() => {
-    const { isViewer } = creator;
-    const isComposed = isComposableMessageType(type);
-    return isComposed && isViewer
-      ? availablePositionsForComposedViewerMessage
-      : availablePositionsForNonComposedOrNonViewerMessage;
-  }, [creator, type]);
-
-  const { messagePosition, containerPosition } = messagePositionInfo;
-  const pointingToInfo = React.useMemo(() => {
-    return {
-      containerPosition,
-      itemPosition: messagePosition,
-    };
-  }, [messagePosition, containerPosition]);
-
-  const getTooltipStyle = React.useCallback(
-    (tooltipPosition: TooltipPosition) =>
-      getTimestampTooltipStyle(messagePositionInfo, tooltipPosition),
-    [messagePositionInfo],
-  );
-  return (
-    <TooltipMenu
-      availableTooltipPositions={availableTooltipPositions}
-      targetPositionInfo={pointingToInfo}
-      layoutPosition="absolute"
-      getStyle={getTooltipStyle}
-    >
-      <TooltipTextItem text={text} />
-    </TooltipMenu>
-  );
-}
-
-function getTimestampTooltipStyle(
-  messagePositionInfo: OnMessagePositionWithContainerInfo,
-  tooltipPosition: TooltipPosition,
-): TooltipStyle {
-  const { messagePosition, containerPosition } = messagePositionInfo;
-  const { height: containerHeight, width: containerWidth } = containerPosition;
-
-  let style, className;
-  if (tooltipPosition === tooltipPositions.LEFT) {
-    const centerOfMessage = messagePosition.top + messagePosition.height / 2;
-    const tooltipPointing = Math.max(
-      Math.min(centerOfMessage, containerHeight),
-      0,
-    );
-    style = {
-      right: containerWidth - messagePosition.left + sizeOfTooltipArrow,
-      top: tooltipPointing,
-    };
-    className = css.messageLeftTooltip;
-  } else if (tooltipPosition === tooltipPositions.RIGHT) {
-    const centerOfMessage = messagePosition.top + messagePosition.height / 2;
-    const tooltipPointing = Math.max(
-      Math.min(centerOfMessage, containerHeight),
-      0,
-    );
-    style = {
-      left: messagePosition.right + sizeOfTooltipArrow,
-      top: tooltipPointing,
-    };
-    className = css.messageRightTooltip;
-  } else if (tooltipPosition === tooltipPositions.TOP_LEFT) {
-    const tooltipPointing = Math.min(
-      containerHeight - messagePosition.top,
-      containerHeight,
-    );
-    style = {
-      left: messagePosition.left,
-      bottom: tooltipPointing + sizeOfTooltipArrow,
-    };
-    className = css.messageTopLeftTooltip;
-  } else if (tooltipPosition === tooltipPositions.TOP_RIGHT) {
-    const tooltipPointing = Math.min(
-      containerHeight - messagePosition.top,
-      containerHeight,
-    );
-    style = {
-      right: containerWidth - messagePosition.right,
-      bottom: tooltipPointing + sizeOfTooltipArrow,
-    };
-    className = css.messageTopRightTooltip;
-  } else if (tooltipPosition === tooltipPositions.BOTTOM_LEFT) {
-    const tooltipPointing = Math.min(messagePosition.bottom, containerHeight);
-    style = {
-      left: messagePosition.left,
-      top: tooltipPointing + sizeOfTooltipArrow,
-    };
-    className = css.messageBottomLeftTooltip;
-  } else if (tooltipPosition === tooltipPositions.BOTTOM_RIGHT) {
-    const tooltipPointing = Math.min(messagePosition.bottom, containerHeight);
-    style = {
-      right: containerWidth - messagePosition.right,
-      top: tooltipPointing + sizeOfTooltipArrow,
-    };
-    className = css.messageBottomRightTooltip;
-  }
-  invariant(
-    className && style,
-    `${tooltipPosition} is not valid for timestamp tooltip`,
-  );
-  return { className, style };
-}
-
-export default MessageTimestampTooltip;