From d49f8ad0808e3107b4363b5101650b500ce143b1 Mon Sep 17 00:00:00 2001 From: Zhaoxinxin <107842350+Liam-Zhao@users.noreply.github.com> Date: Mon, 19 May 2025 17:52:54 +0800 Subject: [PATCH] feat: click on the cluster name to view the cluster details (#525) * feat: click on the cluster name to view the cluster details Signed-off-by: zhaoxinxin <1186037180@qq.com> * feat: click on the cluster name to view the cluster details Signed-off-by: zhaoxinxin <1186037180@qq.com> * feat: click on the cluster name to view the cluster details Signed-off-by: zhaoxinxin <1186037180@qq.com> --------- Signed-off-by: zhaoxinxin <1186037180@qq.com> --- cypress/e2e/clusters/cluster.cy.ts | 8 ++--- cypress/e2e/clusters/clusters.cy.ts | 2 +- src/assets/images/cluster/id.svg | 14 +++++--- src/components/clusters/index.module.css | 3 +- src/components/clusters/index.tsx | 35 +++++++++---------- .../persistent-cache-task/cluster/index.tsx | 1 - 6 files changed, 31 insertions(+), 32 deletions(-) diff --git a/cypress/e2e/clusters/cluster.cy.ts b/cypress/e2e/clusters/cluster.cy.ts index dfa451a..d699754 100644 --- a/cypress/e2e/clusters/cluster.cy.ts +++ b/cypress/e2e/clusters/cluster.cy.ts @@ -413,7 +413,7 @@ describe('Cluster', () => { // Choose a cluster without scheduler and seed peer. cy.get('#cluster-name-10').should('be.visible').and('contain', 'cluster-10'); - cy.get('#show-cluster-10').click(); + cy.get('#cluster-name-10').click(); cy.get('#name').scrollIntoView(); @@ -466,7 +466,7 @@ describe('Cluster', () => { it('cluster cannot be deleted if scheduler and seed nodes exist in the cluster', () => { cy.get('#cluster-id-1').should('be.visible').and('contain', '1'); - cy.get('#show-cluster-1').click(); + cy.get('#cluster-name-1').click(); cy.get('#name').scrollIntoView().should('be.visible').and('contain', 'cluster-1'); @@ -532,7 +532,7 @@ describe('Cluster', () => { // Choose a cluster without scheduler and seed peer. cy.get('#cluster-name-10').should('be.visible').and('contain', 'cluster-10'); - cy.get('#show-cluster-10').click(); + cy.get('#cluster-name-10').click(); cy.get('#name').scrollIntoView().should('be.visible').and('contain', 'cluster-10'); @@ -575,7 +575,7 @@ describe('Cluster', () => { // The cluster name should be cluster-10. cy.get('#cluster-name-10').should('be.visible').and('contain', 'cluster-10'); - cy.get('#show-cluster-10').click(); + cy.get('#cluster-name-10').click(); cy.get('#name').scrollIntoView().should('be.visible').and('contain', 'cluster-10'); diff --git a/cypress/e2e/clusters/clusters.cy.ts b/cypress/e2e/clusters/clusters.cy.ts index bb43947..247d7b1 100644 --- a/cypress/e2e/clusters/clusters.cy.ts +++ b/cypress/e2e/clusters/clusters.cy.ts @@ -276,7 +276,7 @@ describe('Clusters', () => { cy.get('#cluster-name-8').should('be.visible').and('contain', 'cluster-8'); // Go to show cluster page. - cy.get('#show-cluster-8').click(); + cy.get('#cluster-name-8').click(); // Then I see that the current page is the show cluster. cy.url().should('include', '/clusters/8'); diff --git a/src/assets/images/cluster/id.svg b/src/assets/images/cluster/id.svg index 068d743..b3b2178 100644 --- a/src/assets/images/cluster/id.svg +++ b/src/assets/images/cluster/id.svg @@ -1,6 +1,10 @@ - - + + + + + + \ No newline at end of file diff --git a/src/components/clusters/index.module.css b/src/components/clusters/index.module.css index 22f9f16..ad8bc1a 100644 --- a/src/components/clusters/index.module.css +++ b/src/components/clusters/index.module.css @@ -121,7 +121,7 @@ .idText { color: var(--palette-table-title-text-color); - padding-left: 0.4rem; + padding-left: 0.6rem; } .idIcon { @@ -138,7 +138,6 @@ .creatTimeContainer { display: flex; justify-content: space-between; - align-items: center; margin-top: 1rem; } diff --git a/src/components/clusters/index.tsx b/src/components/clusters/index.tsx index 7b60212..3c1c0f1 100644 --- a/src/components/clusters/index.tsx +++ b/src/components/clusters/index.tsx @@ -4,17 +4,16 @@ import { Button, Chip, Grid, - IconButton, Pagination, Paper, Skeleton, Snackbar, Tooltip, Typography, - Stack, Autocomplete, TextField, Divider, + Link as RouterLink, } from '@mui/material'; import { getSchedulers, @@ -30,7 +29,7 @@ import styles from './index.module.css'; import { useCallback, useEffect, useMemo, useState } from 'react'; import { fuzzySearch, getDatetime, getPaginatedList, useQuery } from '../../lib/utils'; import MoreTimeIcon from '@mui/icons-material/MoreTime'; -import { useLocation, useNavigate } from 'react-router-dom'; +import { Link, useLocation, useNavigate } from 'react-router-dom'; import { MAX_PAGE_SIZE } from '../../lib/constants'; import Card from '../card'; import debounce from 'lodash/debounce'; @@ -42,7 +41,6 @@ import { ReactComponent as Active } from '../../assets/images/cluster/active.svg import { ReactComponent as ClusterID } from '../../assets/images/cluster/id.svg'; import { ReactComponent as IcContent } from '../../assets/images/cluster/scheduler/ic-content.svg'; import { ReactComponent as NoCluster } from '../../assets/images/cluster/no-cluster.svg'; -import { ReactComponent as ArrowCircleRightIcon } from '../../assets/images/cluster/arrow-circle-right.svg'; import { ReactComponent as Cluster } from '../../assets/images/cluster/cluster.svg'; import { ReactComponent as Scheduler } from '../../assets/images/cluster/scheduler.svg'; import { ReactComponent as SeedPeer } from '../../assets/images/cluster/seed-peer.svg'; @@ -375,7 +373,7 @@ export default function Clusters() { - + @@ -419,20 +417,28 @@ export default function Clusters() { allClusters.map((item) => ( - + - + {item.id} - - {item.name} - + + + {item.name} + + {item.bio || '-'} @@ -464,15 +470,6 @@ export default function Clusters() { variant="outlined" size="small" /> - { - navigate(`/clusters/${item.id}`); - }} - > - - diff --git a/src/components/resource/persistent-cache-task/cluster/index.tsx b/src/components/resource/persistent-cache-task/cluster/index.tsx index 7944667..21c93bb 100644 --- a/src/components/resource/persistent-cache-task/cluster/index.tsx +++ b/src/components/resource/persistent-cache-task/cluster/index.tsx @@ -331,7 +331,6 @@ export default function PersistentCacheTask() { }`} -