IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Explore: Adds query inspector drawer to explore (#26698)

Browse Source 
* Explore: Adds query inspector drawer to explore
This commit is contained in:
kay delaney
2020-08-06 16:22:54 +01:00
committed by GitHub
parent 145d221983
commit 02b12d3a7b
15 changed files with 472 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
public/app/features/dashboard/components/Inspector/InspectContent.tsx
View File

@@ -91,7 +91,7 @@ export const InspectContent: React.FC<Props> = ({
<InspectJSONTab panel={panel} dashboard={dashboard} data={data} onClose={onClose} />
)}
{activeTab === InspectTab.Error && <InspectErrorTab error={error} />}
{data && activeTab === InspectTab.Stats && <InspectStatsTab data={data} dashboard={dashboard} />}
{data && activeTab === InspectTab.Stats && <InspectStatsTab data={data} timeZone={dashboard.getTimezone()} />}
{data && activeTab === InspectTab.Query && <QueryInspector panel={panel} data={data.series} />}
</TabContent>
</CustomScrollbar>

12
public/app/features/dashboard/components/Inspector/InspectStatsTab.tsx
View File

@@ -1,14 +1,14 @@
import { PanelData, QueryResultMetaStat } from '@grafana/data';
import { PanelData, QueryResultMetaStat, TimeZone } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { InspectStatsTable } from './InspectStatsTable';
import React from 'react';
import { DashboardModel } from 'app/features/dashboard/state';
interface InspectStatsTabProps {
data: PanelData;
dashboard: DashboardModel;
timeZone: TimeZone;
}
export const InspectStatsTab: React.FC<InspectStatsTabProps> = ({ data, dashboard }) => {
export const InspectStatsTab: React.FC<InspectStatsTabProps> = ({ data, timeZone }) => {
if (!data.request) {
return null;
}
@@ -42,8 +42,8 @@ export const InspectStatsTab: React.FC<InspectStatsTabProps> = ({ data, dashboar
return (
<div aria-label={selectors.components.PanelInspector.Stats.content}>
<InspectStatsTable dashboard={dashboard} name={'Stats'} stats={stats} />
<InspectStatsTable dashboard={dashboard} name={'Data source stats'} stats={dataStats} />
<InspectStatsTable timeZone={timeZone} name={'Stats'} stats={stats} />
<InspectStatsTable timeZone={timeZone} name={'Data source stats'} stats={dataStats} />
</div>
);
};

8
public/app/features/dashboard/components/Inspector/InspectStatsTable.tsx
View File

@@ -7,17 +7,17 @@ import {
QueryResultMetaStat,
TimeZone,
} from '@grafana/data';
import { DashboardModel } from 'app/features/dashboard/state';
import { config } from 'app/core/config';
import { stylesFactory, useTheme } from '@grafana/ui';
import { css } from 'emotion';
interface InspectStatsTableProps {
dashboard: DashboardModel;
timeZone: TimeZone;
name: string;
stats: QueryResultMetaStat[];
}
export const InspectStatsTable: React.FC<InspectStatsTableProps> = ({ dashboard, name, stats }) => {
export const InspectStatsTable: React.FC<InspectStatsTableProps> = ({ timeZone, name, stats }) => {
const theme = useTheme();
const styles = getStyles(theme);
@@ -34,7 +34,7 @@ export const InspectStatsTable: React.FC<InspectStatsTableProps> = ({ dashboard,
return (
<tr key={`${stat.displayName}-${index}`}>
<td>{stat.displayName}</td>
<td className={styles.cell}>{formatStat(stat, dashboard.getTimezone())}</td>
<td className={styles.cell}>{formatStat(stat, timeZone)}</td>
</tr>
);
})}