IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-01-15 19:22:34 -06:00
Code Issues Packages Projects Releases Wiki Activity

Explore Metrics: Fix infinite loop while opening a panel in explore metrics (#92946)

Browse Source 
* Fix infinite loop while opening a panel in explore metrics

* clean up
This commit is contained in:
ismail simsek 2024-09-05 21:04:43 +02:00 committed by GitHub
parent 0ba808805e
commit 9e6e41c6f8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 21 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
public/app/features/trails/DataTrail.tsx
View File

@ -1,6 +1,6 @@
import { css } from '@emotion/css';
import { AdHocVariableFilter, GrafanaTheme2, PageLayoutType, VariableHide, urlUtil } from '@grafana/data';
import { AdHocVariableFilter, GrafanaTheme2, urlUtil, VariableHide } from '@grafana/data';
import { config, locationService, useChromeHeaderHeight } from '@grafana/runtime';
import {
AdHocFiltersVariable,
@ -24,7 +24,6 @@ import {
VariableValueSelectors,
} from '@grafana/scenes';
import { useStyles2 } from '@grafana/ui';
import { Page } from 'app/core/components/Page/Page';
import { DataTrailSettings } from './DataTrailSettings';
import { DataTrailHistory } from './DataTrailsHistory';
@ -35,7 +34,6 @@ import { getTrailStore } from './TrailStore/TrailStore';
import { MetricDatasourceHelper } from './helpers/MetricDatasourceHelper';
import { reportChangeInLabelFilters } from './interactions';
import { MetricSelectedEvent, trailDS, VAR_DATASOURCE, VAR_FILTERS } from './shared';
import { getMetricName } from './utils';
export interface DataTrailState extends SceneObjectState {
topScene?: SceneObject;
@ -211,27 +209,25 @@ export class DataTrail extends SceneObjectBase<DataTrailState> {
}
static Component = ({ model }: SceneComponentProps<DataTrail>) => {
const { controls, topScene, history, settings, metric } = model.useState();
const { controls, topScene, history, settings } = model.useState();
const chromeHeaderHeight = useChromeHeaderHeight();
const styles = useStyles2(getStyles, chromeHeaderHeight ?? 0);
const showHeaderForFirstTimeUsers = getTrailStore().recent.length < 2;
return (
<Page navId="explore/metrics" pageNav={{ text: getMetricName(metric) }} layout={PageLayoutType.Custom}>
<div className={styles.container}>
{showHeaderForFirstTimeUsers && <MetricsHeader />}
<history.Component model={history} />
{controls && (
<div className={styles.controls}>
{controls.map((control) => (
<control.Component key={control.state.key} model={control} />
))}
<settings.Component model={settings} />
</div>
)}
<div className={styles.body}>{topScene && <topScene.Component model={topScene} />}</div>
</div>
</Page>
<div className={styles.container}>
{showHeaderForFirstTimeUsers && <MetricsHeader />}
<history.Component model={history} />
{controls && (
<div className={styles.controls}>
{controls.map((control) => (
<control.Component key={control.state.key} model={control} />
))}
<settings.Component model={settings} />
</div>
)}
<div className={styles.body}>{topScene && <topScene.Component model={topScene} />}</div>
</div>
);
};
}

9
public/app/features/trails/DataTrailsApp.tsx
View File

@ -1,4 +1,4 @@
import { useState, useEffect } from 'react';
import { useEffect, useState } from 'react';
import { Route, Switch } from 'react-router-dom';
import { PageLayoutType } from '@grafana/data';
@ -11,7 +11,7 @@ import { DataTrailsHome } from './DataTrailsHome';
import { MetricsHeader } from './MetricsHeader';
import { getTrailStore } from './TrailStore/TrailStore';
import { HOME_ROUTE, TRAILS_ROUTE } from './shared';
import { getUrlForTrail, newMetricsTrail } from './utils';
import { getMetricName, getUrlForTrail, newMetricsTrail } from './utils';
export interface DataTrailsAppState extends SceneObjectState {
trail: DataTrail;
@ -55,6 +55,7 @@ export class DataTrailsApp extends SceneObjectBase<DataTrailsAppState> {
function DataTrailView({ trail }: { trail: DataTrail }) {
const [isInitialized, setIsInitialized] = useState(false);
const { metric } = trail.useState();
useEffect(() => {
if (!isInitialized) {
@ -69,7 +70,9 @@ function DataTrailView({ trail }: { trail: DataTrail }) {
return (
<UrlSyncContextProvider scene={trail}>
<trail.Component model={trail} />
<Page navId="explore/metrics" pageNav={{ text: getMetricName(metric) }} layout={PageLayoutType.Custom}>
<trail.Component model={trail} />
</Page>
</UrlSyncContextProvider>
);
}