From 0d528bd9ae665891ceed92803be5b0d2046f916c Mon Sep 17 00:00:00 2001 From: Sumukha Hegde Date: Fri, 27 Aug 2021 19:37:16 +0530 Subject: [PATCH 1/8] [FIX] Show thumbnails in message view (#2975) * [FIX] Show thumbnails in message view fixes: #2853 * Add stories for thumbnails and update test * [Test] Update tests * added stories Co-authored-by: Reinaldo Neto Co-authored-by: Levy Costa Co-authored-by: Diego Mello --- .../__snapshots__/Storyshots.test.js.snap | 446 ++++++++++++++++++ app/containers/message/Reply.js | 33 +- storybook/stories/Message.js | 13 + 3 files changed, 489 insertions(+), 3 deletions(-) diff --git a/__tests__/__snapshots__/Storyshots.test.js.snap b/__tests__/__snapshots__/Storyshots.test.js.snap index 84457cec0..6f0df6b98 100644 --- a/__tests__/__snapshots__/Storyshots.test.js.snap +++ b/__tests__/__snapshots__/Storyshots.test.js.snap @@ -20361,6 +20361,15 @@ exports[`Storyshots Message Colored attachments 1`] = ` } } > + + + `; +exports[`Storyshots Message Thumbnail from server 1`] = ` + + + + + + + + + + + + + + + + + + diego.mello + + + + 10:00 AM + + + + + + this is a thumbnail + + + + + + + + Joker + + + + + + + + Some crazy texts + + + + + + + + + + + +`; + exports[`Storyshots Message Time format 1`] = ` + + { - if (!attachment.author_name) { - return null; - } const time = attachment.message_link && attachment.ts ? moment(attachment.ts).format(timeFormat) : null; return ( {attachment.author_name ? {attachment.author_name} : null} + {attachment.title ? {attachment.title} : null} {time ? { time } : null} ); @@ -112,6 +125,15 @@ const Description = React.memo(({ return true; }); +const UrlImage = React.memo(({ image }) => { + if (!image) { + return null; + } + const { baseUrl, user } = useContext(MessageContext); + image = image.includes('http') ? image : `${ baseUrl }/${ image }?rc_uid=${ user.id }&rc_token=${ user.token }`; + return ; +}, (prevProps, nextProps) => prevProps.image === nextProps.image); + const Fields = React.memo(({ attachment, theme, getCustomEmoji }) => { if (!attachment.fields) { return null; @@ -191,6 +213,7 @@ const Reply = React.memo(({ timeFormat={timeFormat} theme={theme} /> + ( stories.add('Custom style', () => ( )); + +stories.add('Thumbnail from server', () => ( + +)); + From 9bfe0e99124d054af4b1fe3505fc91c65e4e3d15 Mon Sep 17 00:00:00 2001 From: Sumukha Hegde Date: Fri, 27 Aug 2021 21:59:34 +0530 Subject: [PATCH 2/8] [FIX] Show button attachment on messages (#2980) * [FIX] Show button attachment in message list fixes: #2684 * Changed the Button and theme, text theme and how to call the function * Fix the props passed in Message * Function to context * Added button attachment to stories * New snapshot Co-authored-by: Reinaldo Neto <47038980+reinaldonetof@users.noreply.github.com> Co-authored-by: Reinaldo Neto Co-authored-by: Levy Costa Co-authored-by: Diego Mello --- .../__snapshots__/Storyshots.test.js.snap | 268 +++++++++++++++++- app/containers/message/Attachments.js | 36 ++- app/containers/message/index.js | 10 + app/views/RoomView/index.js | 1 + storybook/stories/Message.js | 28 +- 5 files changed, 333 insertions(+), 10 deletions(-) diff --git a/__tests__/__snapshots__/Storyshots.test.js.snap b/__tests__/__snapshots__/Storyshots.test.js.snap index 6f0df6b98..181619f41 100644 --- a/__tests__/__snapshots__/Storyshots.test.js.snap +++ b/__tests__/__snapshots__/Storyshots.test.js.snap @@ -40334,6 +40334,268 @@ exports[`Storyshots Message Sequential thread messages following thread reply 1` `; +exports[`Storyshots Message Show a button as attachment 1`] = ` + + + + + + + + + + + + + + + + + + diego.mello + + + + 10:00 AM + + + + + Test Button + + + + Text button + + + + + + + + + +`; + exports[`Storyshots Message Static avatar 1`] = ` - Joker + Title - Some crazy texts + Image text diff --git a/app/containers/message/Attachments.js b/app/containers/message/Attachments.js index 0d068e9fd..0600e6d69 100644 --- a/app/containers/message/Attachments.js +++ b/app/containers/message/Attachments.js @@ -1,11 +1,35 @@ -import React from 'react'; +import React, { useContext } from 'react'; import { dequal } from 'dequal'; import PropTypes from 'prop-types'; +import { Text } from 'react-native'; import Image from './Image'; import Audio from './Audio'; import Video from './Video'; import Reply from './Reply'; +import Button from '../Button'; +import styles from './styles'; +import MessageContext from './Context'; + +const AttachedActions = ({ + attachment, theme +}) => { + const { onAnswerButtonPress } = useContext(MessageContext); + + const attachedButtons = attachment.actions.map((element) => { + if (element.type === 'button') { + return