From d6ed1055ee8f804f6f7a2dc570f1770b6429dd40 Mon Sep 17 00:00:00 2001
From: Diego Mello <diegolmello@gmail.com>
Date: Fri, 3 May 2019 10:29:56 -0300
Subject: [PATCH] [FIX] Load local URL image (#871)
---
app/containers/message/Message.js | 4 +--
app/containers/message/Url.js | 50 ++++++++++++++++++++++++-------
2 files changed, 41 insertions(+), 13 deletions(-)
diff --git a/app/containers/message/Message.js b/app/containers/message/Message.js
index d5c1a9fc5..e8132bdc5 100644
--- a/app/containers/message/Message.js
+++ b/app/containers/message/Message.js
@@ -320,13 +320,13 @@ export default class Message extends PureComponent {
}
renderUrl = () => {
- const { urls } = this.props;
+ const { urls, user, baseUrl } = this.props;
if (urls.length === 0) {
return null;
}
return urls.map((url, index) => (
- <Url url={url} key={url.url} index={index} />
+ <Url url={url} key={url.url} index={index} user={user} baseUrl={baseUrl} />
));
}
diff --git a/app/containers/message/Url.js b/app/containers/message/Url.js
index 36ae44c19..e0ae7d4ec 100644
--- a/app/containers/message/Url.js
+++ b/app/containers/message/Url.js
@@ -3,6 +3,7 @@ import { View, Text, StyleSheet } from 'react-native';
import PropTypes from 'prop-types';
import FastImage from 'react-native-fast-image';
import Touchable from 'react-native-platform-touchable';
+import isEqual from 'lodash/isEqual';
import openLink from '../../utils/openLink';
import sharedStyles from '../../views/Styles';
@@ -50,33 +51,60 @@ const styles = StyleSheet.create({
}
});
-const onPress = (url) => {
- openLink(url);
-};
-const Url = ({ url, index }) => {
+const UrlImage = React.memo(({ image, user, baseUrl }) => {
+ if (!image) {
+ return null;
+ }
+ image = image.includes('http') ? image : `${ baseUrl }/${ image }?rc_uid=${ user.id }&rc_token=${ user.token }`;
+ return <FastImage source={{ uri: image }} style={styles.image} resizeMode={FastImage.resizeMode.cover} />;
+});
+
+const UrlContent = React.memo(({ title, description }) => (
+ <View style={styles.textContainer}>
+ {title ? <Text style={styles.title} numberOfLines={2}>{title}</Text> : null}
+ {description ? <Text style={styles.description} numberOfLines={2}>{description}</Text> : null}
+ </View>
+));
+
+const Url = React.memo(({
+ url, index, user, baseUrl
+}) => {
if (!url) {
return null;
}
+
+ const onPress = () => openLink(url.url);
+
return (
<Touchable
- onPress={() => onPress(url.url)}
+ onPress={onPress}
style={[styles.button, index > 0 && styles.marginTop, styles.container]}
background={Touchable.Ripple('#fff')}
>
<React.Fragment>
- {url.image ? <FastImage source={{ uri: url.image }} style={styles.image} resizeMode={FastImage.resizeMode.cover} /> : null}
- <View style={styles.textContainer}>
- <Text style={styles.title} numberOfLines={2}>{url.title}</Text>
- <Text style={styles.description} numberOfLines={2}>{url.description}</Text>
- </View>
+ <UrlImage image={url.image} user={user} baseUrl={baseUrl} />
+ <UrlContent title={url.title} description={url.description} />
</React.Fragment>
</Touchable>
);
+}, (oldProps, newProps) => isEqual(oldProps.url, newProps.url));
+
+UrlImage.propTypes = {
+ image: PropTypes.string,
+ user: PropTypes.object,
+ baseUrl: PropTypes.string
+};
+
+UrlContent.propTypes = {
+ title: PropTypes.string,
+ description: PropTypes.string
};
Url.propTypes = {
url: PropTypes.object.isRequired,
- index: PropTypes.number
+ index: PropTypes.number,
+ user: PropTypes.object,
+ baseUrl: PropTypes.string
};
export default Url;
--
GitLab