Render @mentions for group story replies

ts/components/StoryViewsNRepliesModal.tsx

@@ -353,6 +353,7 @@ export const StoryViewsNRepliesModal = ({
               <Message
                 {...MESSAGE_DEFAULT_PROPS}
                 author={reply.author}
+                bodyRanges={reply.bodyRanges}
                 contactNameColor={reply.contactNameColor}
                 containerElementRef={containerElementRef}
                 conversationColor="ultramarine"

ts/state/selectors/stories.ts

@@ -299,7 +299,13 @@ export const getStoryReplies = createSelector(
 
       return {
         author: getAvatarData(conversation),
-        ...pick(reply, ['body', 'deletedForEveryone', 'id', 'timestamp']),
+        ...pick(reply, [
+          'body',
+          'bodyRanges',
+          'deletedForEveryone',
+          'id',
+          'timestamp',
+        ]),
         contactNameColor: contactNameColorSelector(
           reply.conversationId,
           conversation.id

ts/types/Stories.ts

@@ -2,9 +2,9 @@
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import type { AttachmentType } from './Attachment';
+import type { BodyRangesType, LocalizerType } from './Util';
 import type { ContactNameColorType } from './Colors';
 import type { ConversationType } from '../state/ducks/conversations';
-import type { LocalizerType } from './Util';
 import type { ReadStatus } from '../messages/MessageReadStatus';
 import type { SendStatus } from '../messages/MessageSendState';
 import type { StoryDistributionListDataType } from '../state/ducks/storyDistributionLists';
@@ -27,6 +27,7 @@ export type ReplyType = {
     | 'title'
   >;
   body?: string;
+  bodyRanges?: BodyRangesType;
   contactNameColor?: ContactNameColorType;
   conversationId: string;
   deletedForEveryone?: boolean;