修复群邀请消息卡片丢弃"立即加入"按钮,被邀请人无法接受邀请

根因:POST /groups/{topic}/invitations 邀请成功后,后端会往邀请人与被邀请人的
单聊会话里发一条 x-im-type=system_action、template=group_invitation_created 的
消息,content.actions 里带着真实可用的 {type:"group_invitation_accept",
label:"立即加入", target_id:<invitation_id>}(对照参考图 6.3 加入群聊.png)。但
chat-message.jsx 原来对所有 system_action/system_notice 消息一律只取
content.text 渲染成纯文本,这个 action 数据被整体丢弃,消息只显示"邀请你加入群聊。"
没有任何按钮——im-api.js 里封装好的 acceptGroupInvitation() 因此从来没有调用点。

怎么修:chat-message.jsx 在原有的文本兜底之前,单独识别 content.actions 里
type=="group_invitation_accept" 的这一种模板,渲染一张带按钮的小卡片(其余
system_action/system_notice 模板的纯文本渲染保持不变,不受影响);
messages-view.jsx 新增 handleAcceptGroupInvitation,调用 acceptGroupInvitation()
并用已有的 showToast 反馈结果,逐层传给 ChatMessage 的新 onAcceptGroupInvitation
prop。按钮点击后按 busy/joined/pending_approval/error 四态展示,避免重复提交。

验证:用两个真实账号(A 建群,直接对 B 发起 POST /invitations)复现,重新构建后
B 的会话里正确出现"邀请你加入群聊。"+"立即加入"按钮;点击后正确调用
POST /group-invitations/{id}/accept 并把返回的失败原因("服务器繁忙,请稍后重试")
展示出来——这一步暴露了一个独立的后端 500 bug(accept 接口本身的实现有问题,
已记录在测试报告里,不在本次前端修复范围内),前端的请求发起、按钮状态机和错误展示
均已确认按预期工作。

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Your Name
2026-09-06 13:26:14 +08:00
co-authored by Claude Sonnet 5
parent a6014b84ee
commit cdca509183
10 changed files with 240 additions and 22 deletions
+38 -9
View File
@@ -6373,7 +6373,10 @@ function Register({
error: errors.invite,
autoCapitalize: "off",
autoCorrect: "off"
}, void 0, false), (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxDEV)("button", {
}, void 0, false), !usingPhone ? (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxDEV)("p", {
className: "auth-help",
children: "未绑定手机号无法自助找回密码,忘记密码后只能联系企业管理员重置"
}, void 0, false) : null, (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxDEV)("button", {
className: "auth-primary",
type: "submit",
disabled: !form.username && !form.phone || !form.password || !agreed || submitting,
@@ -6644,6 +6647,10 @@ function Realname({
});
setStatus(data.status || 'pending');
setError('');
(0,_lib_im_api_js__WEBPACK_IMPORTED_MODULE_3__.getRealnameStatus)().then(fresh => {
if (fresh.masked_name) setMaskedName(fresh.masked_name);
if (fresh.masked_id_number) setMaskedIdNumber(fresh.masked_id_number);
}).catch(() => {});
} catch (err) {
setError(err.message || '提交失败,请稍后重试');
} finally {
@@ -15653,11 +15660,6 @@ function SettingsList({
pending: '审核中',
rejected: '未通过'
}[realnameStatus] || '未认证';
const logout = () => {
if (window.confirm('确定要退出当前登录吗?')) {
onLogout ? onLogout() : onToast('当前环境不支持退出登录');
}
};
return (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxDEV)("div", {
className: "personal-page",
children: [(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxDEV)(Header, {
@@ -15712,7 +15714,7 @@ function SettingsList({
}, void 0, false), (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxDEV)("button", {
type: "button",
className: "personal-logout",
onClick: logout,
onClick: () => setSheet('logout'),
children: "退出当前登录"
}, void 0, false)]
}, void 0, true), sheet === 'cache' ? (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxDEV)(CacheClear, {
@@ -15727,6 +15729,10 @@ function SettingsList({
onToast: onToast,
onDeleteAccount: onDeleteAccount,
onClose: () => setSheet(null)
}, void 0, false) : null, sheet === 'logout' ? (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxDEV)(LogoutConfirm, {
onToast: onToast,
onLogout: onLogout,
onClose: () => setSheet(null)
}, void 0, false) : null]
}, void 0, true);
}
@@ -15768,6 +15774,23 @@ function ConfirmSheet({
}, void 0, true)
}, void 0, false);
}
function LogoutConfirm({
onLogout,
onToast,
onClose
}) {
const confirm = () => {
onClose();
onLogout ? onLogout() : onToast('当前环境不支持退出登录');
};
return (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxDEV)(ConfirmSheet, {
icon: "logout",
title: "退出登录",
body: "确定要退出当前登录吗?",
onConfirm: confirm,
onCancel: onClose
}, void 0, false);
}
function CacheClear({
onToast,
onClose
@@ -19008,7 +19031,7 @@ class TinodeWeb extends (react__WEBPACK_IMPORTED_MODULE_0___default().Component)
return this.tinode.createAccountBasic(login_, password_, {
public: public_,
tags: tags_,
cred: tinode_sdk__WEBPACK_IMPORTED_MODULE_4__.Tinode.credential(cred_),
cred: cred_ ? tinode_sdk__WEBPACK_IMPORTED_MODULE_4__.Tinode.credential(cred_) : undefined,
attachments: attachments
});
}).then(ctrl => {
@@ -21178,7 +21201,7 @@ function MeetingDetail({
const respond = response => {
setBusy(true);
(0,_lib_im_api_js__WEBPACK_IMPORTED_MODULE_3__.getMeeting)(meeting.meeting_id).then(fresh => (0,_lib_im_api_js__WEBPACK_IMPORTED_MODULE_3__.respondMeeting)(fresh.meeting_id, response, fresh.version)).then(_ => {
onToast(RESPONSE_LABEL[response] ? `已${RESPONSE_LABEL[response]}` : '已回应');
onToast(response === 'accepted' ? '已接受会议邀请' : response === 'declined' ? '已拒绝会议邀请' : '已标记为待定');
load();
}).catch(err => onToast(err.message || '操作失败')).finally(() => setBusy(false));
};
@@ -21278,6 +21301,12 @@ function MeetingDetail({
}, void 0, false), (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxDEV)("small", {
children: "已拒绝"
}, void 0, false)]
}, void 0, true), (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxDEV)("span", {
children: [(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxDEV)("b", {
children: counts.tentative
}, void 0, false), (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxDEV)("small", {
children: "待定"
}, void 0, false)]
}, void 0, true)]
}, void 0, true), (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxDEV)("footer", {
children: [meeting.permissions && meeting.permissions.can_remind ? (0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxDEV)("button", {