From 8e038431458e0531200be51bb630ab6ccb81f7c8 Mon Sep 17 00:00:00 2001
From: Jimmy Ben Klieve <j.b.klieve@live.cn>
Date: Wed, 7 Jan 2026 09:58:16 +0800
Subject: [PATCH] fix: task executor with status "timeout" corrupts page when
 checking its details (#12467)

### What problem does this PR solve?

In **Admin UI** > **Service Status**, clicking "Show details" on task
executor with status "Timeout" may corrupts page.

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)
---
 web/src/pages/admin/service-status.tsx       |  2 ++
 web/src/pages/admin/task-executor-detail.tsx | 10 ++++++++++
 2 files changed, 12 insertions(+)

diff --git a/web/src/pages/admin/service-status.tsx b/web/src/pages/admin/service-status.tsx
index c78cbb0d6..582b38cac 100644
--- a/web/src/pages/admin/service-status.tsx
+++ b/web/src/pages/admin/service-status.tsx
@@ -68,6 +68,8 @@ import {
 } from './utils';
 
 import JsonView from 'react18-json-view';
+import 'react18-json-view/src/style.css';
+
 import ServiceDetail from './service-detail';
 import TaskExecutorDetail from './task-executor-detail';
 
diff --git a/web/src/pages/admin/task-executor-detail.tsx b/web/src/pages/admin/task-executor-detail.tsx
index 55d2eef11..0adf6d4c0 100644
--- a/web/src/pages/admin/task-executor-detail.tsx
+++ b/web/src/pages/admin/task-executor-detail.tsx
@@ -1,5 +1,8 @@
 import dayjs from 'dayjs';
+import { isPlainObject } from 'lodash';
 import JsonView from 'react18-json-view';
+import 'react18-json-view/src/style.css';
+
 import {
   Bar,
   BarChart,
@@ -15,6 +18,7 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
 
 import { ScrollArea } from '@/components/ui/scroll-area';
 import { formatDate, formatTime } from '@/utils/date';
+import ServiceDetail from './service-detail';
 
 interface TaskExecutorDetailProps {
   content?: AdminService.TaskExecutorInfo;
@@ -68,9 +72,15 @@ function CustomAxisTick({ x, y, payload }: any) {
 }
 
 function TaskExecutorDetail({ content }: TaskExecutorDetailProps) {
+  if (!isPlainObject(content)) {
+    return <ServiceDetail content={content} />;
+  }
+
   return (
     <section className="space-y-8">
       {Object.entries(content ?? {}).map(([name, data]) => {
+        console.log(data);
+
         const items = data.map((x) => ({
           ...x,
           done: Math.floor(Math.random() * 100),