This is an automated email from the ASF dual-hosted git repository.
lizhimins pushed a commit to branch rocketmq-studio
in repository https://gitbox.apache.org/repos/asf/rocketmq-dashboard.git
The following commit(s) were added to refs/heads/rocketmq-studio by this push:
new 504329d4 fix(ui): handle messages without tags or keys (#1329)
504329d4 is described below
commit 504329d4ad9fc9f54df9c9321ded306a242ee4c9
Author: 0 <[email protected]>
AuthorDate: Mon Aug 10 20:38:58 2026 +0800
fix(ui): handle messages without tags or keys (#1329)
---
web/src/api/message.ts | 4 ++--
.../pages/instance/__tests__/MessagePage.test.tsx | 25 +++++++++++++++++++++-
web/src/pages/instance/message.tsx | 10 +++++----
3 files changed, 32 insertions(+), 7 deletions(-)
diff --git a/web/src/api/message.ts b/web/src/api/message.ts
index 704d5e32..cffbd5c3 100644
--- a/web/src/api/message.ts
+++ b/web/src/api/message.ts
@@ -4,8 +4,8 @@ import client from './client';
export interface MessageRecord {
msgId: string;
topic: string;
- tag: string;
- key: string;
+ tag: string | null;
+ key: string | null;
body: string;
storeTime: number | string;
bornHost: string;
diff --git a/web/src/pages/instance/__tests__/MessagePage.test.tsx
b/web/src/pages/instance/__tests__/MessagePage.test.tsx
index 08882926..04132861 100644
--- a/web/src/pages/instance/__tests__/MessagePage.test.tsx
+++ b/web/src/pages/instance/__tests__/MessagePage.test.tsx
@@ -21,6 +21,7 @@ import userEvent from '@testing-library/user-event';
import type React from 'react';
import { MemoryRouter } from 'react-router-dom';
import { afterEach, beforeAll, beforeEach, describe, expect, it, vi } from
'vitest';
+import type { MessageRecord } from '../../../api/message';
import { LangProvider } from '../../../i18n/LangContext';
const messageServiceMocks = vi.hoisted(() => ({
@@ -49,7 +50,7 @@ vi.mock('../../../services/topicService', () => ({
import MessagePage from '../message';
-const createMessage = (msgId: string) => ({
+const createMessage = (msgId: string): MessageRecord => ({
msgId,
topic: `topic-${msgId}`,
tag: 'tag',
@@ -290,4 +291,26 @@ describe('Message page query history', () => {
).toBeInTheDocument();
expect(screen.queryByText(/消费验证成功/)).not.toBeInTheDocument();
});
+
+ it('sorts and renders messages without tags or keys', async () => {
+ const user = userEvent.setup();
+ messageServiceMocks.queryMessages.mockResolvedValue([
+ { ...createMessage('MID-NULL-FIELDS'), tag: null, key: null },
+ { ...createMessage('MID-FULL-FIELDS'), tag: 'vip', key: 'order-001' },
+ ]);
+ renderWithProviders(<MessagePage />);
+
+ await user.click(screen.getByText('按 Message ID'));
+ await user.type(screen.getByPlaceholderText('输入 Message ID'), 'MID');
+ await user.click(screen.getByRole('button', { name: /^search查询$/ }));
+
+ expect(await screen.findByText('MID-NULL-FIELDS')).toBeInTheDocument();
+ expect(screen.getByText('MID-FULL-FIELDS')).toBeInTheDocument();
+ expect(screen.getAllByText('-')).toHaveLength(2);
+
+ await user.click(screen.getByRole('columnheader', { name: /Tag/ }));
+ expect(screen.getByText('MID-NULL-FIELDS')).toBeInTheDocument();
+ await user.click(screen.getByRole('columnheader', { name: /Key/ }));
+ expect(screen.getByText('MID-FULL-FIELDS')).toBeInTheDocument();
+ });
});
diff --git a/web/src/pages/instance/message.tsx
b/web/src/pages/instance/message.tsx
index 8608f967..83cb5f2e 100644
--- a/web/src/pages/instance/message.tsx
+++ b/web/src/pages/instance/message.tsx
@@ -441,16 +441,18 @@ const MessagePage = () => {
dataIndex: 'tag',
key: 'tag',
width: 80,
- sorter: (a, b) => a.tag.localeCompare(b.tag),
- render: (tag: string) => <Tag>{tag}</Tag>,
+ sorter: (a, b) => (a.tag ?? '').localeCompare(b.tag ?? ''),
+ render: (tag: string | null) => <Tag>{tag || '-'}</Tag>,
},
{
title: 'Key',
dataIndex: 'key',
key: 'key',
width: 120,
- sorter: (a, b) => a.key.localeCompare(b.key),
- render: (key: string) => <span style={{ fontFamily: 'monospace',
fontSize: 13 }}>{key}</span>,
+ sorter: (a, b) => (a.key ?? '').localeCompare(b.key ?? ''),
+ render: (key: string | null) => (
+ <span style={{ fontFamily: 'monospace', fontSize: 13 }}>{key ||
'-'}</span>
+ ),
},
{
title: 'Message ID',
