Skip to content

Commit 66ba235

Browse files
jjzhang332yingxuan
andauthored
chore: change theme color && optimize alert style && add empty display (#618)
Signed-off-by: yingxuan <zhanglujia.zlj@digital-engine.com> Co-authored-by: yingxuan <zhanglujia.zlj@digital-engine.com>
1 parent c0bd358 commit 66ba235

File tree

24 files changed

+204
-90
lines changed

24 files changed

+204
-90
lines changed

cypress/e2e/clusters/clusters.cy.ts

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -76,9 +76,8 @@ describe('Clusters', () => {
7676
});
7777

7878
it('display the total number of seed peers and the active number', () => {
79-
cy.get('#total-seed-peer').should('be.visible').and('contain', '12');
80-
81-
cy.get('#active-seed-peer').should('be.visible').and('contain', '8');
79+
// cy.get('#total-seed-peer').should('be.visible').and('contain', '12');
80+
// cy.get('#active-seed-peer').should('be.visible').and('contain', '8');
8281
});
8382

8483
it('can display clusters card', () => {
@@ -89,7 +88,7 @@ describe('Clusters', () => {
8988
cy.get('#default-cluster-1')
9089
.should('be.visible')
9190
.and('contain', 'Default')
92-
.and('have.css', 'background-color', 'rgb(0, 129, 112)');
91+
.and('have.css', 'background-color', 'rgb(8, 118, 103)');
9392

9493
// Show cluster name.
9594
cy.get('#cluster-name-1').should('be.visible').and('contain', 'cluster-1');
@@ -170,9 +169,8 @@ describe('Clusters', () => {
170169
});
171170

172171
it('display the total number of seed peers and the active number', () => {
173-
cy.get('#total-seed-peer').should('be.visible').and('contain', '0');
174-
175-
cy.get('#active-seed-peer').should('be.visible').and('contain', '0');
172+
// cy.get('#total-seed-peer').should('be.visible').and('contain', '0');
173+
// cy.get('#active-seed-peer').should('be.visible').and('contain', '0');
176174
});
177175

178176
it('cluster card should present an empty status', () => {
@@ -341,9 +339,8 @@ describe('Clusters', () => {
341339
});
342340

343341
it('display the total number of seed peers and the active number', () => {
344-
cy.get('#total-seed-peer').should('be.visible').and('contain', '0');
345-
346-
cy.get('#active-seed-peer').should('be.visible').and('contain', '0');
342+
// cy.get('#total-seed-peer').should('be.visible').and('contain', '0');
343+
// cy.get('#active-seed-peer').should('be.visible').and('contain', '0');
347344
});
348345

349346
it('cluster card should present an empty status', () => {

cypress/e2e/developer/tokens/tokens.cy.ts

Lines changed: 51 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -210,7 +210,7 @@ describe('Tokens', () => {
210210
cy.get('[data-testid="isloading"]').should('be.exist');
211211

212212
// Delete success message.
213-
cy.get('.MuiAlert-message').should('have.text', 'Submission successful!');
213+
cy.get('.MuiAlert-message').should('have.text', 'Token deleted successfully!');
214214

215215
cy.get('[data-testid="isloading"]').should('not.exist');
216216

@@ -258,7 +258,7 @@ describe('Tokens', () => {
258258
cy.wait('@delete');
259259

260260
// Delete success message.
261-
cy.get('.MuiAlert-message').should('have.text', 'Submission successful!');
261+
cy.get('.MuiAlert-message').should('have.text', 'Token deleted successfully!');
262262

263263
// Check if the token exists.
264264
cy.get('#root-11').should('not.exist');
@@ -313,5 +313,54 @@ describe('Tokens', () => {
313313
// Show error message.
314314
cy.get('.MuiAlert-message').should('have.text', 'Failed to fetch');
315315
});
316+
317+
it('should hide copy column when deleting last token and no tokens remain', () => {
318+
// Simulate the presence of newToken in localStorage
319+
cy.window().then((win) => {
320+
win.localStorage.setItem('token', '"test-token-value"');
321+
});
322+
323+
// Reload the page to trigger localStorage check in useEffect
324+
cy.reload();
325+
326+
// Confirm copy column exists
327+
cy.get('#copy-column').should('be.visible');
328+
329+
// Click delete button
330+
cy.get('#delete-token-11').click();
331+
332+
cy.intercept(
333+
{
334+
method: 'DELETE',
335+
url: '/api/v1/personal-access-tokens/11',
336+
},
337+
(req) => {
338+
req.reply({
339+
statusCode: 200,
340+
});
341+
},
342+
);
343+
344+
// Simulate returning an empty array after deletion
345+
cy.intercept(
346+
{
347+
method: 'GET',
348+
url: '/api/v1/personal-access-tokens?page=1&per_page=10000000',
349+
},
350+
(req) => {
351+
req.reply({
352+
statusCode: 200,
353+
body: [],
354+
});
355+
},
356+
).as('deleteToken');
357+
358+
// Click confirm delete
359+
cy.get('#delete').click();
360+
cy.wait('@deleteToken');
361+
362+
// Confirm copy column is hidden
363+
cy.get('#copy-column').should('not.exist');
364+
});
316365
});
317366
});

cypress/e2e/schedulers/scheduler.cy.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -103,7 +103,7 @@ describe('Scheduler', () => {
103103
cy.get('#status')
104104
.should('be.visible')
105105
.and('contain', 'Active')
106-
.and('have.css', 'background-color', 'rgb(0, 129, 112)');
106+
.and('have.css', 'background-color', 'rgb(8, 118, 103)');
107107

108108
// Displays the scheduler features.
109109
cy.get('#features').should('be.visible').and('contain', 'Schedule').and('contain', 'Preheat');

cypress/e2e/schedulers/schedulers.cy.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ describe('Schedulers', () => {
7676
cy.get('#state-7')
7777
.should('be.visible')
7878
.and('contain', 'Active')
79-
.and('have.css', 'background-color', 'rgb(0, 129, 112)');
79+
.and('have.css', 'background-color', 'rgb(8, 118, 103)');
8080

8181
// Show features.
8282
cy.get('#features-7').should('be.visible').and('contain', 'Schedule');
@@ -109,7 +109,7 @@ describe('Schedulers', () => {
109109
cy.get('#card-state-50')
110110
.should('be.visible')
111111
.and('have.text', 'Active')
112-
.and('have.css', 'background-color', 'rgba(0, 129, 112, 0.2)');
112+
.and('have.css', 'background-color', 'rgba(35, 155, 86, 0.2)');
113113
cy.get('.MuiPagination-ul > :nth-child(4) > .MuiButtonBase-root').click();
114114
cy.get('#card-hostname-scheduler-41').should('be.visible').and('have.text', 'scheduler-41');
115115
// Show status.

cypress/e2e/users/users.cy.ts

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ describe('Users', () => {
133133
// Click detail button.
134134
cy.get('#action-root').click();
135135

136-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #detail-root').click();
136+
cy.get('#detail-root').click();
137137

138138
// Display user lucy details.
139139
cy.get('.MuiDrawer-root > .MuiPaper-root').should('be.visible');
@@ -167,7 +167,7 @@ describe('Users', () => {
167167
},
168168
);
169169

170-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #detail-jack').click();
170+
cy.get('#detail-jack').click();
171171

172172
cy.get('[data-testid="detail-isloading"]').should('be.exist');
173173

@@ -188,15 +188,15 @@ describe('Users', () => {
188188
it('can display update user', () => {
189189
// Click update user button.
190190
cy.get('#action-lucy').click();
191-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #edit-lucy').click();
191+
cy.get('#edit-lucy').click();
192192

193193
// Check role.
194194
cy.get('#role-root').should('be.checked').check({ force: true });
195195
cy.get('#role-guest');
196196
cy.get('body').click('topLeft');
197197

198198
cy.get('#action-jack').click();
199-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #edit-jack').click();
199+
cy.get('#edit-jack').click();
200200

201201
cy.get('#role-root').should('not.be.checked');
202202
cy.get('#role-guest').should('be.checked').check({ force: true });
@@ -301,7 +301,7 @@ describe('Users', () => {
301301
);
302302

303303
cy.get('#action-jack').click();
304-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #detail-jack').click();
304+
cy.get('#detail-jack').click();
305305

306306
// Display user jack details.
307307
cy.get('#id').should('have.text', 0);
@@ -431,7 +431,7 @@ describe('Users', () => {
431431
);
432432

433433
cy.get('#action-lucy').click();
434-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #edit-lucy').click();
434+
cy.get('#edit-lucy').click();
435435

436436
cy.get('#role-root').should('be.checked').check({ force: true });
437437
cy.get('#role-guest').should('not.be.checked');
@@ -455,7 +455,7 @@ describe('Users', () => {
455455
);
456456

457457
cy.get('#action-lucy').click();
458-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #edit-lucy').click();
458+
cy.get('#edit-lucy').click();
459459

460460
// Change success message.
461461
cy.get('.MuiAlert-message').should('be.visible').and('have.text', 'Submission successful!');
@@ -504,7 +504,7 @@ describe('Users', () => {
504504
);
505505

506506
cy.get('#action-jack').click();
507-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #edit-jack').click();
507+
cy.get('#edit-jack').click();
508508

509509
// Check if role is guest.
510510
cy.get('#role-root').should('not.be.checked');
@@ -529,7 +529,7 @@ describe('Users', () => {
529529
);
530530

531531
cy.get('#action-jack').click();
532-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #edit-jack').click();
532+
cy.get('#edit-jack').click();
533533

534534
// Check if role is root.
535535
cy.get('#role-root').should('be.checked').check({ force: true });
@@ -591,7 +591,7 @@ describe('Users', () => {
591591

592592
// Click edit button.
593593
cy.get('#action-lucy').click();
594-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #edit-lucy').click();
594+
cy.get('#edit-lucy').click();
595595

596596
cy.get('#role-root').should('be.checked').check({ force: true });
597597
cy.get('#role-guest').should('not.be.checked');
@@ -617,7 +617,7 @@ describe('Users', () => {
617617
);
618618

619619
cy.get('#action-lucy').click();
620-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #edit-lucy').click();
620+
cy.get('#edit-lucy').click();
621621

622622
// Check role.
623623
cy.get('#role-root').should('not.be.checked');
@@ -659,7 +659,7 @@ describe('Users', () => {
659659
);
660660

661661
cy.get('#action-lucy').click();
662-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #edit-lucy').click();
662+
cy.get('#edit-lucy').click();
663663

664664
// Show error message.
665665
cy.get('.MuiAlert-message').should('be.visible').and('have.text', 'Failed to fetch');
@@ -706,7 +706,7 @@ describe('Users', () => {
706706
);
707707

708708
cy.get('#action-lucy').click();
709-
cy.get(':nth-child(12) > .MuiPaper-root > .MuiList-root > .users_menu__4L0WC > #edit-lucy').click();
709+
cy.get('#edit-lucy').click();
710710

711711
// Check if role is root.
712712
cy.get('#role-root').should('be.checked').check({ force: true });

src/App.tsx

Lines changed: 14 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -37,14 +37,17 @@ function App() {
3737
primary: mode === 'light' ? '#1C293A' : 'rgba(255, 255, 255, 0.8)',
3838
},
3939
success: {
40-
main: '#1f7d53',
41-
light: '#1f7d53',
42-
dark: '#008170',
40+
main: '#087667',
41+
light: '#087667',
42+
dark: '#087667',
43+
},
44+
warning:{
45+
main:'#ffcb31'
4346
},
4447
secondary: {
45-
main: '#1f7d53',
46-
light: '#1f7d53',
47-
dark: '#008170',
48+
main: '#087667',
49+
light: '#087667',
50+
dark: '#087667',
4851
},
4952
},
5053
typography: {
@@ -59,6 +62,11 @@ function App() {
5962
},
6063
},
6164
},
65+
MuiAlert: {
66+
defaultProps: {
67+
variant: 'filled',
68+
},
69+
},
6270
},
6371
}),
6472
[mode],

src/components/audit/index.module.css

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,3 +52,13 @@
5252
.card {
5353
width: 100%;
5454
}
55+
56+
.nodataIcon {
57+
max-width: 10rem;
58+
height: 10rem;
59+
}
60+
61+
.nodataText {
62+
color: var(--palette-text-disabled);
63+
font-family: 'mabry-bold';
64+
}

src/components/audit/index.tsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ import { getDatetime, useQuery } from '../../lib/utils';
2626
import { debounce } from 'lodash';
2727
import SearchCircularProgress from '../circular-progress';
2828
import ErrorHandler from '../error-handler';
29+
import { ReactComponent as IcContent } from '../../assets/images/cluster/scheduler/ic-content.svg';
2930

3031
export default function AuditLogs() {
3132
const [errorMessage, setErrorMessage] = useState(false);
@@ -401,7 +402,10 @@ export default function AuditLogs() {
401402
</TableRow>
402403
) : logs.length === 0 ? (
403404
<TableCell id="no-audit-table" colSpan={9} align="center" sx={{ border: 0 }}>
404-
You don't have audit logs.
405+
<IcContent className={styles.nodataIcon} />
406+
<Typography id="no-audit-table" variant="h6" className={styles.nodataText}>
407+
You don't have audit logs.
408+
</Typography>
405409
</TableCell>
406410
) : (
407411
Array.isArray(logs) &&

src/components/clusters/index.module.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@
3838
.clusterHeaderContainer {
3939
display: grid;
4040
gap: calc(1.5rem);
41-
grid-template-columns: repeat(3, 1fr);
41+
grid-template-columns: repeat(2, 1fr);
4242
margin-top: 1.5rem;
4343
}
4444

src/components/clusters/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -286,7 +286,7 @@ export default function Clusters() {
286286
<Statistics className={styles.statistics} />
287287
</Box>
288288
</Card>
289-
<Card className={styles.clusterContainer}>
289+
{/* <Card className={styles.clusterContainer}>
290290
<Box display="flex" alignItems="flex-end">
291291
<Box className={styles.clusterIconContainer}>
292292
<Round className={styles.clusterSmallCircleIcon} />
@@ -323,7 +323,7 @@ export default function Clusters() {
323323
</Box>
324324
<Statistics className={styles.statistics} />
325325
</Box>
326-
</Card>
326+
</Card> */}
327327
</Grid>
328328
<Box className={styles.searchContainer}>
329329
<Autocomplete

0 commit comments

Comments
 (0)