diff --git a/web/chat/tooltip-utils.js b/web/chat/tooltip-utils.js
--- a/web/chat/tooltip-utils.js
+++ b/web/chat/tooltip-utils.js
@@ -1,5 +1,6 @@
 // @flow
 
+import invariant from 'invariant';
 import * as React from 'react';
 
 import { calculateMaxTextWidth } from '../utils/text-utils';
@@ -178,6 +179,99 @@
   }
   return null;
 }
+
+type GetMessageActionTooltipStyleParams = {
+  +sourcePositionInfo: PositionInfo,
+  +tooltipSize: TooltipSize,
+  +tooltipPosition: TooltipPosition,
+};
+
+function getMessageActionTooltipStyle({
+  sourcePositionInfo,
+  tooltipSize,
+  tooltipPosition,
+}: GetMessageActionTooltipStyleParams): TooltipPositionStyle {
+  switch (tooltipPosition) {
+    case tooltipPositions.RIGHT_TOP:
+      return {
+        xCoord: sourcePositionInfo.right,
+        yCoord: sourcePositionInfo.top,
+        horizontalPosition: 'right',
+        verticalPosition: 'bottom',
+        alignment: 'left',
+      };
+    case tooltipPositions.LEFT_TOP:
+      return {
+        xCoord: sourcePositionInfo.left,
+        yCoord: sourcePositionInfo.top,
+        horizontalPosition: 'left',
+        verticalPosition: 'bottom',
+        alignment: 'right',
+      };
+    case tooltipPositions.RIGHT_BOTTOM:
+      return {
+        xCoord: sourcePositionInfo.right,
+        yCoord: sourcePositionInfo.bottom,
+        horizontalPosition: 'right',
+        verticalPosition: 'top',
+        alignment: 'left',
+      };
+    case tooltipPositions.LEFT_BOTTOM:
+      return {
+        xCoord: sourcePositionInfo.left,
+        yCoord: sourcePositionInfo.bottom,
+        horizontalPosition: 'left',
+        verticalPosition: 'top',
+        alignment: 'right',
+      };
+    case tooltipPositions.LEFT:
+      return {
+        xCoord: sourcePositionInfo.left,
+        yCoord:
+          sourcePositionInfo.top +
+          sourcePositionInfo.height / 2 -
+          tooltipSize.height / 2,
+        horizontalPosition: 'left',
+        verticalPosition: 'bottom',
+        alignment: 'right',
+      };
+    case tooltipPositions.RIGHT:
+      return {
+        xCoord: sourcePositionInfo.right,
+        yCoord:
+          sourcePositionInfo.top +
+          sourcePositionInfo.height / 2 -
+          tooltipSize.height / 2,
+        horizontalPosition: 'right',
+        verticalPosition: 'bottom',
+        alignment: 'left',
+      };
+    case tooltipPositions.TOP:
+      return {
+        xCoord:
+          sourcePositionInfo.left +
+          sourcePositionInfo.width / 2 -
+          tooltipSize.width / 2,
+        yCoord: sourcePositionInfo.top,
+        horizontalPosition: 'right',
+        verticalPosition: 'top',
+        alignment: 'center',
+      };
+    case tooltipPositions.BOTTOM:
+      return {
+        xCoord:
+          sourcePositionInfo.left +
+          sourcePositionInfo.width / 2 -
+          tooltipSize.width / 2,
+        yCoord: sourcePositionInfo.bottom,
+        horizontalPosition: 'right',
+        verticalPosition: 'bottom',
+        alignment: 'center',
+      };
+  }
+  invariant(false, 'Unexpected tooltip position value');
+}
+
 type CalculateTooltipSizeArgs = {
   +tooltipLabels: $ReadOnlyArray<string>,
   +timestamp: string,
@@ -204,4 +298,9 @@
   };
 }
 
-export { findTooltipPosition, calculateTooltipSize, sizeOfTooltipArrow };
+export {
+  findTooltipPosition,
+  calculateTooltipSize,
+  getMessageActionTooltipStyle,
+  sizeOfTooltipArrow,
+};