diff --git a/native/chat/inline-engagement.react.js b/native/chat/inline-engagement.react.js
--- a/native/chat/inline-engagement.react.js
+++ b/native/chat/inline-engagement.react.js
@@ -83,6 +83,28 @@
 
   const repliesText = useInlineEngagementText(sidebarInfo);
 
+  const sidebarStyle = React.useMemo(() => {
+    const style = [styles.sidebar];
+
+    if (!reactions || Object.keys(reactions).length === 0) {
+      return style;
+    }
+
+    if (isRight) {
+      style.push(styles.sidebarMarginLeft);
+    } else {
+      style.push(styles.sidebarMarginRight);
+    }
+
+    return style;
+  }, [
+    isRight,
+    reactions,
+    styles.sidebar,
+    styles.sidebarMarginLeft,
+    styles.sidebarMarginRight,
+  ]);
+
   const sidebarItem = React.useMemo(() => {
     if (!sidebarInfo) {
       return null;
@@ -91,7 +113,7 @@
       <GestureTouchableOpacity
         onPress={onPressSidebar}
         activeOpacity={0.7}
-        style={styles.sidebar}
+        style={sidebarStyle}
       >
         <CommIcon style={styles.icon} size={14} name="sidebar-filled" />
         <Text style={repliesStyles}>{repliesText}</Text>
@@ -100,7 +122,7 @@
   }, [
     sidebarInfo,
     onPressSidebar,
-    styles.sidebar,
+    sidebarStyle,
     styles.icon,
     repliesStyles,
     repliesText,
@@ -113,6 +135,23 @@
     });
   }, [navigate, reactions]);
 
+  const reactionStyle = React.useMemo(() => {
+    const style = [styles.reactionsContainer];
+
+    if (isRight) {
+      style.push(styles.reactionsContainerMarginLeft);
+    } else {
+      style.push(styles.reactionsContainerMarginRight);
+    }
+
+    return style;
+  }, [
+    isRight,
+    styles.reactionsContainer,
+    styles.reactionsContainerMarginLeft,
+    styles.reactionsContainerMarginRight,
+  ]);
+
   const reactionList = React.useMemo(() => {
     if (!reactions || Object.keys(reactions).length === 0) {
       return null;
@@ -122,7 +161,7 @@
       const numOfReacts = reactions[reaction].users.length;
       return (
         <GestureTouchableOpacity
-          style={styles.reactionsContainer}
+          style={reactionStyle}
           onPress={onPressReactions}
           activeOpacity={0.7}
           key={reaction}
@@ -131,7 +170,7 @@
         </GestureTouchableOpacity>
       );
     });
-  }, [onPressReactions, reactions, styles.reaction, styles.reactionsContainer]);
+  }, [onPressReactions, reactionStyle, reactions, styles.reaction]);
 
   const inlineEngagementPositionStyle = React.useMemo(() => {
     const styleResult = [styles.inlineEngagement];
@@ -182,6 +221,12 @@
     borderRadius: 8,
     marginTop: inlineEngagementStyle.marginTop,
   },
+  sidebarMarginLeft: {
+    marginLeft: 4,
+  },
+  sidebarMarginRight: {
+    marginRight: 4,
+  },
   icon: {
     color: 'inlineEngagementLabel',
     marginRight: 4,
@@ -205,6 +250,12 @@
     borderRadius: 8,
     marginTop: inlineEngagementStyle.marginTop,
   },
+  reactionsContainerMarginLeft: {
+    marginLeft: 4,
+  },
+  reactionsContainerMarginRight: {
+    marginRight: 4,
+  },
   reaction: {
     color: 'inlineEngagementLabel',
     fontSize: 14,