@smart-link/rn-im 1.0.1

package/dist/pages/conversation/setting/OptionGroupManage.js

@@ -0,0 +1,68 @@
+"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 react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const useTranslation_1 = __importDefault(require("../../../hooks/useTranslation"));
+const rn_ui_1 = require("@smart-link/rn-ui");
+const useImSelector_1 = require("../../../hooks/useImSelector");
+const init_1 = require("../../../init");
+const im_base_1 = require("@smart-link/im-base");
+const OptionGroupManage = (0, react_1.memo)(props => {
+    const { navigation, } = props;
+    const imManager = (0, init_1.getImManager)();
+    const { t } = (0, useTranslation_1.default)();
+    const { currentConversation } = (0, useImSelector_1.useConversation)();
+    if (!currentConversation) {
+        return null;
+    }
+    const { enableInviteValidate = 'off' } = currentConversation;
+    (0, react_1.useEffect)(() => {
+        navigation.setOptions({
+            title: t('groupMgr')
+        });
+    }, [navigation]);
+    const onValueChange = (0, react_1.useCallback)((value) => {
+        imManager.store.dispatch(im_base_1.SettingActions.settingEnableInviteValidate(value ? 'on' : 'off'));
+    }, []);
+    return (<rn_ui_1.NavigationPage scroll noPadding>
+            <react_native_1.ScrollView>
+                <rn_ui_1.Space size={'m'}/>
+                <rn_ui_1.ListRow title={t('groupInviteValid')} detail={<react_native_1.Switch value={enableInviteValidate === 'on'} onValueChange={onValueChange}/>} topSeparator='full' bottomSeparator='full'/>
+                {/*<Space size={'m'} />*/}
+                {/*<ListRow title={t('groupTransfer')}*/}
+                {/*         onPress={() => {*/}
+                {/*             navigation.navigate('GroupTransfer')*/}
+                {/*         }}*/}
+                {/*         topSeparator='full'*/}
+                {/*         bottomSeparator='full'*/}
+                {/*/>*/}
+            </react_native_1.ScrollView>
+        </rn_ui_1.NavigationPage>);
+});
+exports.default = OptionGroupManage;

package/dist/pages/conversation/setting/OptionGroupMoreMember.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+type Props = {};
+declare const OptionGroupMoreMember: (props: Props) => import("react").JSX.Element;
+export default OptionGroupMoreMember;

package/dist/pages/conversation/setting/OptionGroupMoreMember.js

@@ -0,0 +1,124 @@
+"use strict";
+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 useImSelector_1 = require("../../../hooks/useImSelector");
+const react_1 = require("react");
+const useTranslation_1 = __importDefault(require("../../../hooks/useTranslation"));
+const react_native_1 = require("react-native");
+const ChatAvatar_1 = __importDefault(require("../../../components/ChatAvatar"));
+const default_assets_1 = require("../../../default-assets");
+const im_base_1 = require("@smart-link/im-base");
+const styles_1 = require("../../../components/styles");
+const { OWNER, MGR, } = im_base_1.MemberLevel;
+const OptionGroupMoreMember = (props) => {
+    const { groupDetail } = (0, useImSelector_1.useChatGroup)();
+    const { groupMemberList } = groupDetail;
+    const [keyword, setKeyword] = (0, react_1.useState)('');
+    const { t } = (0, useTranslation_1.default)();
+    const navigation = (0, rn_ui_1.useNavigation)();
+    (0, react_1.useEffect)(() => {
+        navigation.setOptions({
+            title: t('groupChatMember') + '(' + groupMemberList.length + ')',
+        });
+    }, [t, navigation, groupMemberList.length]);
+    const listLineComponent = groupMemberList.length === 0 ? null : <react_native_1.View style={styles.listLine}/>;
+    const itemSeparatorComponent = () => <react_native_1.View style={[styles.separator]}/>;
+    const keyExtractor = (member) => member.userId;
+    const renderItem = ({ item }) => {
+        const { userId, chatGroupId, memberName, memberLevel, } = item;
+        const adminSource = memberLevel === OWNER ? default_assets_1.defaultAvatars.GROUP_OWNER : memberLevel === MGR ? default_assets_1.defaultAvatars.GROUP_MGR : null;
+        return (<react_native_1.TouchableOpacity activeOpacity={0.5} style={styles.row} onPress={() => {
+                // onPressUserAvatars && onPressUserAvatars(userId)
+                navigation.navigate('UserDetail', {
+                    userId: userId,
+                });
+            }} onLongPress={() => {
+                // if (!isMgr) {
+                //     return;
+                // }
+                //
+                // if (!imGroupId || !memberLevel || memberLevel === OWNER) {
+                //     return;
+                // }
+                //
+                // onLongPressUserAvatars && onLongPressUserAvatars({
+                //     imGroupId,
+                //     userId,
+                //     userName:memberName,
+                //     memberLevel,
+                // })
+            }}>
+                <ChatAvatar_1.default id={userId} disabled size={(0, rn_ui_1.dp)(40)} name={memberName}/>
+                <react_native_1.View style={styles.w15}/>
+                <react_native_1.View>
+                    <react_native_1.Text style={styles.userName} numberOfLines={1}>{memberName}</react_native_1.Text>
+                </react_native_1.View>
+                {adminSource &&
+                <react_native_1.Image source={adminSource} style={styles.admin} resizeMode={'contain'}/>}
+            </react_native_1.TouchableOpacity>);
+    };
+    const list = (0, react_1.useMemo)(() => {
+        return groupMemberList.slice().reverse().filter((item) => {
+            if (keyword) {
+                return item.memberName.indexOf(keyword) > -1;
+            }
+            return true;
+        });
+    }, [groupMemberList, keyword]);
+    return (<rn_ui_1.NavigationPage noPadding>
+            <rn_ui_1.SearchInput value={keyword} onChange={(txt) => {
+            setKeyword(txt);
+        }}/>
+            <react_native_1.FlatList contentContainerStyle={styles.list} ItemSeparatorComponent={itemSeparatorComponent} ListHeaderComponent={listLineComponent} ListFooterComponent={listLineComponent} numColumns={1} initialNumToRender={15} data={list} keyboardShouldPersistTaps={'handled'} keyExtractor={keyExtractor} renderItem={renderItem}/>
+        </rn_ui_1.NavigationPage>);
+};
+const styles = react_native_1.StyleSheet.create({
+    moreMember: {
+        backgroundColor: '#fff',
+        flex: 1
+    },
+    list: {
+        backgroundColor: '#fff',
+        borderColor: '#eeeeee'
+    },
+    search: Object.assign({ backgroundColor: '#eee' }, styles_1.shadowStyle),
+    heightSpace: {
+        height: (0, rn_ui_1.dp)(5)
+    },
+    row: {
+        paddingHorizontal: (0, rn_ui_1.dp)(15),
+        flexDirection: 'row',
+        alignItems: 'center',
+        height: (0, rn_ui_1.dp)(50)
+    },
+    listLine: {
+        marginVertical: 5,
+        height: (0, rn_ui_1.dp)(1),
+        backgroundColor: '#ececec'
+    },
+    separator: {
+        marginLeft: (0, rn_ui_1.dp)(75),
+        marginVertical: (0, rn_ui_1.dp)(5),
+        height: (0, rn_ui_1.dp)(1),
+        backgroundColor: '#ececec'
+    },
+    w15: {
+        width: (0, rn_ui_1.dp)(15),
+    },
+    admin: {
+        height: (0, rn_ui_1.dp)(18),
+        width: (0, rn_ui_1.dp)(18),
+        right: (15),
+        position: 'absolute',
+    },
+    userName: {
+        width: (0, rn_ui_1.dp)(230),
+        color: '#333',
+        lineHeight: (0, rn_ui_1.dp)(20),
+        fontSize: (0, rn_ui_1.dp)(15),
+    },
+});
+exports.default = OptionGroupMoreMember;

package/dist/pages/conversation/setting/OptionGroupNameOrNoticeEdit.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { NativeStackScreenProps } from "@react-navigation/native-stack/lib/typescript/src/types";
+import { IMPageParamList } from "../../../pages";
+type OptionGroupNameOrNoticeEditProps = NativeStackScreenProps<IMPageParamList, 'OptionGroupNameOrNoticeEdit'>;
+declare const OptionGroupNameOrNoticeEditPage: React.NamedExoticComponent<OptionGroupNameOrNoticeEditProps>;
+export default OptionGroupNameOrNoticeEditPage;

package/dist/pages/conversation/setting/OptionGroupNameOrNoticeEdit.js

@@ -0,0 +1,149 @@
+"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) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        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 react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const useTranslation_1 = __importDefault(require("../../../hooks/useTranslation"));
+const im_base_1 = require("@smart-link/im-base");
+const rn_ui_1 = require("@smart-link/rn-ui");
+const useImSelector_1 = require("../../../hooks/useImSelector");
+const init_1 = require("../../../init");
+const { OWNER, MGR, MEMBER, } = im_base_1.MemberLevel;
+const OptionGroupNameEdit = (0, react_1.memo)(props => {
+    const { type, memberLevel, groupNameEdit, groupNoticeEdit, setGroupNameEdit, setGroupNoticeEdit, } = props;
+    const { t } = (0, useTranslation_1.default)();
+    console.log('OptionGroupNameEdit: ', props);
+    // @ts-ignore
+    const isOwner = memberLevel === OWNER || memberLevel === MGR;
+    if (type === 'groupNotice') {
+        return <react_native_1.ScrollView contentContainerStyle={styles.noticeContentContainerStyle}>
+            <react_native_1.View style={styles.noticeInput}>
+                <react_native_1.TextInput style={styles.textInput} autoFocus={isOwner} value={groupNoticeEdit} maxLength={1000} multiline={true} editable={isOwner} underlineColorAndroid='transparent' onChangeText={setGroupNoticeEdit}/>
+            </react_native_1.View>
+        </react_native_1.ScrollView>;
+    }
+    else {
+        return <react_native_1.ScrollView contentContainerStyle={styles.contentContainerStyle}>
+            <react_native_1.Text>{t('groupChatName')}:</react_native_1.Text>
+            <react_native_1.View style={styles.input}>
+                <react_native_1.TextInput autoFocus={isOwner} value={groupNameEdit} maxLength={120} editable={isOwner} returnKeyType={'done'} underlineColorAndroid='transparent' onChangeText={setGroupNameEdit} clearButtonMode={'while-editing'}/>
+            </react_native_1.View>
+        </react_native_1.ScrollView>;
+    }
+});
+const OptionGroupNameOrNoticeEditPage = (0, react_1.memo)(props => {
+    const { navigation, route: { params: { type } } } = props;
+    const { t } = (0, useTranslation_1.default)();
+    const { currentConversation } = (0, useImSelector_1.useConversation)();
+    const { groupNameEdit, groupNoticeEdit } = (0, useImSelector_1.useSetting)();
+    const imManager = (0, init_1.getImManager)();
+    console.log('OptionGroupNameOrNoticeEditPage', groupNameEdit, groupNoticeEdit);
+    if (!currentConversation) {
+        return null;
+    }
+    const isEditGroupName = type === 'groupName';
+    const setGroupNameEdit = (value) => {
+        imManager.store.dispatch(im_base_1.SettingActions.setGroupNameEdit(value));
+    };
+    const setGroupNoticeEdit = (value) => {
+        imManager.store.dispatch(im_base_1.SettingActions.setGroupNoticeEdit(value));
+    };
+    const { memberLevel } = currentConversation;
+    // console.log('OptionGroupNameOrNoticeEditPage', currentConversation, memberLevel)
+    (0, react_1.useEffect)(() => {
+        if (isEditGroupName) {
+            setGroupNameEdit(currentConversation.name);
+        }
+        else {
+            setGroupNoticeEdit(currentConversation.notice);
+        }
+        const confirm = () => __awaiter(void 0, void 0, void 0, function* () {
+            if (isEditGroupName) {
+                const toast = rn_ui_1.Toast.loading();
+                yield imManager.store.dispatch(im_base_1.SettingActions.updateChatGroupName(imManager));
+                toast.close();
+            }
+            else {
+                const toast = rn_ui_1.Toast.loading();
+                yield imManager.store.dispatch(im_base_1.SettingActions.updateChatGroupNotice());
+                toast.close();
+            }
+            react_native_1.Keyboard.dismiss();
+            navigation.pop();
+        });
+        navigation.setOptions({
+            title: isEditGroupName ? t('groupChatName') : t('groupNotice'),
+            headerRight: (memberLevel === MGR || memberLevel === OWNER) ? () => <react_native_1.TouchableOpacity style={{
+                    flexDirection: 'row',
+                    alignItems: 'center',
+                    padding: (0, rn_ui_1.dp)(8),
+                }} onPress={confirm}>
+                <react_native_1.Text style={{ color: '#fff', fontSize: (0, rn_ui_1.dp)(14) }}>{t('confirm')}</react_native_1.Text>
+            </react_native_1.TouchableOpacity> : undefined
+        });
+    }, [navigation, currentConversation, type, memberLevel]);
+    return (<rn_ui_1.NavigationPage noPadding>
+            <OptionGroupNameEdit type={type} setGroupNameEdit={setGroupNameEdit} setGroupNoticeEdit={setGroupNoticeEdit} groupNameEdit={groupNameEdit} groupNoticeEdit={groupNoticeEdit} memberLevel={memberLevel}/>
+        </rn_ui_1.NavigationPage>);
+});
+const styles = react_native_1.StyleSheet.create({
+    contentContainerStyle: {
+        padding: (0, rn_ui_1.dp)(15)
+    },
+    input: {
+        marginTop: (0, rn_ui_1.dp)(10),
+        padding: (0, rn_ui_1.dp)(8),
+        backgroundColor: '#fff',
+    },
+    noticeContentContainerStyle: {
+        margin: (0, rn_ui_1.dp)(15)
+    },
+    noticeInput: {
+        flex: 1,
+        backgroundColor: '#fff',
+    },
+    textInput: {
+        flex: 1,
+        padding: 10,
+        fontSize: (0, rn_ui_1.dp)(16),
+        minHeight: (0, rn_ui_1.dp)(400),
+        lineHeight: (0, rn_ui_1.dp)(20),
+        textAlignVertical: 'top',
+        color: '#000',
+    }
+});
+exports.default = OptionGroupNameOrNoticeEditPage;

package/dist/pages/conversation/setting/Setting.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { NativeStackScreenProps } from '@react-navigation/native-stack/lib/typescript/src/types';
+import { IMPageParamList } from '../../../pages';
+type ConversationSettingProps = NativeStackScreenProps<IMPageParamList, 'ConversationSetting'>;
+declare const ConversationSetting: ({ navigation }: ConversationSettingProps) => import("react").JSX.Element | null;
+export default ConversationSetting;

package/dist/pages/conversation/setting/Setting.js

@@ -0,0 +1,184 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const im_base_1 = require("@smart-link/im-base");
+const rn_ui_1 = require("@smart-link/rn-ui");
+const react_1 = require("react");
+const useImSelector_1 = require("../../../hooks/useImSelector");
+const useTranslation_1 = __importDefault(require("../../../hooks/useTranslation"));
+const OptionAvatars_1 = __importDefault(require("./OptionAvatars"));
+const OptionConversation_1 = __importDefault(require("./OptionConversation"));
+const common_action_sheet_1 = require("../../../utils/common-action-sheet");
+const init_1 = require("../../../init");
+const react_native_1 = require("react-native");
+const OptionGroup_1 = __importDefault(require("../../../pages/conversation/setting/OptionGroup"));
+const OptionCancelGroup_1 = __importDefault(require("../../../pages/conversation/setting/OptionCancelGroup"));
+const contact_slice_1 = require("../../../slice/contact/contact.slice");
+const native_1 = require("@react-navigation/native");
+const { MEMBER, MGR, OWNER } = im_base_1.MemberLevel;
+const { LIAISON } = im_base_1.GroupType;
+// 最大显示人数
+const MAX_SHOW_MEMBER_COUNT = 23;
+const ConversationSetting = ({ navigation }) => {
+    var _a;
+    const { t } = (0, useTranslation_1.default)();
+    const { currentConversation } = (0, useImSelector_1.useConversation)();
+    const { groupDetail } = (0, useImSelector_1.useChatGroup)();
+    const title = t('chatSetting');
+    // 设置标题
+    (0, react_1.useEffect)(() => {
+        let newTitle = title;
+        if ((currentConversation === null || currentConversation === void 0 ? void 0 : currentConversation.type) === im_base_1.ConversationType.C2G && (currentConversation === null || currentConversation === void 0 ? void 0 : currentConversation.memberTotalCount)) {
+            newTitle += `(${currentConversation.memberTotalCount})`;
+        }
+        navigation.setOptions({
+            title: newTitle,
+        });
+    }, [title, navigation, currentConversation]);
+    if (!currentConversation) {
+        return null;
+    }
+    const imManager = (0, init_1.getImManager)();
+    const settingEnableNoDisturb = (value) => {
+        imManager.store.dispatch(im_base_1.ConversationActions.settingEnableNoDisturb(imManager, value));
+    };
+    const settingEnableTop = (value) => {
+        imManager.store.dispatch(im_base_1.ConversationActions.settingEnableTop(imManager, value));
+    };
+    const toSearchMessage = () => {
+        navigation.navigate('SearchChatRecords', {
+            conversation: currentConversation,
+        });
+    };
+    const clearMessage = () => {
+        (0, common_action_sheet_1.ConfirmActionSheet)(t('clearChatRecords'), () => {
+            imManager.clearMessages(currentConversation.id);
+        }, t);
+    };
+    const { id, type, name, avatars, enableNoDisturb = 'off', enableTop = 'off', notice = '', enableInviteValidate = 'off', memberLevel = MEMBER, memberTotalCount = 0, groupType, } = currentConversation;
+    const groupMemberList = (_a = groupDetail === null || groupDetail === void 0 ? void 0 : groupDetail.groupMemberList.slice().reverse()) !== null && _a !== void 0 ? _a : [];
+    console.log('type: ', type, '[memberLevel]', memberLevel);
+    const isMgr = memberLevel === MGR || memberLevel === OWNER;
+    // 离开群组
+    const leaveGroup = () => {
+        (0, common_action_sheet_1.ConfirmActionSheets)({
+            title: t('leaveGroup'),
+            confirm: () => {
+                imManager.store.dispatch(im_base_1.ConversationActions.doLeaveGroup(imManager, { chatGroupId: id }, () => {
+                    navigation.dispatch(native_1.StackActions.popToTop());
+                }, () => {
+                    rn_ui_1.Toast.error(t('leaveGroupFail'));
+                }));
+            },
+            t,
+        });
+    };
+    // 编辑群组名称或群组公告
+    const toEditGroupNameOrNotice = (type) => {
+        navigation.navigate('OptionGroupNameOrNoticeEdit', { type });
+    };
+    // 群组转让
+    const toGroupTransfer = () => {
+        // navigation.navigate('OptionGroupTransferPage');
+    };
+    // 群组管理
+    const toGroupMgr = () => {
+        navigation.navigate('OptionGroupManage');
+    };
+    // 设置聊天背景
+    const toImageBackground = () => {
+        navigation.navigate('SettingChatBg');
+    };
+    // 文件管理
+    const toSearchFile = () => {
+        navigation.navigate('SearchFile', { conversationId: id });
+    };
+    // 图片管理
+    const toSearchPicture = () => {
+        navigation.navigate('SearchPicturePage', { conversationId: id });
+    };
+    // 搜索管理
+    const toSearchManagePage = () => {
+        navigation.navigate('SearchManager', {
+            conversation: currentConversation,
+        });
+    };
+    // 群组设置
+    const removeUser = () => {
+        navigation.navigate('ChooseMember', {
+            removeMember: true,
+        });
+    };
+    let content = null;
+    switch (type) {
+        case im_base_1.ConversationType.C2C:
+            content = (<>
+                    <OptionAvatars_1.default list={id ? [
+                    {
+                        userId: id,
+                        userName: name,
+                        avatars,
+                    },
+                ] : []} showAdd={true} showDelete={false} showMore={false} addUser={() => {
+                    (0, init_1.getImManager)().store.dispatch((0, contact_slice_1.startCreateGroup)());
+                    navigation.navigate('ChooseContact', {
+                        chooseOrg: true,
+                        checkMode: 'multi',
+                        checkedIds: [id],
+                    });
+                }}/>
+                    <rn_ui_1.Space size={'m'}/>
+                    <OptionConversation_1.default enableNoDisturb={enableNoDisturb} enableTop={enableTop} settingEnableNoDisturb={settingEnableNoDisturb} settingEnableTop={settingEnableTop} toImageBackground={toImageBackground} clearMessage={clearMessage} toSearchMessage={toSearchMessage} showBackgroundSetting toSearchFile={toSearchFile} toSearchPicture={toSearchPicture} toSearchManagePage={toSearchManagePage}/>
+                    <rn_ui_1.Space size={'m'}/>
+                </>);
+            break;
+        case im_base_1.ConversationType.C2G:
+            const avatarList = groupMemberList
+                .map(item => {
+                var _a;
+                return {
+                    userId: item.userId,
+                    userName: (_a = item.memberName) !== null && _a !== void 0 ? _a : '',
+                    avatars: item.memberAvatars,
+                    memberLevel: item.memberLevel,
+                };
+            })
+                .splice(0, MAX_SHOW_MEMBER_COUNT);
+            content = (<>
+                    <OptionAvatars_1.default list={avatarList} showTitle showAdd showMore={isMgr ? avatarList.length > 8 : avatarList.length > 9} isMgr={isMgr} addUser={() => {
+                    // 添加成员
+                    (0, init_1.getImManager)().store.dispatch((0, contact_slice_1.startAddMember)());
+                    navigation.navigate('ChooseContact', {
+                        chooseOrg: true,
+                        checkMode: 'multi',
+                    });
+                }} removeUser={removeUser} toMoreMember={() => {
+                    navigation.navigate('OptionGroupMoreMember');
+                }}/>
+                    <rn_ui_1.Space size={'m'}/>
+                    <OptionGroup_1.default id={id} name={name} memberLevel={memberLevel} avatars={avatars} notice={notice} enableInviteValidate={enableInviteValidate} toEditGroupName={() => toEditGroupNameOrNotice('groupName')} toEditGroupNotice={() => toEditGroupNameOrNotice('groupNotice')} toGroupMgr={toGroupMgr}/>
+                    <rn_ui_1.Space size={'m'}/>
+                    <OptionConversation_1.default enableNoDisturb={enableNoDisturb} enableTop={enableTop} settingEnableNoDisturb={settingEnableNoDisturb} settingEnableTop={settingEnableTop} toImageBackground={toImageBackground} clearMessage={clearMessage} toSearchMessage={toSearchMessage} toSearchFile={toSearchFile} toSearchPicture={toSearchPicture} toSearchManagePage={toSearchManagePage}/>
+                    <rn_ui_1.Space size={'m'}/>
+                    {groupType !== LIAISON && <OptionCancelGroup_1.default leaveGroup={leaveGroup}/>}
+                </>);
+            break;
+        case im_base_1.ConversationType.B2C:
+            content = (<OptionConversation_1.default enableNoDisturb={enableNoDisturb} enableTop={enableTop} showSearch={false} showBackgroundSetting={false} settingEnableNoDisturb={settingEnableNoDisturb} settingEnableTop={settingEnableTop} toImageBackground={toImageBackground} clearMessage={clearMessage} toSearchMessage={toSearchMessage}/>);
+            break;
+        default:
+            break;
+    }
+    return (<rn_ui_1.NavigationPage scroll noPadding>
+            <rn_ui_1.Space size="m"/>
+            {content}
+        </rn_ui_1.NavigationPage>);
+};
+const styles = react_native_1.StyleSheet.create({
+    setting: {
+        paddingVertical: (0, rn_ui_1.dp)(15),
+    },
+});
+exports.default = ConversationSetting;

package/dist/pages/conversation/setting/SettingChatBg.d.ts

@@ -0,0 +1,6 @@
+import { IMPageParamList } from '../../../pages/types';
+import { NativeStackScreenProps } from '@react-navigation/native-stack';
+import React from 'react';
+export type SettingChatBgProps = NativeStackScreenProps<IMPageParamList, 'SettingChatBg'>;
+declare const SettingChatBg: React.FC<SettingChatBgProps>;
+export default SettingChatBg;

package/dist/pages/conversation/setting/SettingChatBg.js

@@ -0,0 +1,95 @@
+"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) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        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 useImSelector_1 = require("../../../hooks/useImSelector");
+const useTranslation_1 = __importDefault(require("../../../hooks/useTranslation"));
+const init_1 = require("../../../init");
+const upload_1 = __importDefault(require("../../../utils/upload"));
+const native_1 = require("@react-navigation/native");
+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_image_crop_picker_1 = __importDefault(require("react-native-image-crop-picker"));
+const SettingChatBg = ({ navigation }) => {
+    const { t } = (0, useTranslation_1.default)();
+    const { currentConversation } = (0, useImSelector_1.useConversation)();
+    (0, react_1.useEffect)(() => {
+        navigation.setOptions({ title: t('selectChatBackground') });
+    }, [navigation, t]);
+    const openAlbum = () => __awaiter(void 0, void 0, void 0, function* () {
+        let toast;
+        try {
+            const image = yield react_native_image_crop_picker_1.default.openPicker({
+                mediaType: 'photo',
+                multiple: false,
+                compressImageQuality: 0.7,
+                compressImageMaxWidth: 1080,
+            });
+            toast = rn_ui_1.Toast.loading();
+            const fileId = yield (0, upload_1.default)(image.path, image.mime);
+            yield (0, im_base_1.updateOptionSetting)({
+                type: currentConversation === null || currentConversation === void 0 ? void 0 : currentConversation.type,
+                conversationId: currentConversation.id,
+                optionKey: 'imageBackground',
+                optionValue: fileId,
+            });
+            const imManager = (0, init_1.getImManager)();
+            imManager.store.dispatch(im_base_1.ConversationActions.setCurrentConversation(Object.assign(Object.assign({}, currentConversation), { imageBackground: fileId })));
+            imManager.store.dispatch(im_base_1.ConversationActions.updateConversation({
+                id: currentConversation.id,
+                imageBackground: fileId,
+            }));
+            // 更新本地资源存储
+            yield imManager.updateResource({
+                url: fileId,
+                localPath: image.path,
+            });
+            toast.close();
+            navigation.dispatch(native_1.StackActions.pop(2));
+        }
+        catch (e) {
+            console.log(e);
+            toast === null || toast === void 0 ? void 0 : toast.close();
+            rn_ui_1.Toast.error(t('settingFail'));
+        }
+    });
+    return (<rn_ui_1.NavigationPage noPadding>
+            <rn_ui_1.Space size="m"/>
+            <rn_ui_1.ListRow title={t('chooseFromAlbum')} onPress={openAlbum} accessory="none"/>
+        </rn_ui_1.NavigationPage>);
+};
+exports.default = SettingChatBg;

package/dist/pages/index.d.ts

@@ -0,0 +1,8 @@
+import { conversationRoutes } from './conversation/conversation.routes';
+import { messageRoutes } from './message/message.routes';
+import { searchRoutes } from './search/search.routes';
+import { collectRoutes } from './collection/collection.routes';
+import addressListRoutes from './address-list/addressList.routes';
+export type ImRoute = (typeof conversationRoutes)[number] | (typeof messageRoutes)[number] | (typeof searchRoutes)[number] | (typeof collectRoutes)[number] | (typeof addressListRoutes)[number];
+export declare const imRoutes: ImRoute[];
+export * from './types';