rn-erxes-sdk 0.1.8 → 0.1.10

package/lib/module/screen/conversation/ConversationDetail.js

@@ -0,0 +1,279 @@
+/* eslint-disable react-native/no-inline-styles */
+import { View, Text, ActivityIndicator, TouchableOpacity, StyleSheet, FlatList, KeyboardAvoidingView, Platform, TouchableWithoutFeedback, Keyboard, Image } from 'react-native';
+import React, { useEffect } from 'react';
+import { useMutation, useQuery, useSubscription } from '@apollo/client';
+import { widgetsConversationDetail } from '../../graphql/query';
+import MaterialCommunityIcons from '../../icons/MaterialCommunityIcons';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import Message from './Message';
+import InputTools from '../../components/InputTools';
+import { widgetsInsertMessage } from '../../graphql/mutation';
+import { conversationMessageInserted } from '../../graphql/subscription';
+import { getAttachmentUrl } from '../../utils/utils';
+import { getLocalStorageItem, setLocalStorageItem } from '../../utils/common';
+const ConversationDetail = props => {
+  var _data$widgetsConversa5;
+  const {
+    route,
+    navigation
+  } = props;
+  const {
+    _id,
+    integrationId,
+    bgColor,
+    brand,
+    customerId,
+    visitorId
+  } = route.params;
+  const [messages, setMessages] = React.useState([]);
+  const {
+    data,
+    loading
+  } = useQuery(widgetsConversationDetail, {
+    variables: {
+      _id,
+      integrationId
+    },
+    fetchPolicy: 'network-only',
+    skip: !_id
+  });
+  const {
+    data: subscriptionData
+  } = useSubscription(conversationMessageInserted, {
+    variables: {
+      _id
+    },
+    fetchPolicy: 'network-only',
+    skip: !_id
+  });
+  useEffect(() => {
+    let shouldAdd = subscriptionData && data;
+    if ((data === null || data === void 0 ? void 0 : data.length) > 0) {
+      var _subscriptionData$con;
+      shouldAdd = (subscriptionData === null || subscriptionData === void 0 ? void 0 : (_subscriptionData$con = subscriptionData.conversationMessageInserted) === null || _subscriptionData$con === void 0 ? void 0 : _subscriptionData$con._id) !== data[0]._id;
+    }
+    if (shouldAdd) {
+      setMessages(prev => [subscriptionData === null || subscriptionData === void 0 ? void 0 : subscriptionData.conversationMessageInserted, ...prev]);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [subscriptionData]);
+  useEffect(() => {
+    var _data$widgetsConversa;
+    if (data !== null && data !== void 0 && (_data$widgetsConversa = data.widgetsConversationDetail) !== null && _data$widgetsConversa !== void 0 && _data$widgetsConversa.messages) {
+      var _data$widgetsConversa2, _data$widgetsConversa3, _data$widgetsConversa4;
+      let reversed = data === null || data === void 0 ? void 0 : (_data$widgetsConversa2 = data.widgetsConversationDetail) === null || _data$widgetsConversa2 === void 0 ? void 0 : (_data$widgetsConversa3 = _data$widgetsConversa2.messages) === null || _data$widgetsConversa3 === void 0 ? void 0 : (_data$widgetsConversa4 = _data$widgetsConversa3.slice()) === null || _data$widgetsConversa4 === void 0 ? void 0 : _data$widgetsConversa4.reverse();
+      setMessages(reversed);
+    }
+  }, [data]);
+  const [sendMutation] = useMutation(widgetsInsertMessage);
+  const onSend = text => {
+    sendMutation({
+      variables: {
+        integrationId,
+        customerId,
+        visitorId,
+        conversationId: _id,
+        contentType: 'text',
+        message: text
+      }
+    }).then(res => {
+      if (res.errors) {
+        return console.log(res.errors);
+      }
+      if (res.data.widgetsInsertMessage) {
+        const cachedCustomerId = getLocalStorageItem('customerId');
+        if (!cachedCustomerId) {
+          const tempCustomerId = res.data.widgetsInsertMessage.customerId;
+          setLocalStorageItem('customerId', tempCustomerId);
+        }
+        let shouldAdd = (messages === null || messages === void 0 ? void 0 : messages.length) === 0;
+        if (!shouldAdd) {
+          shouldAdd = res.data.widgetsInsertMessage._id !== data[0]._id;
+        }
+        if (shouldAdd) {
+          const newArray = [res.data.widgetsInsertMessage, ...data];
+          setMessages(newArray);
+        }
+      }
+    }).catch(err => {
+      console.log(err);
+    });
+  };
+  if (loading) {
+    return /*#__PURE__*/React.createElement(View, {
+      style: {
+        flex: 1,
+        alignItems: 'center',
+        justifyContent: 'center'
+      }
+    }, /*#__PURE__*/React.createElement(ActivityIndicator, {
+      color: '#686868',
+      size: 'large'
+    }));
+  }
+  const renderItem = _ref => {
+    let {
+      item
+    } = _ref;
+    return /*#__PURE__*/React.createElement(Message, {
+      item: item,
+      bgColor: bgColor
+    });
+  };
+  const renderContent = () => {
+    return /*#__PURE__*/React.createElement(View, {
+      style: {
+        flex: 1
+      }
+    }, /*#__PURE__*/React.createElement(FlatList, {
+      contentContainerStyle: styles.contentStyle,
+      showsVerticalScrollIndicator: false,
+      data: messages,
+      keyExtractor: item => item._id,
+      onEndReachedThreshold: 0.2,
+      renderItem: renderItem,
+      ItemSeparatorComponent: () => null,
+      inverted: true
+    }));
+  };
+  return /*#__PURE__*/React.createElement(View, {
+    style: {
+      flex: 1
+    }
+  }, /*#__PURE__*/React.createElement(Header, {
+    navigation: navigation,
+    brand: brand,
+    bgColor: bgColor,
+    users: data === null || data === void 0 ? void 0 : (_data$widgetsConversa5 = data.widgetsConversationDetail) === null || _data$widgetsConversa5 === void 0 ? void 0 : _data$widgetsConversa5.participatedUsers
+  }), /*#__PURE__*/React.createElement(View, {
+    style: {
+      backgroundColor: 'rgba(215,215,215,.7)',
+      flex: 1
+    }
+  }, renderContent(), /*#__PURE__*/React.createElement(KeyboardAvoidingView, {
+    behavior: Platform.OS === 'ios' ? 'padding' : undefined,
+    keyboardVerticalOffset: 100
+  }, /*#__PURE__*/React.createElement(TouchableWithoutFeedback, {
+    onPress: () => Keyboard.dismiss()
+  }, /*#__PURE__*/React.createElement(InputTools, {
+    onSend: onSend,
+    bgColor: bgColor
+  })))));
+};
+export default ConversationDetail;
+const Header = props => {
+  const {
+    navigation,
+    brand,
+    bgColor,
+    users
+  } = props;
+  const insets = useSafeAreaInsets();
+  if ((users === null || users === void 0 ? void 0 : users.length) > 0) {
+    var _users$, _users$$details, _users$2, _users$2$details, _users$3, _users$3$details;
+    const url = getAttachmentUrl((_users$ = users[0]) === null || _users$ === void 0 ? void 0 : (_users$$details = _users$.details) === null || _users$$details === void 0 ? void 0 : _users$$details.avatar);
+    return /*#__PURE__*/React.createElement(View, {
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        paddingBottom: 20,
+        backgroundColor: bgColor || 'green',
+        paddingTop: insets.top
+      }
+    }, /*#__PURE__*/React.createElement(TouchableOpacity, {
+      onPress: () => {
+        navigation.goBack();
+      },
+      style: [styles.backStyle, {
+        backgroundColor: '#2F1F69'
+      }]
+    }, /*#__PURE__*/React.createElement(MaterialCommunityIcons, {
+      allowFontScaling: false,
+      name: 'chevron-left',
+      size: 24,
+      color: 'white',
+      direction: "ltr"
+    })), /*#__PURE__*/React.createElement(View, {
+      style: [styles.title, {
+        marginLeft: 10,
+        alignItems: 'center',
+        flex: 1
+      }]
+    }, /*#__PURE__*/React.createElement(Image, {
+      source: {
+        uri: url,
+        cache: 'force-cache'
+      },
+      style: styles.avatar,
+      resizeMode: "stretch"
+    }), /*#__PURE__*/React.createElement(View, {
+      style: {
+        marginLeft: 10
+      }
+    }, /*#__PURE__*/React.createElement(Text, {
+      style: {
+        fontWeight: '600'
+      }
+    }, (_users$2 = users[0]) === null || _users$2 === void 0 ? void 0 : (_users$2$details = _users$2.details) === null || _users$2$details === void 0 ? void 0 : _users$2$details.fullName), /*#__PURE__*/React.createElement(Text, {
+      style: {
+        color: '#686868'
+      }
+    }, (_users$3 = users[0]) === null || _users$3 === void 0 ? void 0 : (_users$3$details = _users$3.details) === null || _users$3$details === void 0 ? void 0 : _users$3$details.position))));
+  }
+  return /*#__PURE__*/React.createElement(View, {
+    style: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      paddingBottom: 20,
+      backgroundColor: bgColor || 'green',
+      paddingTop: insets.top
+    }
+  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
+    onPress: () => {
+      navigation.goBack();
+    },
+    style: [styles.backStyle, {
+      backgroundColor: '#2F1F69'
+    }]
+  }, /*#__PURE__*/React.createElement(MaterialCommunityIcons, {
+    allowFontScaling: false,
+    name: 'chevron-left',
+    size: 24,
+    color: 'white',
+    direction: "ltr"
+  })), /*#__PURE__*/React.createElement(View, {
+    style: [styles.title]
+  }, /*#__PURE__*/React.createElement(Text, {
+    style: {
+      fontWeight: '600',
+      fontSize: 16
+    }
+  }, brand === null || brand === void 0 ? void 0 : brand.name)));
+};
+const styles = StyleSheet.create({
+  backStyle: {
+    width: 40,
+    height: 40,
+    marginLeft: 15,
+    borderRadius: 90,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  title: {
+    paddingVertical: 10,
+    paddingHorizontal: 15,
+    borderTopLeftRadius: 8,
+    borderTopRightRadius: 8,
+    flexDirection: 'row'
+  },
+  contentStyle: {
+    flexGrow: 1,
+    padding: 20
+  },
+  avatar: {
+    width: 40,
+    height: 40,
+    borderRadius: 90
+  }
+});
+//# sourceMappingURL=ConversationDetail.js.map

package/lib/module/screen/conversation/ConversationDetail.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","Text","ActivityIndicator","TouchableOpacity","StyleSheet","FlatList","KeyboardAvoidingView","Platform","TouchableWithoutFeedback","Keyboard","Image","React","useEffect","useMutation","useQuery","useSubscription","widgetsConversationDetail","MaterialCommunityIcons","useSafeAreaInsets","Message","InputTools","widgetsInsertMessage","conversationMessageInserted","getAttachmentUrl","getLocalStorageItem","setLocalStorageItem","ConversationDetail","props","_data$widgetsConversa5","route","navigation","_id","integrationId","bgColor","brand","customerId","visitorId","params","messages","setMessages","useState","data","loading","variables","fetchPolicy","skip","subscriptionData","shouldAdd","length","_subscriptionData$con","prev","_data$widgetsConversa","_data$widgetsConversa2","_data$widgetsConversa3","_data$widgetsConversa4","reversed","slice","reverse","sendMutation","onSend","text","conversationId","contentType","message","then","res","errors","console","log","cachedCustomerId","tempCustomerId","newArray","catch","err","createElement","style","flex","alignItems","justifyContent","color","size","renderItem","_ref","item","renderContent","contentContainerStyle","styles","contentStyle","showsVerticalScrollIndicator","keyExtractor","onEndReachedThreshold","ItemSeparatorComponent","inverted","Header","users","participatedUsers","backgroundColor","behavior","OS","undefined","keyboardVerticalOffset","onPress","dismiss","insets","_users$","_users$$details","_users$2","_users$2$details","_users$3","_users$3$details","url","details","avatar","flexDirection","paddingBottom","paddingTop","top","goBack","backStyle","allowFontScaling","name","direction","title","marginLeft","source","uri","cache","resizeMode","fontWeight","fullName","position","fontSize","create","width","height","borderRadius","paddingVertical","paddingHorizontal","borderTopLeftRadius","borderTopRightRadius","flexGrow","padding"],"sourceRoot":"../../../../src","sources":["screen/conversation/ConversationDetail.tsx"],"mappings":"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"}

package/lib/module/screen/conversation/Conversations.js

@@ -0,0 +1,152 @@
+/* eslint-disable react-native/no-inline-styles */
+import { View, Text, FlatList, StyleSheet, Image, TouchableOpacity, RefreshControl } from 'react-native';
+import React from 'react';
+import { widgetsConversations } from '../../graphql/query';
+import { useQuery } from '@apollo/client';
+import dayjs from 'dayjs';
+import images from '../../assets/images';
+import FAB from '../../components/FAB';
+import { useNavigation } from '@react-navigation/native';
+import { getAttachmentUrl } from '../../utils/utils';
+const Conversations = props => {
+  const {
+    customerId,
+    visitorId,
+    integrationId,
+    bgColor,
+    brand
+  } = props;
+  const navigation = useNavigation();
+  const {
+    data,
+    loading,
+    refetch
+  } = useQuery(widgetsConversations, {
+    variables: {
+      customerId,
+      integrationId
+    }
+  });
+  const [refreshing, setRefreshing] = React.useState(false);
+  const onRefresh = React.useCallback(() => {
+    setRefreshing(true);
+    refetch();
+    setTimeout(() => {
+      setRefreshing(false);
+    }, 1000);
+  }, [refetch]);
+  if (loading) {
+    return null;
+  }
+  const renderItem = _ref => {
+    var _item$participatedUse;
+    let {
+      item
+    } = _ref;
+    let source = images.avatar;
+    let name = 'Support Staff';
+    if ((item === null || item === void 0 ? void 0 : (_item$participatedUse = item.participatedUsers) === null || _item$participatedUse === void 0 ? void 0 : _item$participatedUse.length) > 0) {
+      var _item$participatedUse2, _item$participatedUse3, _item$participatedUse4, _item$participatedUse5;
+      source = {
+        uri: getAttachmentUrl(item === null || item === void 0 ? void 0 : (_item$participatedUse2 = item.participatedUsers[0]) === null || _item$participatedUse2 === void 0 ? void 0 : (_item$participatedUse3 = _item$participatedUse2.details) === null || _item$participatedUse3 === void 0 ? void 0 : _item$participatedUse3.avatar),
+        cache: 'only-if-cached'
+      };
+      name = item === null || item === void 0 ? void 0 : (_item$participatedUse4 = item.participatedUsers[0]) === null || _item$participatedUse4 === void 0 ? void 0 : (_item$participatedUse5 = _item$participatedUse4.details) === null || _item$participatedUse5 === void 0 ? void 0 : _item$participatedUse5.fullName;
+    }
+    return /*#__PURE__*/React.createElement(TouchableOpacity, {
+      style: styles.itemContainer,
+      onPress: () => {
+        navigation.navigate('ConversationDetail', {
+          _id: item._id,
+          integrationId,
+          customerId,
+          visitorId,
+          bgColor,
+          brand
+        });
+      }
+    }, /*#__PURE__*/React.createElement(Image, {
+      source: source,
+      style: styles.image,
+      resizeMode: "stretch"
+    }), /*#__PURE__*/React.createElement(View, {
+      style: {
+        flex: 1,
+        marginLeft: 10
+      }
+    }, /*#__PURE__*/React.createElement(Text, {
+      style: {
+        fontWeight: '500'
+      }
+    }, name), /*#__PURE__*/React.createElement(Text, {
+      style: {
+        color: '#686868'
+      }
+    }, item === null || item === void 0 ? void 0 : item.content)), /*#__PURE__*/React.createElement(Text, null, dayjs(item === null || item === void 0 ? void 0 : item.createdAt).format('hh:mm A')));
+  };
+  const renderHeader = () => {
+    return /*#__PURE__*/React.createElement(View, {
+      style: {
+        marginVertical: 10
+      }
+    }, /*#__PURE__*/React.createElement(Text, {
+      style: {
+        fontWeight: '600',
+        fontSize: 18
+      }
+    }, "Recent conversations"));
+  };
+  const seperator = () => {
+    return /*#__PURE__*/React.createElement(View, {
+      style: {
+        height: 10
+      }
+    });
+  };
+  return /*#__PURE__*/React.createElement(View, {
+    style: {
+      flex: 1
+    }
+  }, /*#__PURE__*/React.createElement(FlatList, {
+    contentContainerStyle: styles.contentStyle,
+    showsVerticalScrollIndicator: false,
+    data: data === null || data === void 0 ? void 0 : data.widgetsConversations,
+    keyExtractor: item => item._id,
+    onEndReachedThreshold: 0.2,
+    renderItem: renderItem,
+    ListHeaderComponent: renderHeader,
+    refreshControl: /*#__PURE__*/React.createElement(RefreshControl, {
+      refreshing: refreshing,
+      onRefresh: onRefresh,
+      colors: [bgColor],
+      tintColor: bgColor
+    }),
+    ItemSeparatorComponent: seperator
+  }), /*#__PURE__*/React.createElement(FAB, {
+    onPress: () => navigation.navigate('ConversationDetail', {
+      _id: '',
+      integrationId,
+      customerId,
+      bgColor,
+      brand
+    })
+  }));
+};
+export default Conversations;
+const styles = StyleSheet.create({
+  contentStyle: {
+    flexGrow: 1,
+    padding: 20
+  },
+  itemContainer: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center'
+  },
+  image: {
+    width: 40,
+    height: 40,
+    borderRadius: 90
+  }
+});
+//# sourceMappingURL=Conversations.js.map

package/lib/module/screen/conversation/Conversations.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","Text","FlatList","StyleSheet","Image","TouchableOpacity","RefreshControl","React","widgetsConversations","useQuery","dayjs","images","FAB","useNavigation","getAttachmentUrl","Conversations","props","customerId","visitorId","integrationId","bgColor","brand","navigation","data","loading","refetch","variables","refreshing","setRefreshing","useState","onRefresh","useCallback","setTimeout","renderItem","_ref","_item$participatedUse","item","source","avatar","name","participatedUsers","length","_item$participatedUse2","_item$participatedUse3","_item$participatedUse4","_item$participatedUse5","uri","details","cache","fullName","createElement","style","styles","itemContainer","onPress","navigate","_id","image","resizeMode","flex","marginLeft","fontWeight","color","content","createdAt","format","renderHeader","marginVertical","fontSize","seperator","height","contentContainerStyle","contentStyle","showsVerticalScrollIndicator","keyExtractor","onEndReachedThreshold","ListHeaderComponent","refreshControl","colors","tintColor","ItemSeparatorComponent","create","flexGrow","padding","flexDirection","justifyContent","alignItems","width","borderRadius"],"sourceRoot":"../../../../src","sources":["screen/conversation/Conversations.tsx"],"mappings":"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"}

package/lib/module/screen/conversation/Message.js

@@ -0,0 +1,142 @@
+/* eslint-disable react-native/no-inline-styles */
+import { View, Text, StyleSheet, Dimensions, Image, Linking } from 'react-native';
+import React from 'react';
+import dayjs from 'dayjs';
+import HTML from 'react-native-render-html';
+import { getAttachmentUrl, strip_html } from '../../utils/utils';
+import Attachment from './Attachment';
+const {
+  width
+} = Dimensions.get('window');
+const Message = props => {
+  var _item$attachments;
+  const {
+    item,
+    bgColor
+  } = props;
+  const position = item !== null && item !== void 0 && item.customerId ? 'right' : 'left';
+  const renderAvatar = () => {
+    var _item$user, _item$user$details;
+    const url = getAttachmentUrl(item === null || item === void 0 ? void 0 : (_item$user = item.user) === null || _item$user === void 0 ? void 0 : (_item$user$details = _item$user.details) === null || _item$user$details === void 0 ? void 0 : _item$user$details.avatar);
+    return /*#__PURE__*/React.createElement(View, {
+      style: {
+        marginRight: 10
+      }
+    }, /*#__PURE__*/React.createElement(Image, {
+      source: {
+        uri: url,
+        cache: 'force-cache'
+      },
+      style: styles.avatar,
+      resizeMode: "stretch"
+    }));
+  };
+  const renderContent = () => {
+    const strippedContent = strip_html((item === null || item === void 0 ? void 0 : item.content) || '');
+    if ((strippedContent === null || strippedContent === void 0 ? void 0 : strippedContent.length) === 0) {
+      return null;
+    }
+    return /*#__PURE__*/React.createElement(RenderHTML, {
+      html: item === null || item === void 0 ? void 0 : item.content
+    });
+  };
+  return /*#__PURE__*/React.createElement(View, {
+    style: [customStyles[position].container]
+  }, position === 'left' ? renderAvatar() : null, /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
+    style: [styles.contentStyle, {
+      backgroundColor: position === 'left' ? '#E7F2F7FF' : bgColor,
+      borderBottomLeftRadius: position === 'left' ? 0 : 20,
+      borderBottomRightRadius: position === 'left' ? 20 : 0
+    }]
+  }, position === 'left' ? renderContent() : /*#__PURE__*/React.createElement(Text, {
+    style: {
+      paddingVertical: 12
+    }
+  }, item === null || item === void 0 ? void 0 : item.content), (item === null || item === void 0 ? void 0 : (_item$attachments = item.attachments) === null || _item$attachments === void 0 ? void 0 : _item$attachments.length) > 0 ? /*#__PURE__*/React.createElement(Attachment, {
+    images: item === null || item === void 0 ? void 0 : item.attachments
+  }) : null), /*#__PURE__*/React.createElement(Text, {
+    style: {
+      color: '#686868',
+      fontSize: 12,
+      textAlign: position === 'left' ? 'left' : 'right'
+    }
+  }, dayjs(item === null || item === void 0 ? void 0 : item.createdAt).format('hh:mm A'))));
+};
+export default Message;
+const customStyles = {
+  left: StyleSheet.create({
+    container: {
+      justifyContent: 'flex-start',
+      marginLeft: 0,
+      marginRight: 0,
+      marginTop: 10,
+      flexDirection: 'row',
+      alignItems: 'center'
+    }
+  }),
+  right: StyleSheet.create({
+    container: {
+      justifyContent: 'flex-end',
+      marginLeft: 0,
+      marginRight: 0,
+      marginTop: 10,
+      flexDirection: 'row',
+      alignItems: 'center'
+    }
+  })
+};
+const styles = StyleSheet.create({
+  contentStyle: {
+    paddingHorizontal: 15,
+    maxWidth: width * 0.8,
+    marginVertical: 5,
+    borderTopLeftRadius: 20,
+    borderTopRightRadius: 20
+  },
+  avatar: {
+    width: 40,
+    height: 40,
+    borderRadius: 90
+  }
+});
+const RenderHTML = /*#__PURE__*/React.memo(function RenderHTML(_ref) {
+  let {
+    html
+  } = _ref;
+  const renderersProps = {
+    a: {
+      onPress(url) {
+        Linking.openURL(url);
+      }
+    }
+  };
+  return /*#__PURE__*/React.createElement(HTML, {
+    contentWidth: width - 150,
+    source: {
+      html: html
+    },
+    tagsStyles: {
+      p: {
+        color: '#686868'
+      },
+      a: {
+        color: '#3B85F4'
+      },
+      li: {
+        color: '#3B85F4'
+      },
+      ol: {
+        color: '#686868'
+      }
+    },
+    ignoredDomTags: ['meta', 'script', 'font', 'title'],
+    ignoredStyles: ['borderStyle'],
+    renderersProps: renderersProps,
+    defaultTextProps: {
+      style: {
+        color: '#000'
+      }
+    }
+  });
+});
+//# sourceMappingURL=Message.js.map

package/lib/module/screen/conversation/Message.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","Text","StyleSheet","Dimensions","Image","Linking","React","dayjs","HTML","getAttachmentUrl","strip_html","Attachment","width","get","Message","props","_item$attachments","item","bgColor","position","customerId","renderAvatar","_item$user","_item$user$details","url","user","details","avatar","createElement","style","marginRight","source","uri","cache","styles","resizeMode","renderContent","strippedContent","content","length","RenderHTML","html","customStyles","container","contentStyle","backgroundColor","borderBottomLeftRadius","borderBottomRightRadius","paddingVertical","attachments","images","color","fontSize","textAlign","createdAt","format","left","create","justifyContent","marginLeft","marginTop","flexDirection","alignItems","right","paddingHorizontal","maxWidth","marginVertical","borderTopLeftRadius","borderTopRightRadius","height","borderRadius","memo","_ref","renderersProps","a","onPress","openURL","contentWidth","tagsStyles","p","li","ol","ignoredDomTags","ignoredStyles","defaultTextProps"],"sourceRoot":"../../../../src","sources":["screen/conversation/Message.tsx"],"mappings":"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"}