diff --git a/lib/design-system/src/blocks/Bubble/Bubble.tsx b/lib/design-system/src/blocks/Bubble/Bubble.tsx
index dc78951a6a..51e87c31a0 100644
--- a/lib/design-system/src/blocks/Bubble/Bubble.tsx
+++ b/lib/design-system/src/blocks/Bubble/Bubble.tsx
@@ -211,9 +211,9 @@ export const Bubble = ({
       >
         {!isOur && !isPrevGrouped && (
           <BubbleAuthor
+            id={id}
             style={{
               color: authorColorDisplay,
-              pointerEvents: 'none',
             }}
             authorColor={authorColor}
           >
@@ -222,24 +222,18 @@ export const Bubble = ({
         )}
         {forwardedFrom && (
           <Text.Custom
+            id={id}
             style={{
               color: 'rgba(var(--rlm-icon-rgba), 0.60)',
               fontSize: 11,
-              pointerEvents: 'none',
             }}
           >
             Forwarded from: {forwardedFrom}
           </Text.Custom>
         )}
-        <FragmentBlock style={{ pointerEvents: 'none' }}>
-          {fragments}
-        </FragmentBlock>
-        <BubbleFooter
-          height={footerHeight}
-          mt={1}
-          style={{ pointerEvents: 'none' }}
-        >
-          <Flex height="100%" flex={7} style={{ pointerEvents: 'auto' }}>
+        <FragmentBlock id={id}>{fragments}</FragmentBlock>
+        <BubbleFooter height={footerHeight} mt={1}>
+          <Flex height="100%" flex={7}>
             {((reactions && reactions.length > 0) || onReaction) && (
               <Reactions
                 isOur={isOur}
@@ -251,17 +245,21 @@ export const Bubble = ({
             )}
           </Flex>
           <Flex
+            id={id}
             flex={3}
             gap={4}
             alignItems="flex-end"
             justifyContent="flex-end"
             minWidth={minBubbleWidth}
             flexBasis={minBubbleWidth}
-            style={{ pointerEvents: 'none' }}
           >
             {error && (
               <Text.Custom
-                style={{ whiteSpace: 'nowrap', userSelect: 'none' }}
+                style={{
+                  whiteSpace: 'nowrap',
+                  userSelect: 'none',
+                  pointerEvents: 'none',
+                }}
                 textAlign="right"
                 display="inline-flex"
                 alignItems="flex-end"
@@ -286,7 +284,6 @@ export const Bubble = ({
               style={{
                 whiteSpace: 'nowrap',
                 userSelect: 'none',
-                pointerEvents: 'none',
               }}
               textAlign="right"
               display="inline-flex"
diff --git a/lib/design-system/src/blocks/Bubble/renderFragment.tsx b/lib/design-system/src/blocks/Bubble/renderFragment.tsx
index 37654ff3c1..cb788b41b4 100644
--- a/lib/design-system/src/blocks/Bubble/renderFragment.tsx
+++ b/lib/design-system/src/blocks/Bubble/renderFragment.tsx
@@ -151,7 +151,7 @@ export const renderFragment = (
       if (linkType === 'media') {
         return (
           <MediaBlock
-            id={`media-${link}`}
+            id={id}
             mode="embed"
             variant="content"
             width={320}