This is an automated email from the ASF dual-hosted git repository. imbajin pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/hugegraph-toolchain.git
commit 49a660f58e6eebb14de9557061f5d08dc60faba4 Author: dark <[email protected]> AuthorDate: Fri Aug 14 12:39:02 2026 +0800 fix(task): clarify task detail presentation --- .../src/pages/TaskDetail/index.module.scss | 29 ++++++++++++++++++ .../pages/TaskDetail/task-detail-layout.test.js | 34 ++++++++++++++++++++++ .../pages/TaskDetail/task-detail-recovery.test.js | 15 ++++++++-- 3 files changed, 75 insertions(+), 3 deletions(-) diff --git a/hugegraph-hubble/hubble-fe/src/pages/TaskDetail/index.module.scss b/hugegraph-hubble/hubble-fe/src/pages/TaskDetail/index.module.scss new file mode 100644 index 000000000..dd8ca88cb --- /dev/null +++ b/hugegraph-hubble/hubble-fe/src/pages/TaskDetail/index.module.scss @@ -0,0 +1,29 @@ +/*! + * + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with this + * work for additional information regarding copyright ownership. The ASF + * licenses this file to You under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT + * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the + * License for the specific language governing permissions and limitations + * under the License. + */ + +.task_detail_table { + :global(.ant-table-cell) { + white-space: nowrap; + } +} + +.no_wrap { + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} diff --git a/hugegraph-hubble/hubble-fe/src/pages/TaskDetail/task-detail-layout.test.js b/hugegraph-hubble/hubble-fe/src/pages/TaskDetail/task-detail-layout.test.js new file mode 100644 index 000000000..ee288fc3a --- /dev/null +++ b/hugegraph-hubble/hubble-fe/src/pages/TaskDetail/task-detail-layout.test.js @@ -0,0 +1,34 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import fs from 'fs'; +import path from 'path'; + +const component = fs.readFileSync(path.join(__dirname, 'index.js'), 'utf8'); +const stylesheet = fs.readFileSync(path.join(__dirname, 'index.module.scss'), 'utf8'); + +test('allocates stable single-line widths across the task detail table', () => { + expect(component).toContain('className={style.task_detail_table}'); + expect(component).toContain("scroll={{x: 'max-content'}}"); + expect(component.match(/className: style\.no_wrap/g)?.length).toBe(7); + expect(component.match(/ellipsis: true/g)?.length).toBe(6); + expect(component).toContain('width: 240'); + expect(component).not.toContain('width: 400'); + expect(stylesheet).toMatch( + /\.task_detail_table\s*\{[\s\S]*\.ant-table-cell[\s\S]*white-space:\s*nowrap/ + ); +}); diff --git a/hugegraph-hubble/hubble-fe/src/pages/TaskDetail/task-detail-recovery.test.js b/hugegraph-hubble/hubble-fe/src/pages/TaskDetail/task-detail-recovery.test.js index c520ee396..d7e8c780e 100644 --- a/hugegraph-hubble/hubble-fe/src/pages/TaskDetail/task-detail-recovery.test.js +++ b/hugegraph-hubble/hubble-fe/src/pages/TaskDetail/task-detail-recovery.test.js @@ -26,9 +26,6 @@ jest.mock('../../api', () => ({manage: {getJobsList: jest.fn()}})); jest.mock('../../components/DataPreparationNav', () => () => ( <nav aria-label='Data preparation journey' /> )); -jest.mock('../../components/Status', () => ({ - StatusField: ({status}) => <span>{status}</span>, -})); jest.mock('react-router-dom', () => ({ useNavigate: () => jest.fn(), useParams: () => ({taskid: mockTaskId}), @@ -45,6 +42,16 @@ jest.mock('react-i18next', () => ({ 'task.detail.duration': 'Duration', 'task.detail.status': 'Status', 'task.detail.other': 'Details', + 'task.status.pending': 'Pending', + 'task.status.running': 'Running', + 'task.status.success': 'Completed', + 'task.status.failed': 'Failed', + 'task.status.paused': 'Paused', + 'task.status.stopped': 'Stopped', + 'task.status.initializing': 'Initializing', + 'task.status.cancelling': 'Cancelling', + 'task.status.cancelled': 'Cancelled', + 'task.status.unknown': 'Unknown', 'task.detail.records_per_second': `${values?.rate} records/s`, 'task.detail.seconds': `${values?.seconds} s`, })[key] || key}), @@ -87,6 +94,8 @@ it('uses the import-task title and recovers a failed run list', async () => { fireEvent.click(screen.getByRole('button', {name: 'Retry task runs'})); await waitFor(() => expect(screen.getByText('7')).toBeInTheDocument()); + expect(screen.getByText('Completed')).toBeInTheDocument(); + expect(screen.queryByText('SUCCEED')).not.toBeInTheDocument(); expect(screen.queryByRole('alert')).not.toBeInTheDocument(); });
