mirror of
https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz
synced 2025-08-12 07:19:00 +08:00
fix: dashboard table element overflow (#930)
This commit is contained in:
parent
d34e08fa3d
commit
7939902f03
@ -23,6 +23,7 @@
|
|||||||
"author": "",
|
"author": "",
|
||||||
"license": "ISC",
|
"license": "ISC",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@ant-design/colors": "^6.0.0",
|
||||||
"@ant-design/icons": "^4.6.2",
|
"@ant-design/icons": "^4.6.2",
|
||||||
"@grafana/data": "^8.4.3",
|
"@grafana/data": "^8.4.3",
|
||||||
"@monaco-editor/react": "^4.3.1",
|
"@monaco-editor/react": "^4.3.1",
|
||||||
|
@ -1,4 +1,3 @@
|
|||||||
import { Button } from 'antd';
|
|
||||||
import React, { useCallback } from 'react';
|
import React, { useCallback } from 'react';
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import { bindActionCreators, Dispatch } from 'redux';
|
import { bindActionCreators, Dispatch } from 'redux';
|
||||||
@ -7,6 +6,7 @@ import { DeleteDashboard, DeleteDashboardProps } from 'store/actions';
|
|||||||
import AppActions from 'types/actions';
|
import AppActions from 'types/actions';
|
||||||
|
|
||||||
import { Data } from '../index';
|
import { Data } from '../index';
|
||||||
|
import { TableLinkText } from './styles';
|
||||||
|
|
||||||
function DeleteButton({ deleteDashboard, id }: DeleteButtonProps): JSX.Element {
|
function DeleteButton({ deleteDashboard, id }: DeleteButtonProps): JSX.Element {
|
||||||
const onClickHandler = useCallback(() => {
|
const onClickHandler = useCallback(() => {
|
||||||
@ -15,11 +15,7 @@ function DeleteButton({ deleteDashboard, id }: DeleteButtonProps): JSX.Element {
|
|||||||
});
|
});
|
||||||
}, [id, deleteDashboard]);
|
}, [id, deleteDashboard]);
|
||||||
|
|
||||||
return (
|
return <TableLinkText onClick={onClickHandler}>Delete</TableLinkText>;
|
||||||
<Button onClick={onClickHandler} type="link">
|
|
||||||
Delete
|
|
||||||
</Button>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
interface DispatchProps {
|
interface DispatchProps {
|
||||||
|
@ -1,10 +1,10 @@
|
|||||||
import { Button } from 'antd';
|
|
||||||
import ROUTES from 'constants/routes';
|
import ROUTES from 'constants/routes';
|
||||||
import history from 'lib/history';
|
import history from 'lib/history';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { generatePath } from 'react-router-dom';
|
import { generatePath } from 'react-router-dom';
|
||||||
|
|
||||||
import { Data } from '..';
|
import { Data } from '..';
|
||||||
|
import { TableLinkText } from './styles';
|
||||||
|
|
||||||
function Name(name: Data['name'], data: Data): JSX.Element {
|
function Name(name: Data['name'], data: Data): JSX.Element {
|
||||||
const onClickHandler = (): void => {
|
const onClickHandler = (): void => {
|
||||||
@ -17,11 +17,7 @@ function Name(name: Data['name'], data: Data): JSX.Element {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return <TableLinkText onClick={onClickHandler}>{name}</TableLinkText>;
|
||||||
<Button onClick={onClickHandler} type="link">
|
|
||||||
{name}
|
|
||||||
</Button>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default Name;
|
export default Name;
|
||||||
|
@ -0,0 +1,8 @@
|
|||||||
|
import { blue } from '@ant-design/colors';
|
||||||
|
import { Typography } from 'antd';
|
||||||
|
import styled from 'styled-components';
|
||||||
|
|
||||||
|
export const TableLinkText = styled(Typography.Text)`
|
||||||
|
color: ${blue.primary} !important;
|
||||||
|
cursor: pointer;
|
||||||
|
`;
|
Loading…
x
Reference in New Issue
Block a user