apitech
/
grafana
mirror of https://github.com/grafana/grafana
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

TimePicker: Ability to manually specify quick ranges (#101465)

Browse Source 
* add quickRanges to scene model transforms

* add test for quickRanges transformations

* fix lint
pull/101659/head
Sergej-Vlasov 3 months ago committed by GitHub
parent 60827fe499
commit bf9a34f2ca
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
10 changed files with 465 additions and 5 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 12
      packages/grafana-schema/src/schema/dashboard/v2alpha0/examples.ts
  2. 375
      public/app/features/dashboard-scene/serialization/__snapshots__/transformSceneToSaveModel.test.ts.snap
  3. 4
      public/app/features/dashboard-scene/serialization/transformSaveModelSchemaV2ToScene.test.ts
  4. 4
      public/app/features/dashboard-scene/serialization/transformSaveModelSchemaV2ToScene.ts
  5. 30
      public/app/features/dashboard-scene/serialization/transformSaveModelToScene.test.ts
  6. 4
      public/app/features/dashboard-scene/serialization/transformSaveModelToScene.ts
  7. 27
      public/app/features/dashboard-scene/serialization/transformSceneToSaveModel.test.ts
  8. 1
      public/app/features/dashboard-scene/serialization/transformSceneToSaveModel.ts
  9. 12
      public/app/features/dashboard-scene/serialization/transformSceneToSaveModelSchemaV2.test.ts
  10. 1
      public/app/features/dashboard-scene/serialization/transformSceneToSaveModelSchemaV2.ts

12
packages/grafana-schema/src/schema/dashboard/v2alpha0/examples.ts
Unescape View File

@ -18,6 +18,18 @@ export const handyTestingSchema: DashboardV2Spec = {
timezone: 'UTC',
to: 'now',
weekStart: 'monday',
quickRanges: [
{
display: 'Last 6 hours',
from: 'now-6h',
to: 'now',
},
{
display: 'Last 3 days',
from: 'now-3d',
to: 'now',
},
],
},
annotations: [
{

375
public/app/features/dashboard-scene/serialization/__snapshots__/transformSceneToSaveModel.test.ts.snap
Unescape View File

@ -1,5 +1,380 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Given a scene with custom quick ranges should save quick ranges to save model 1`] = `
{
"annotations": {
"list": [
{
"builtIn": 1,
"datasource": {
"type": "datasource",
"uid": "grafana",
},
"enable": true,
"hide": false,
"iconColor": "rgba(0, 211, 255, 1)",
"name": "Annotations & Alerts",
"type": "dashboard",
},
{
"datasource": {
"type": "testdata",
"uid": "gdev-testdata",
},
"enable": true,
"hide": false,
"iconColor": "red",
"name": "Enabled",
"target": {
"lines": 4,
"refId": "Anno",
"scenarioId": "annotations",
},
},
{
"datasource": {
"type": "testdata",
"uid": "gdev-testdata",
},
"enable": false,
"hide": false,
"iconColor": "yellow",
"name": "Disabled",
"target": {
"lines": 5,
"refId": "Anno",
"scenarioId": "annotations",
},
},
{
"datasource": {
"type": "testdata",
"uid": "gdev-testdata",
},
"enable": true,
"hide": true,
"iconColor": "dark-purple",
"name": "Hidden",
"target": {
"lines": 6,
"refId": "Anno",
"scenarioId": "annotations",
},
},
],
},
"editable": true,
"fiscalYearStartMonth": 1,
"graphTooltip": 1,
"id": 1351,
"links": [],
"panels": [
{
"datasource": {
"type": "testdata",
"uid": "PD8C576611E62080A",
},
"description": "This is a simple time series graph",
"fieldConfig": {
"defaults": {
"color": {
"mode": "palette-classic",
},
"custom": {
"fillOpacity": 0,
"gradientMode": "none",
"lineWidth": 2,
},
},
"overrides": [],
},
"gridPos": {
"h": 8,
"w": 12,
"x": 12,
"y": 0,
},
"id": 28,
"options": {
"legend": {
"calcs": [],
"displayMode": "list",
"placement": "bottom",
"showLegend": true,
},
"tooltip": {
"mode": "single",
"sort": "none",
},
},
"targets": [
{
"alias": "series",
"datasource": {
"type": "testdata",
"uid": "PD8C576611E62080A",
},
"refId": "A",
"scenarioId": "random_walk",
"seriesCount": 1,
},
],
"title": "Simple time series graph ",
"type": "timeseries",
},
{
"collapsed": false,
"gridPos": {
"h": 1,
"w": 24,
"x": 0,
"y": 8,
},
"id": 5,
"panels": [],
"title": "Row title",
"type": "row",
},
{
"datasource": {
"type": "testdata",
"uid": "PD8C576611E62080A",
},
"fieldConfig": {
"defaults": {},
"overrides": [],
},
"gridPos": {
"h": 10,
"w": 12,
"x": 0,
"y": 9,
},
"id": 29,
"options": {},
"targets": [
{
"alias": "series",
"datasource": {
"type": "testdata",
"uid": "PD8C576611E62080A",
},
"refId": "A",
"scenarioId": "random_walk",
"seriesCount": 1,
},
],
"title": "panel inside row",
"type": "timeseries",
},
{
"fieldConfig": {
"defaults": {},
"overrides": [],
},
"gridPos": {
"h": 10,
"w": 11,
"x": 12,
"y": 9,
},
"id": 25,
"options": {
"code": {
"language": "plaintext",
"showLineNumbers": false,
"showMiniMap": false,
},
"content": "content",
"mode": "markdown",
},
"pluginVersion": "10.2.0-pre",
"title": "Transparent text panel",
"transparent": true,
"type": "text",
},
],
"preload": false,
"refresh": "",
"schemaVersion": 41,
"tags": [
"gdev",
"graph-ng",
"demo",
],
"templating": {
"list": [
{
"baseFilters": [],
"datasource": {
"type": "prometheus",
"uid": "wc2AL7L7k",
},
"filters": [],
"name": "Filters",
"type": "adhoc",
},
{
"auto": true,
"auto_count": 30,
"auto_min": "10s",
"current": {
"text": "1m",
"value": "1m",
},
"name": "intervalVar",
"options": [
{
"selected": true,
"text": "1m",
"value": "1m",
},
{
"selected": false,
"text": "10m",
"value": "10m",
},
{
"selected": false,
"text": "30m",
"value": "30m",
},
{
"selected": false,
"text": "1h",
"value": "1h",
},
{
"selected": false,
"text": "6h",
"value": "6h",
},
{
"selected": false,
"text": "12h",
"value": "12h",
},
{
"selected": false,
"text": "1d",
"value": "1d",
},
{
"selected": false,
"text": "7d",
"value": "7d",
},
{
"selected": false,
"text": "14d",
"value": "14d",
},
{
"selected": false,
"text": "30d",
"value": "30d",
},
],
"query": "1m,10m,30m,1h,6h,12h,1d,7d,14d,30d",
"refresh": 2,
"type": "interval",
},
{
"current": {
"text": [
"a",
],
"value": [
"a",
],
},
"includeAll": true,
"multi": true,
"name": "customVar",
"options": [],
"query": "a, b, c",
"type": "custom",
},
{
"current": {
"text": "gdev-testdata",
"value": "PD8C576611E62080A",
},
"includeAll": false,
"name": "dsVar",
"options": [],
"query": "grafana-testdata-datasource",
"refresh": 1,
"regex": "",
"type": "datasource",
},
{
"current": {
"text": "A",
"value": "A",
},
"definition": "*",
"includeAll": false,
"name": "query0",
"options": [],
"query": {
"query": "*",
"refId": "StandardVariableQuery",
},
"refresh": 1,
"regex": "",
"type": "query",
},
{
"current": {
"text": "test",
"value": "test",
},
"hide": 2,
"name": "constant",
"query": "test",
"skipUrlSync": true,
"type": "constant",
},
],
},
"time": {
"from": "now-5m",
"to": "now",
},
"timepicker": {
"quick_ranges": [
{
"display": "Last 6 hours",
"from": "now-6h",
"to": "now",
},
{
"display": "Last 3 days",
"from": "now-3d",
"to": "now",
},
],
"refresh_intervals": [
"10s",
"30s",
"1m",
"5m",
"15m",
"30m",
"1h",
"2h",
"1d",
],
},
"timezone": "America/New_York",
"title": "Dashboard to load1",
"uid": "nP8rcffGkasd",
"version": 2,
"weekStart": "saturday",
}
`;
exports[`transformSceneToSaveModel Annotations should transform annotations to save model 1`] = `
[
{

4
public/app/features/dashboard-scene/serialization/transformSaveModelSchemaV2ToScene.test.ts
Unescape View File

@ -131,6 +131,7 @@ describe('transformSaveModelSchemaV2ToScene', () => {
expect(dashboardControls).toBeDefined();
expect(dashboardControls.state.refreshPicker.state.intervals).toEqual(time.autoRefreshIntervals);
expect(dashboardControls.state.hideTimeControls).toBe(time.hideTimepicker);
expect(dashboardControls.state.timePicker.state.quickRanges).toEqual(dash.timeSettings.quickRanges);
// Variables
const variables = scene.state?.$variables;
@ -223,9 +224,6 @@ describe('transformSaveModelSchemaV2ToScene', () => {
expect(dataLayers.state.annotationLayers[3].state.isEnabled).toBe(dash.annotations[3].spec.enable);
expect(dataLayers.state.annotationLayers[3].state.isHidden).toBe(dash.annotations[3].spec.hide);
// To be implemented
// expect(timePicker.state.ranges).toEqual(dash.timeSettings.quickRanges);
// VizPanel
const vizPanels = (scene.state.body as DashboardLayoutManager).getVizPanels();
expect(vizPanels).toHaveLength(3);

4
public/app/features/dashboard-scene/serialization/transformSaveModelSchemaV2ToScene.ts
Unescape View File

@ -203,7 +203,9 @@ export function transformSaveModelSchemaV2ToScene(dto: DashboardWithAccessInfo<D
}),
controls: new DashboardControls({
variableControls: [new VariableValueSelectors({}), new SceneDataLayerControls()],
timePicker: new SceneTimePicker({}),
timePicker: new SceneTimePicker({
quickRanges: dashboard.timeSettings.quickRanges,
}),
refreshPicker: new SceneRefreshPicker({
refresh: dashboard.timeSettings.autoRefresh,
intervals: dashboard.timeSettings.autoRefreshIntervals,

30
public/app/features/dashboard-scene/serialization/transformSaveModelToScene.test.ts
Unescape View File

@ -931,6 +931,36 @@ describe('transformSaveModelToScene', () => {
});
});
describe('When creating a snapshot dashboard scene', () => {
it('should initialize a dashboard scene with SnapshotVariables', () => {
const dashboard = {
...defaultDashboard,
title: 'With custom quick ranges',
uid: 'test-uid',
timepicker: {
...defaultTimePickerConfig,
quick_ranges: [
{
display: 'Last 6 hours',
from: 'now-6h',
to: 'now',
},
{
display: 'Last 3 days',
from: 'now-3d',
to: 'now',
},
],
},
};
const oldModel = new DashboardModel(dashboard);
const scene = createDashboardSceneFromDashboardModel(oldModel, dashboard);
expect(scene.state.controls?.state.timePicker.state.quickRanges).toBe(dashboard.timepicker.quick_ranges);
});
});
function buildGridItemForTest(saveModel: Partial<Panel>): { gridItem: DashboardGridItem; vizPanel: VizPanel } {
const gridItem = buildGridItemForPanel(new PanelModel(saveModel));
if (gridItem instanceof DashboardGridItem) {

4
public/app/features/dashboard-scene/serialization/transformSaveModelToScene.ts
Unescape View File

@ -283,7 +283,9 @@ export function createDashboardSceneFromDashboardModel(oldModel: DashboardModel,
$data: new DashboardDataLayerSet({ annotationLayers, alertStatesLayer }),
controls: new DashboardControls({
variableControls: [new VariableValueSelectors({}), new SceneDataLayerControls()],
timePicker: new SceneTimePicker({}),
timePicker: new SceneTimePicker({
quickRanges: oldModel.timepicker.quick_ranges,
}),
refreshPicker: new SceneRefreshPicker({
refresh: oldModel.refresh,
intervals: oldModel.timepicker.refresh_intervals,

27
public/app/features/dashboard-scene/serialization/transformSceneToSaveModel.test.ts
Unescape View File

@ -1057,6 +1057,33 @@ describe('transformSceneToSaveModel', () => {
});
});
describe('Given a scene with custom quick ranges', () => {
it('should save quick ranges to save model', () => {
const dashboardWithCustomSettings = {
...dashboard_to_load1,
timepicker: {
...dashboard_to_load1.timepicker,
quick_ranges: [
{
display: 'Last 6 hours',
from: 'now-6h',
to: 'now',
},
{
display: 'Last 3 days',
from: 'now-3d',
to: 'now',
},
],
},
};
const scene = transformSaveModelToScene({ dashboard: dashboardWithCustomSettings as DashboardDataDTO, meta: {} });
const saveModel = transformSceneToSaveModel(scene);
expect(saveModel).toMatchSnapshot();
});
});
export function buildGridItemFromPanelSchema(panel: Partial<Panel>) {
return buildGridItemForPanel(new PanelModel(panel));
}

1
public/app/features/dashboard-scene/serialization/transformSceneToSaveModel.ts
Unescape View File

@ -100,6 +100,7 @@ export function transformSceneToSaveModel(scene: DashboardScene, isSnapshot = fa
refresh_intervals: refreshPicker?.state.intervals,
hidden: controlsState?.hideTimeControls,
nowDelay: timeRange.UNSAFE_nowDelay,
quick_ranges: controlsState?.timePicker.state.quickRanges,
},
defaultTimePickerConfig
);

12
public/app/features/dashboard-scene/serialization/transformSceneToSaveModelSchemaV2.test.ts
Unescape View File

@ -404,6 +404,18 @@ function getMinimalSceneState(body: DashboardLayoutManager): Partial<DashboardSc
timePicker: new SceneTimePicker({
isOnCanvas: true,
hidePicker: true,
quickRanges: [
{
display: 'Last 6 hours',
from: 'now-6h',
to: 'now',
},
{
display: 'Last 3 days',
from: 'now-3d',
to: 'now',
},
],
}),
}),

1
public/app/features/dashboard-scene/serialization/transformSceneToSaveModelSchemaV2.ts
Unescape View File

@ -94,6 +94,7 @@ export function transformSceneToSaveModelSchemaV2(scene: DashboardScene, isSnaps
weekStart: timeRange.weekStart,
fiscalYearStartMonth: timeRange.fiscalYearStartMonth,
nowDelay: timeRange.UNSAFE_nowDelay,
quickRanges: controlsState?.timePicker.state.quickRanges,
},
// EOF time settings

Write Preview
Loading…
Cancel
Save