GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-08-15 06:16:06 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add the table view for the traces explorer (#2964)

Browse Source 
* feat: add dynamic table based on query

* feat: add the list view for the traces explorer

* feat: add the list view for the traces explorer

* feat: add the list view for the traces explorer

* feat: add the table view for the traces explorer

* feat: remove unnecessary part of code for the table view in the traces explorer

* fix: resolve comments

---------

Co-authored-by: Yevhen Shevchenko <y.shevchenko@seedium.io>
Co-authored-by: Nazarenko19 <danil.nazarenko2000@gmail.com>
Co-authored-by: Vishal Sharma <makeavish786@gmail.com>
Co-authored-by: Palash Gupta <palashgdev@gmail.com>
This commit is contained in:
dnazarenkoo 2023-07-18 13:17:32 +03:00 committed by GitHub
parent 0de40a889d
commit 07833b9859
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 60 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
frontend/src/container/TracesExplorer/TableView/index.tsx Normal file
View File

@ -0,0 +1,53 @@
import { Space } from 'antd';
import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
import { QueryTable } from 'container/QueryTable';
import { useGetQueryRange } from 'hooks/queryBuilder/useGetQueryRange';
import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
import { memo } from 'react';
import { useSelector } from 'react-redux';
import { AppState } from 'store/reducers';
import { GlobalReducer } from 'types/reducer/globalTime';
function TableView(): JSX.Element {
const { stagedQuery, panelType } = useQueryBuilder();
const { selectedTime: globalSelectedTime, maxTime, minTime } = useSelector<
AppState,
GlobalReducer
>((state) => state.globalTime);
const { data, isLoading } = useGetQueryRange(
{
query: stagedQuery || initialQueriesMap.traces,
graphType: panelType || PANEL_TYPES.TABLE,
selectedTime: 'GLOBAL_TIME',
globalSelectedInterval: globalSelectedTime,
params: {
dataSource: 'traces',
},
},
{
queryKey: [
REACT_QUERY_KEY.GET_QUERY_RANGE,
globalSelectedTime,
maxTime,
minTime,
stagedQuery,
],
enabled: !!stagedQuery && panelType === PANEL_TYPES.TABLE,
},
);
return (
<Space.Compact block direction="vertical">
<QueryTable
query={stagedQuery || initialQueriesMap.traces}
queryTableData={data?.payload.data.newResult.data.result || []}
loading={isLoading}
/>
</Space.Compact>
);
}
export default memo(TableView);

6
frontend/src/pages/TracesExplorer/utils.tsx
View File

@ -3,6 +3,7 @@ import TabLabel from 'components/TabLabel';
import { PANEL_TYPES } from 'constants/queryBuilder';
import TimeSeriesView from 'container/TimeSeriesView';
import ListView from 'container/TracesExplorer/ListView';
import TableView from 'container/TracesExplorer/TableView';
import TracesView from 'container/TracesExplorer/TracesView';
import { DataSource } from 'types/common/queryBuilder';
@ -42,4 +43,9 @@ export const getTabsItems = ({
key: PANEL_TYPES.TIME_SERIES,
children: <TimeSeriesView dataSource={DataSource.TRACES} />,
},
{
label: 'Table View',
key: PANEL_TYPES.TABLE,
children: <TableView />,
},
];

5
frontend/src/types/api/widgets/getQuery.ts
View File

@ -5,10 +5,7 @@ export interface PayloadProps {
result: QueryData[];
}
export type ListItem = {
timestamp: string;
data: Omit<ILog, 'timestamp'>;
};
export type ListItem = { timestamp: string; data: Omit<ILog, 'timestamp'> };
export interface QueryData {
metric: {