fix: timer alignment for data extraction notifications

ts/components/conversation/message/message-item/DataExtractionNotification.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import styled from 'styled-components';
 import { PropsForDataExtractionNotification } from '../../../../models/messageType';
 import { SignalService } from '../../../../protobuf';
 import { Flex } from '../../../basic/Flex';
@@ -6,6 +7,10 @@ import { SpacerSM, Text } from '../../../basic/Text';
 import { SessionIcon } from '../../../icon';
 import { ExpirableReadableMessage } from './ExpirableReadableMessage';
 
+const StyledDataExtractionNotificationContainer = styled.div`
+  padding: 0 var(--margins-lg) 0;
+`;
+
 export const DataExtractionNotification = (props: PropsForDataExtractionNotification) => {
   const { name, type, source, messageId } = props;
 
@@ -17,7 +22,12 @@ export const DataExtractionNotification = (props: PropsForDataExtractionNotifica
   }
 
   return (
-    <ExpirableReadableMessage messageId={messageId} key={`readable-message-${messageId}`}>
+    <StyledDataExtractionNotificationContainer>
+      <ExpirableReadableMessage
+        messageId={messageId}
+        key={`readable-message-${messageId}`}
+        isCentered
+      >
         <Flex
           container={true}
           flexDirection="column"
@@ -35,5 +45,6 @@ export const DataExtractionNotification = (props: PropsForDataExtractionNotifica
           <Text text={contentText} ellipsisOverflow={true} />
         </Flex>
       </ExpirableReadableMessage>
+    </StyledDataExtractionNotificationContainer>
   );
 };