@smart-link/rn-im 1.0.23 → 1.0.26

package/dist/pages/message/components/Payload/PayloadFile.js

@@ -1,27 +1,3 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -31,41 +7,38 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const rn_ui_1 = require("@smart-link/rn-ui");
-const react_native_file_viewer_1 = __importDefault(require("react-native-file-viewer"));
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
-const file_1 = require("../../../../utils/file");
-const im_base_1 = require("@smart-link/im-base");
-const UploadProgress_1 = __importDefault(require("../UploadProgress"));
-const init_1 = require("../../../../init");
-const PayloadWrapper_1 = __importDefault(require("./PayloadWrapper"));
-const file_icon_1 = require("../../../../utils/file-icon");
-const useTranslation_1 = __importDefault(require("../../../../hooks/useTranslation"));
-const PayloadFile = ({ payload, messageSeq, direction, showArrow = true, isRecord, messageStatus, sendSize, style, onLongPress }) => {
+import { dp, Toast } from '@smart-link/rn-ui';
+import FileViewer from 'react-native-file-viewer';
+import React, { memo, useRef, useState } from 'react';
+import { View, Text, StyleSheet, Dimensions, } from 'react-native';
+import { numberToFileSize, toAbsolutePath } from '../../../../utils/file';
+import { MessageStatus } from '@smart-link/im-base';
+import UploadProgress from '../UploadProgress';
+import { getImManager } from '../../../../init';
+import PayloadWrapper from './PayloadWrapper';
+import { findSvgIcon } from '../../../../utils/file-icon';
+import useTranslation from "../../../../hooks/useTranslation";
+const PayloadFile = ({ payload, messageSeq, direction, showArrow = true, isRecord, messageStatus, jobId, sendSize, style, onLongPress }) => {
     const ext = payload.filename.split('.').pop();
-    const Icon = (0, file_icon_1.findSvgIcon)(ext);
-    const path = (0, react_1.useRef)('');
-    const downloading = (0, react_1.useRef)(false);
-    const { t } = (0, useTranslation_1.default)();
-    const [download, setDownload] = (0, react_1.useState)({
+    const Icon = findSvgIcon(ext);
+    const path = useRef('');
+    const downloading = useRef(false);
+    const { t } = useTranslation();
+    const width = Dimensions.get('window').width * 0.75 - dp(24);
+    const [download, setDownload] = useState({
         progress: 0,
         status: 'pending',
     });
     const openWithLocal = (path) => __awaiter(void 0, void 0, void 0, function* () {
         try {
-            yield react_native_file_viewer_1.default.open(path);
+            yield FileViewer.open(toAbsolutePath(path));
         }
         catch (e) {
-            rn_ui_1.Toast.warning(t('fileOpenFail'));
+            Toast.warning(t('fileOpenFail'));
         }
     });
     const pressFile = () => __awaiter(void 0, void 0, void 0, function* () {
-        const imManager = (0, init_1.getImManager)();
+        const imManager = getImManager();
         const download = () => __awaiter(void 0, void 0, void 0, function* () {
             try {
                 const localPath = yield imManager.download({
@@ -76,7 +49,7 @@ const PayloadFile = ({ payload, messageSeq, direction, showArrow = true, isRecor
                     onProgress: (e) => {
                         setDownload({
                             progress: e.loaded,
-                            status: 'downloading',
+                            status: e.loaded === payload.size ? 'done' : 'downloading',
                         });
                     }
                 });
@@ -88,7 +61,7 @@ const PayloadFile = ({ payload, messageSeq, direction, showArrow = true, isRecor
                 return localPath;
             }
             catch (e) {
-                rn_ui_1.Toast.error(t('downloadError'));
+                Toast.error(t('downloadError'));
                 setDownload({
                     progress: 0,
                     status: 'pending',
@@ -108,6 +81,10 @@ const PayloadFile = ({ payload, messageSeq, direction, showArrow = true, isRecor
                 return;
             downloading.current = true;
             localPath = yield download();
+            setDownload({
+                progress: payload.size,
+                status: 'done',
+            });
             imManager.updateResource({ url: payload.fileId, localPath });
             yield openWithLocal(localPath);
             return;
@@ -120,38 +97,37 @@ const PayloadFile = ({ payload, messageSeq, direction, showArrow = true, isRecor
                 return;
             downloading.current = true;
             const localPath = yield download();
-            (0, init_1.getImManager)().db.updateMessage({
+            getImManager().db.updateMessage({
                 messageSeq,
                 payload: Object.assign(Object.assign({}, payload), { localPath: localPath }),
             });
             yield openWithLocal(localPath);
         }
     });
-    return (<PayloadWrapper_1.default direction={direction} showArrow={showArrow} onLongPress={onLongPress} style={[style, styles.file]} onPress={pressFile}>
-            <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center' }}>
+    return (<PayloadWrapper direction={direction} showArrow={showArrow} onLongPress={onLongPress} style={[style, styles.file, { width: width + dp(12) }]} onPress={pressFile}>
+            <View style={{ flexDirection: 'row', alignItems: 'center', flex: 1 }}>
                 <Icon style={styles.fileIcon}/>
-                <react_native_1.View style={{ flex: 1 }}>
-                    <react_native_1.Text numberOfLines={1} ellipsizeMode="middle">{payload.filename}</react_native_1.Text>
-                    <react_native_1.Text style={styles.size}>{(0, file_1.numberToFileSize)(payload.size)}{payload.localPath ? t('downloaded') : ''}</react_native_1.Text>
-                </react_native_1.View>
-            </react_native_1.View>
-            <UploadProgress_1.default show={download.status === 'downloading'} width={200} sendSize={download.progress} totalSize={payload.size}/>
-            <UploadProgress_1.default show={messageStatus === im_base_1.MessageStatus.EMITTING} width={200} sendSize={sendSize || 0} totalSize={payload.size}/>
-        </PayloadWrapper_1.default>);
+                <View style={{ flex: 1 }}>
+                    <Text numberOfLines={1} ellipsizeMode="middle">{payload.filename}</Text>
+                    <Text style={styles.size}>{numberToFileSize(payload.size)} {payload.localPath ? t('downloaded') : ''}</Text>
+                </View>
+            </View>
+            <UploadProgress show={download.status === 'downloading'} width={width} sendSize={download.progress} totalSize={payload.size}/>
+            <UploadProgress show={messageStatus === MessageStatus.EMITTING || Boolean(jobId)} width={width} sendSize={sendSize || 0} totalSize={payload.size}/>
+        </PayloadWrapper>);
 };
-const styles = react_native_1.StyleSheet.create({
+const styles = StyleSheet.create({
     file: {
-        minWidth: 200,
+        flexDirection: 'column',
         alignItems: 'center',
-        padding: (0, rn_ui_1.dp)(6),
-        borderRadius: (0, rn_ui_1.dp)(8),
-        width: react_native_1.Dimensions.get('window').width * 0.75,
+        padding: dp(6),
+        borderRadius: dp(8)
     },
     fileIcon: {
-        marginRight: (0, rn_ui_1.dp)(8),
+        marginRight: dp(8),
     },
     size: {
         color: '#999',
     },
 });
-exports.default = (0, react_1.memo)(PayloadFile);
+export default memo(PayloadFile);

package/dist/pages/message/components/Payload/PayloadMultiple.js

@@ -1,103 +1,79 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const styles_1 = require("../../../../components/styles");
-const useTranslation_1 = __importDefault(require("../../../../hooks/useTranslation"));
-const init_1 = require("../../../../init");
-const im_base_1 = require("@smart-link/im-base");
-const rn_ui_1 = require("@smart-link/rn-ui");
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
-const PayloadWrapper_1 = __importDefault(require("./PayloadWrapper"));
-const { width } = react_native_1.Dimensions.get('window');
-const PayloadMultiple = (0, react_1.memo)(({ payload, messageSeq, direction, showArrow = true, style, onLongPress }) => {
-    const navigation = (0, rn_ui_1.useNavigation)();
+import { borderStyle, shadowStyle } from '../../../../components/styles';
+import useTranslation from '../../../../hooks/useTranslation';
+import { getImManager } from '../../../../init';
+import { buildSimpleText, ConversationType, MessageListActions } from '@smart-link/im-base';
+import { dp, useNavigation } from '@smart-link/rn-ui';
+import React, { memo } from 'react';
+import { View, StyleSheet, Text, Dimensions } from 'react-native';
+import PayloadWrapper from './PayloadWrapper';
+const { width } = Dimensions.get('window');
+const PayloadMultiple = memo(({ payload, messageSeq, direction, showArrow = true, style, onLongPress }) => {
+    const navigation = useNavigation();
     const { type, toName, fromName, selectedMessages } = payload;
-    const { t } = (0, useTranslation_1.default)();
-    const imManager = (0, init_1.getImManager)();
+    const { t } = useTranslation();
+    const imManager = getImManager();
     const messages = selectedMessages.length > 4 ? [...selectedMessages.slice(0, 4), 'more'] : selectedMessages;
-    const title = type === im_base_1.ConversationType.C2C
+    const title = type === ConversationType.C2C
         ? t('multipleChatRecordTitle', { fromName, toName })
         : t('multipleChatRecordTitleGroup');
-    return (<PayloadWrapper_1.default direction={direction} showArrow={showArrow} style={[style, styles.wrap]} onPress={() => {
-            navigation.navigate('MessageRecord', {
-                messageSeq,
-                messages: selectedMessages,
-                title,
+    return (<PayloadWrapper direction={direction} showArrow={showArrow} style={[style, styles.wrap]} onPress={() => {
+            imManager.store.dispatch(MessageListActions.addMessageListData(imManager, messageSeq, selectedMessages));
+            navigation.navigate({
+                name: 'MessageRecord',
+                key: Date.now().toString(),
+                params: {
+                    messageSeq,
+                    title,
+                },
             });
         }} onLongPress={onLongPress}>
-            <react_native_1.Text style={styles.titleText} numberOfLines={2}>
+            <Text style={styles.titleText} numberOfLines={2}>
                 {title}
-            </react_native_1.Text>
-            <react_native_1.View style={styles.content}>
+            </Text>
+            <View style={styles.content}>
                 {messages.map((message, index) => {
-            return message === 'more' ? (<react_native_1.Text key={index} style={styles.itemTextMore}>
+            return message === 'more' ? (<Text key={index} style={styles.itemTextMore}>
                                     ......
-                                </react_native_1.Text>) : (<react_native_1.Text key={index} style={styles.itemText} numberOfLines={1} ellipsizeMode="middle">
-                                    {message.messageFromName + ': ' + (0, im_base_1.buildSimpleText)(imManager, message.payloadType, message.payload)}
-                                </react_native_1.Text>);
+                                </Text>) : (<Text key={index} style={styles.itemText} numberOfLines={1} ellipsizeMode="middle">
+                                    {message.messageFromName + ': ' + buildSimpleText(imManager, message.payloadType, message.payload)}
+                                </Text>);
         })}
-            </react_native_1.View>
-            <react_native_1.View style={styles.line}/>
-            <react_native_1.Text style={styles.footerText}>{t('multipleChatRecord')}</react_native_1.Text>
-        </PayloadWrapper_1.default>);
+            </View>
+            <View style={styles.line}/>
+            <Text style={styles.footerText}>{t('multipleChatRecord')}</Text>
+        </PayloadWrapper>);
 });
-const styles = react_native_1.StyleSheet.create({
-    wrap: Object.assign(Object.assign({ minWidth: (0, rn_ui_1.dp)(200), maxWidth: width - 120, padding: (0, rn_ui_1.dp)(12), paddingBottom: (0, rn_ui_1.dp)(6) }, styles_1.borderStyle), styles_1.shadowStyle),
+const styles = StyleSheet.create({
+    wrap: Object.assign(Object.assign({ minWidth: dp(200), maxWidth: width - 120, padding: dp(12), paddingBottom: dp(6) }, borderStyle), shadowStyle),
     titleText: {
         color: '#333',
-        fontSize: (0, rn_ui_1.dp)(14),
-        lineHeight: (0, rn_ui_1.dp)(18),
+        fontSize: dp(14),
+        lineHeight: dp(18),
     },
     content: {
-        paddingVertical: (0, rn_ui_1.dp)(5),
+        paddingVertical: dp(5),
     },
     item: {
         justifyContent: 'center',
     },
     itemText: {
         color: '#999',
-        fontSize: (0, rn_ui_1.dp)(13),
+        fontSize: dp(13),
     },
     itemTextMore: {
         color: '#999',
-        fontSize: (0, rn_ui_1.dp)(13),
+        fontSize: dp(13),
     },
     footerText: {
         color: '#777',
-        fontSize: (0, rn_ui_1.dp)(13),
+        fontSize: dp(13),
     },
     line: {
-        marginTop: (0, rn_ui_1.dp)(5),
-        marginBottom: (0, rn_ui_1.dp)(5),
+        marginTop: dp(5),
+        marginBottom: dp(5),
         backgroundColor: '#eee',
         width: '100%',
-        height: (0, rn_ui_1.dp)(1),
+        height: dp(1),
     },
 });
-exports.default = PayloadMultiple;
+export default PayloadMultiple;

package/dist/pages/message/components/Payload/PayloadNotify.js

@@ -1,99 +1,71 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const useTranslation_1 = __importDefault(require("../../../../hooks/useTranslation"));
-const im_base_1 = require("@smart-link/im-base");
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
+import useTranslation from '../../../../hooks/useTranslation';
+import { PayloadType } from '@smart-link/im-base';
+import React, { memo } from 'react';
+import { View, Text, StyleSheet } from 'react-native';
 const DetailChange = ({ payload }) => {
-    const { t } = (0, useTranslation_1.default)();
+    const { t } = useTranslation();
     const changeKeys = {
         noticeChange: 'chatGroupNoticeChange',
         nameChange: 'chatGroupNameChange',
     };
-    return <react_native_1.Text style={styles.text}>{t(changeKeys[payload.changeKey], payload)}</react_native_1.Text>;
+    return <Text style={styles.text}>{t(changeKeys[payload.changeKey], payload)}</Text>;
 };
 const MemberInvite = ({ payload }) => {
-    const { t } = (0, useTranslation_1.default)();
-    return (<react_native_1.Text style={styles.text}>
+    const { t } = useTranslation();
+    return (<Text style={styles.text}>
             {t('chatGroupInviteMember', { userName: payload.inviterName, content: payload.inviteesName.join('、') })}
-        </react_native_1.Text>);
+        </Text>);
 };
 const MemberRemove = ({ payload }) => {
-    const { t } = (0, useTranslation_1.default)();
-    return <react_native_1.Text style={styles.text}>{t('chatGroupRemoveMember', { content: payload.names.join('、') })}</react_native_1.Text>;
+    const { t } = useTranslation();
+    return <Text style={styles.text}>{t('chatGroupRemoveMember', { content: payload.names.join('、') })}</Text>;
 };
 const MemberBeenRemove = ({ payload }) => {
-    const { t } = (0, useTranslation_1.default)();
-    return <react_native_1.Text style={styles.text}>{t('chatGroupBeenRemoveMember')}</react_native_1.Text>;
+    const { t } = useTranslation();
+    return <Text style={styles.text}>{t('chatGroupBeenRemoveMember')}</Text>;
 };
 const MemberLeave = ({ payload }) => {
-    const { t } = (0, useTranslation_1.default)();
-    return <react_native_1.Text style={styles.text}>{t('chatGroupMemberLeave', { userName: payload.userName })}</react_native_1.Text>;
+    const { t } = useTranslation();
+    return <Text style={styles.text}>{t('chatGroupMemberLeave', { userName: payload.userName })}</Text>;
 };
 const GroupInviteSwitch = ({ payload }) => {
-    const { t } = (0, useTranslation_1.default)();
+    const { t } = useTranslation();
     console.log('GroupInviteSwitch:');
-    return (<react_native_1.Text style={styles.text}>
+    return (<Text style={styles.text}>
             {t(payload.switchCode === 'on' ? 'groupInviteValidateEnable' : 'groupInviteValidateDisable')}
-        </react_native_1.Text>);
+        </Text>);
 };
 const PayloadNotify = ({ payload, payloadType }) => {
     console.log('PayloadNotify: ', payload, payloadType);
     const { content: text } = payload;
     let content;
     switch (payloadType) {
-        case im_base_1.PayloadType.GROUP_DETAIL_CHANGE:
+        case PayloadType.GROUP_DETAIL_CHANGE:
             content = <DetailChange payload={payload}/>;
             break;
-        case im_base_1.PayloadType.GROUP_MEMBER_INVITE:
+        case PayloadType.GROUP_MEMBER_INVITE:
             content = <MemberInvite payload={payload}/>;
             break;
-        case im_base_1.PayloadType.GROUP_MEMBER_REMOVE_NOTICE:
+        case PayloadType.GROUP_MEMBER_REMOVE_NOTICE:
             content = <MemberRemove payload={payload}/>;
             break;
-        case im_base_1.PayloadType.GROUP_MEMBER_BEEN_REMOVED:
+        case PayloadType.GROUP_MEMBER_BEEN_REMOVED:
             content = <MemberBeenRemove payload={payload}/>;
             break;
-        case im_base_1.PayloadType.GROUP_INVITE_VALIDATE_SWITCH:
+        case PayloadType.GROUP_INVITE_VALIDATE_SWITCH:
             content = <GroupInviteSwitch payload={payload}/>;
             break;
-        case im_base_1.PayloadType.GROUP_MEMBER_LEAVE:
+        case PayloadType.GROUP_MEMBER_LEAVE:
             content = <MemberLeave payload={payload}/>;
             break;
         default:
-            content = <react_native_1.Text style={styles.text}>{text}</react_native_1.Text>;
+            content = <Text style={styles.text}>{text}</Text>;
             break;
     }
-    return <react_native_1.View style={styles.content}>{content}</react_native_1.View>;
+    return <View style={styles.content}>{content}</View>;
 };
-const styles = react_native_1.StyleSheet.create({
+const styles = StyleSheet.create({
     content: { marginHorizontal: '10%', paddingVertical: 10, alignItems: 'center' },
     text: { color: '#999', textAlign: 'center' },
 });
-exports.default = (0, react_1.memo)(PayloadNotify);
+export default memo(PayloadNotify);

package/dist/pages/message/components/Payload/PayloadPicture.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { PayloadProps } from "./type";
-declare const _default: React.MemoExoticComponent<({ payload, onLoad, ...retProps }: PayloadProps) => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ payload, onLoad, isRecord, ...retProps }: PayloadProps) => React.JSX.Element>;
 export default _default;

package/dist/pages/message/components/Payload/PayloadPicture.js

@@ -1,27 +1,3 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -33,45 +9,40 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
-const react_native_svg_1 = require("react-native-svg");
-const golden_rectangle_1 = require("../../../../utils/golden-rectangle");
-const styles_1 = require("../../../../components/styles");
-const rn_ui_1 = require("@smart-link/rn-ui");
-const PayloadWrapper_1 = __importDefault(require("./PayloadWrapper"));
-const react_native_fast_image_1 = __importDefault(require("react-native-fast-image"));
-const useDownloadSource_1 = __importDefault(require("../../../../hooks/useDownloadSource"));
-const file_1 = require("../../../../utils/file");
-const { width: screenWidth } = react_native_1.Dimensions.get('window');
+import React, { memo, useEffect } from 'react';
+import { Dimensions, View } from 'react-native';
+import { SvgFromUri } from 'react-native-svg';
+import { calculate } from '../../../../utils/golden-rectangle';
+import { borderStyle, shadowStyle } from '../../../../components/styles';
+import { dp } from '@smart-link/rn-ui';
+import PayloadWrapper from './PayloadWrapper';
+import Image from 'react-native-fast-image';
+import { toAbsolutePath } from "../../../../utils/file";
+const { width: screenWidth } = Dimensions.get('window');
 const PayloadPicture = (_a) => {
-    var { payload, onLoad } = _a, retProps = __rest(_a, ["payload", "onLoad"]);
+    var { payload, onLoad, isRecord } = _a, retProps = __rest(_a, ["payload", "onLoad", "isRecord"]);
     const ext = payload.filename.split('.').pop();
-    const localPath = (0, useDownloadSource_1.default)(payload);
-    (0, react_1.useEffect)(() => {
+    const { localPath } = payload;
+    useEffect(() => {
         if (localPath) {
             onLoad === null || onLoad === void 0 ? void 0 : onLoad(localPath);
         }
     }, [onLoad, localPath]);
-    const size = (0, golden_rectangle_1.calculate)(payload.height || (0, rn_ui_1.dp)(163), payload.width || (0, rn_ui_1.dp)(100), 200);
+    const size = calculate(payload.height || dp(163), payload.width || dp(100), 200);
     if (!localPath) {
-        return <react_native_1.View style={[styles_1.borderStyle, size, { alignItems: 'center', justifyContent: 'center', backgroundColor: 'rgba(0,0,0, 0.8)' }]}/>;
+        return <View style={[borderStyle, size, { alignItems: 'center', justifyContent: 'center', backgroundColor: 'rgba(0,0,0, 0.8)' }]}/>;
     }
     let content;
     if (/svg/i.test(ext)) {
-        content = <react_native_svg_1.SvgFromUri style={[styles_1.borderStyle]} uri={localPath} viewBox={'0 0 1024 1024'} width={screenWidth * 0.4} height={screenWidth * 0.4}/>;
+        content = <SvgFromUri style={[borderStyle]} uri={toAbsolutePath(localPath)} viewBox={'0 0 1024 1024'} width={screenWidth * 0.4} height={screenWidth * 0.4}/>;
     }
     else {
-        content = <react_native_fast_image_1.default resizeMode="cover" style={[styles_1.borderStyle, size]} source={{
-                uri: (0, file_1.toAbsolutePath)(localPath),
+        content = <Image resizeMode="cover" style={[borderStyle, size]} source={{
+                uri: toAbsolutePath(localPath),
             }}/>;
     }
-    return <PayloadWrapper_1.default style={styles_1.shadowStyle} {...retProps}>
+    return <PayloadWrapper style={shadowStyle} {...retProps}>
         {content}
-    </PayloadWrapper_1.default>;
+    </PayloadWrapper>;
 };
-exports.default = (0, react_1.memo)(PayloadPicture);
+export default memo(PayloadPicture);