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 0655eff fix: load producer topics from Studio API response (#501)
0655eff is described below
commit 0655effa1b7994268b00b7080025ff020b04b487
Author: aias00 <[email protected]>
AuthorDate: Thu Jul 23 22:42:59 2026 -0700
fix: load producer topics from Studio API response (#501)
Fix Producer page topic list to read from Studio API new format
(data[].name) with backward compatibility for legacy topicList format.
---
web/src/api/producer.test.ts | 12 +++++++++++-
web/src/api/producer.ts | 14 ++++++++++++--
2 files changed, 23 insertions(+), 3 deletions(-)
diff --git a/web/src/api/producer.test.ts b/web/src/api/producer.test.ts
index c87fa07..b5b3f31 100644
--- a/web/src/api/producer.test.ts
+++ b/web/src/api/producer.test.ts
@@ -33,7 +33,17 @@ describe('Producer API', () => {
vi.unstubAllGlobals();
});
- it('fetches topic list sorted alphabetically', async () => {
+ it('fetches Studio topic records sorted alphabetically', async () => {
+ mock.onGet('/topics').reply(200, {
+ code: 200,
+ data: [{ name: 'order-events' }, { name: 'user-signup' }, { name:
'batch-process' }],
+ });
+
+ const result = await fetchTopicList();
+ expect(result).toEqual(['batch-process', 'order-events', 'user-signup']);
+ });
+
+ it('keeps compatibility with legacy topicList responses', async () => {
mock.onGet('/topics').reply(200, {
topicList: ['order-events', 'user-signup', 'batch-process'],
});
diff --git a/web/src/api/producer.ts b/web/src/api/producer.ts
index 80e76f5..26c31ab 100644
--- a/web/src/api/producer.ts
+++ b/web/src/api/producer.ts
@@ -25,12 +25,22 @@ export interface ProducerConnection {
versionDesc: string;
}
+interface TopicRecord {
+ name: string;
+}
+
+interface TopicListResponse {
+ data?: TopicRecord[];
+ topicList?: string[];
+}
+
// ─── API ────────────────────────────────────────────────────────
/** Fetch all topic names */
export async function fetchTopicList(): Promise<string[]> {
- const res = await client.get<{ topicList: string[] }>('/topics');
- return (res.data?.topicList ?? []).sort();
+ const res = await client.get<TopicListResponse>('/topics');
+ const topics = res.data.data?.map((topic) => topic.name) ??
res.data.topicList ?? [];
+ return topics.sort();
}
/** Query producer connections by topic and group */