fix: render the text from custom attachment as markdown (#5048)

* fix: render the text from custom attachment as markdown

* add special character, one number and one capital letter at password e2e

* minor tweak

---------

Co-authored-by: GleidsonDaniel <gleidson10daniel@hotmail.com>

app/containers/message/Attachments.tsx

@@ -1,6 +1,5 @@
 import React, { useContext } from 'react';
 import { dequal } from 'dequal';
-import { Text } from 'react-native';
 
 import { IMessageAttachments } from './interfaces';
 import Image from './Image';
@@ -8,13 +7,12 @@ import Audio from './Audio';
 import Video from './Video';
 import Reply from './Reply';
 import Button from '../Button';
-import styles from './styles';
 import MessageContext from './Context';
 import { useTheme } from '../../theme';
-import { IAttachment } from '../../definitions';
+import { IAttachment, TGetCustomEmoji } from '../../definitions';
 import CollapsibleQuote from './Components/CollapsibleQuote';
 import openLink from '../../lib/methods/helpers/openLink';
-import { themes } from '../../lib/constants';
+import Markdown from '../markdown';
 
 export type TElement = {
 	type: string;
@@ -23,9 +21,8 @@ export type TElement = {
 	text: string;
 };
 
-const AttachedActions = ({ attachment }: { attachment: IAttachment }) => {
+const AttachedActions = ({ attachment, getCustomEmoji }: { attachment: IAttachment; getCustomEmoji: TGetCustomEmoji }) => {
 	const { onAnswerButtonPress } = useContext(MessageContext);
-	const { theme } = useTheme();
 
 	if (!attachment.actions) {
 		return null;
@@ -50,7 +47,7 @@ const AttachedActions = ({ attachment }: { attachment: IAttachment }) => {
 	});
 	return (
 		<>
-			<Text style={[styles.text, { color: themes[theme].bodyText }]}>{attachment.text}</Text>
+			<Markdown msg={attachment.text} getCustomEmoji={getCustomEmoji} />
 			{attachedButtons}
 		</>
 	);
@@ -106,7 +103,7 @@ const Attachments: React.FC<IMessageAttachments> = React.memo(
 			}
 
 			if (file && file.actions && file.actions.length > 0) {
-				return <AttachedActions attachment={file} />;
+				return <AttachedActions attachment={file} getCustomEmoji={getCustomEmoji} />;
 			}
 			if (typeof file.collapsed === 'boolean') {
 				return (

app/containers/message/Message.stories.tsx

@@ -875,6 +875,7 @@ export const Ignored = () => <Message isIgnored />;
 export const CustomStyle = () => <Message msg='Message' style={[{ backgroundColor: '#ddd' }]} />;
 
 export const ShowButtonAsAttachment = () => (
+	<>
 		<Message
 			attachments={[
 				{
@@ -890,6 +891,22 @@ export const ShowButtonAsAttachment = () => (
 				}
 			]}
 		/>
+		<Message
+			attachments={[
+				{
+					text: ':avocado: **Message with markdown**\n\n_Some text_\n\nThis is a test',
+					actions: [
+						{
+							type: 'button',
+							text: 'Text button',
+							msg: 'Response message',
+							msg_in_chat_window: true
+						}
+					]
+				}
+			]}
+		/>
+	</>
 );
 
 export const ThumbnailFromServer = () => (