feat: added link for dashboard name (#5544)

* feat: added link for dashboard name

* refactor: added getLink function to get the link of dashboard details page

* refactor: changed the color for dashboard name

* refactor: updated the classname for dashboard name

* fix: update css tokens and light mode design

---------

Co-authored-by: vikrantgupta25 <vikrant.thomso@gmail.com>
This commit is contained in:
rahulkeswani101 2024-08-06 13:33:51 +05:30 committed by GitHub
parent 4a4c9f26a2
commit 80a7b9d16d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 12 additions and 2 deletions

View File

@ -43,6 +43,10 @@
background: var(--bg-ink-400); background: var(--bg-ink-400);
cursor: pointer; cursor: pointer;
.dashboard-title {
color: var(--bg-vanilla-100);
}
.title-with-action { .title-with-action {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -1048,6 +1052,10 @@
border: 1px solid var(--bg-vanilla-200); border: 1px solid var(--bg-vanilla-200);
background: var(--bg-vanilla-100); background: var(--bg-vanilla-100);
.dashboard-title {
color: var(--bg-slate-300);
}
.title-with-action { .title-with-action {
.dashboard-title { .dashboard-title {
.ant-typography { .ant-typography {

View File

@ -66,7 +66,7 @@ import {
} from 'react'; } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux';
import { generatePath } from 'react-router-dom'; import { generatePath, Link } from 'react-router-dom';
import { useCopyToClipboard } from 'react-use'; import { useCopyToClipboard } from 'react-use';
import { AppState } from 'store/reducers'; import { AppState } from 'store/reducers';
import { Dashboard } from 'types/api/dashboard/getAll'; import { Dashboard } from 'types/api/dashboard/getAll';
@ -455,7 +455,9 @@ function DashboardsList(): JSX.Element {
alt="dashboard-image" alt="dashboard-image"
/> />
<Typography.Text data-testid={`dashboard-title-${index}`}> <Typography.Text data-testid={`dashboard-title-${index}`}>
{dashboard.name} <Link to={getLink()} className="dashboard-title">
{dashboard.name}
</Link>
</Typography.Text> </Typography.Text>
</div> </div>