mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Cue: Update Text, Stat, and Annolist panel cue schemas (#49479)
* user essentials mob! 🔱 * user essentials mob! 🔱 * user essentials mob! 🔱 lastFile:public/app/plugins/panel/stat/types.ts * user essentials mob! 🔱 * user essentials mob! 🔱 * Use generate defaults, and fix a few remaining issues * Add annolist to dashboard dist plugins * minor fixes Co-authored-by: Ashley Harrison <ashley.harrison@grafana.com> Co-authored-by: Joao Silva <joao.silva@grafana.com> Co-authored-by: Alexandra Vargas <alexa1866@gmail.com> Co-authored-by: sam boyer <sdboyer@grafana.com>
This commit is contained in:
@@ -216,7 +216,7 @@ export enum BigValueTextMode {
|
|||||||
Name = 'name',
|
Name = 'name',
|
||||||
None = 'none',
|
None = 'none',
|
||||||
Value = 'value',
|
Value = 'value',
|
||||||
Value_and_name = 'value_and_name',
|
ValueAndName = 'value_and_name',
|
||||||
}
|
}
|
||||||
|
|
||||||
export type FieldTextAlignment = 'auto' | 'left' | 'right' | 'center';
|
export type FieldTextAlignment = 'auto' | 'left' | 'right' | 'center';
|
||||||
|
|||||||
@@ -48,6 +48,6 @@ BigValueGraphMode: "none" | "line" | "area" @cuetsy(kind="enum")
|
|||||||
BigValueJustifyMode: "auto" | "center" @cuetsy(kind="enum")
|
BigValueJustifyMode: "auto" | "center" @cuetsy(kind="enum")
|
||||||
// TODO copy back to appropriate place
|
// TODO copy back to appropriate place
|
||||||
// TODO does cuetsy handle underscores the expected way?
|
// TODO does cuetsy handle underscores the expected way?
|
||||||
BigValueTextMode: "auto" | "value" | "value_and_name" | "name" | "none" @cuetsy(kind="enum")
|
BigValueTextMode: "auto" | "value" | "value_and_name" | "name" | "none" @cuetsy(kind="enum",memberNames="Auto|Value|ValueAndName|Name|None")
|
||||||
// TODO copy back to appropriate place
|
// TODO copy back to appropriate place
|
||||||
BarGaugeDisplayMode: "basic" | "lcd" | "gradient" @cuetsy(kind="enum")
|
BarGaugeDisplayMode: "basic" | "lcd" | "gradient" @cuetsy(kind="enum")
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ package dist
|
|||||||
|
|
||||||
import (
|
import (
|
||||||
"github.com/grafana/grafana/packages/grafana-schema/src/scuemata/dashboard"
|
"github.com/grafana/grafana/packages/grafana-schema/src/scuemata/dashboard"
|
||||||
|
pannolist "github.com/grafana/grafana/public/app/plugins/panel/annolist:grafanaschema"
|
||||||
pbarchart "github.com/grafana/grafana/public/app/plugins/panel/barchart:grafanaschema"
|
pbarchart "github.com/grafana/grafana/public/app/plugins/panel/barchart:grafanaschema"
|
||||||
pbargauge "github.com/grafana/grafana/public/app/plugins/panel/bargauge:grafanaschema"
|
pbargauge "github.com/grafana/grafana/public/app/plugins/panel/bargauge:grafanaschema"
|
||||||
pcanvas "github.com/grafana/grafana/public/app/plugins/panel/canvas:grafanaschema"
|
pcanvas "github.com/grafana/grafana/public/app/plugins/panel/canvas:grafanaschema"
|
||||||
@@ -27,6 +28,7 @@ import (
|
|||||||
Family: dashboard.Family & {
|
Family: dashboard.Family & {
|
||||||
compose: Panel: {
|
compose: Panel: {
|
||||||
// TODO do this with a loop once we include the panel type/plugin id in the model
|
// TODO do this with a loop once we include the panel type/plugin id in the model
|
||||||
|
annolist: pannolist.Panel
|
||||||
barchart: pbarchart.Panel
|
barchart: pbarchart.Panel
|
||||||
bargauge: pbargauge.Panel
|
bargauge: pbargauge.Panel
|
||||||
canvas: pcanvas.Panel
|
canvas: pcanvas.Panel
|
||||||
@@ -43,4 +45,4 @@ Family: dashboard.Family & {
|
|||||||
timeseries: ptimeseries.Panel
|
timeseries: ptimeseries.Panel
|
||||||
"heatmap-new": pheatmap_new.Panel
|
"heatmap-new": pheatmap_new.Panel
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -45,12 +45,10 @@ var skipPaths = []string{
|
|||||||
"public/app/plugins/panel/gauge/models.cue",
|
"public/app/plugins/panel/gauge/models.cue",
|
||||||
"public/app/plugins/panel/histogram/models.cue",
|
"public/app/plugins/panel/histogram/models.cue",
|
||||||
"public/app/plugins/panel/heatmap-new/models.cue",
|
"public/app/plugins/panel/heatmap-new/models.cue",
|
||||||
"public/app/plugins/panel/stat/models.cue",
|
|
||||||
"public/app/plugins/panel/candlestick/models.cue",
|
"public/app/plugins/panel/candlestick/models.cue",
|
||||||
"public/app/plugins/panel/state-timeline/models.cue",
|
"public/app/plugins/panel/state-timeline/models.cue",
|
||||||
"public/app/plugins/panel/status-history/models.cue",
|
"public/app/plugins/panel/status-history/models.cue",
|
||||||
"public/app/plugins/panel/table/models.cue",
|
"public/app/plugins/panel/table/models.cue",
|
||||||
"public/app/plugins/panel/text/models.cue",
|
|
||||||
"public/app/plugins/panel/timeseries/models.cue",
|
"public/app/plugins/panel/timeseries/models.cue",
|
||||||
// All the cue files in this dir have to be individually excluded, even
|
// All the cue files in this dir have to be individually excluded, even
|
||||||
// though the generator currently smooshes them all together
|
// though the generator currently smooshes them all together
|
||||||
|
|||||||
@@ -10,14 +10,14 @@ import { backendSrv } from '../../../core/services/backend_srv';
|
|||||||
import { setDashboardSrv } from '../../../features/dashboard/services/DashboardSrv';
|
import { setDashboardSrv } from '../../../features/dashboard/services/DashboardSrv';
|
||||||
|
|
||||||
import { AnnoListPanel, Props } from './AnnoListPanel';
|
import { AnnoListPanel, Props } from './AnnoListPanel';
|
||||||
import { AnnoOptions } from './types';
|
import { PanelOptions } from './models.gen';
|
||||||
|
|
||||||
jest.mock('@grafana/runtime', () => ({
|
jest.mock('@grafana/runtime', () => ({
|
||||||
...(jest.requireActual('@grafana/runtime') as unknown as object),
|
...(jest.requireActual('@grafana/runtime') as unknown as object),
|
||||||
getBackendSrv: () => backendSrv,
|
getBackendSrv: () => backendSrv,
|
||||||
}));
|
}));
|
||||||
|
|
||||||
const defaultOptions: AnnoOptions = {
|
const defaultOptions: PanelOptions = {
|
||||||
limit: 10,
|
limit: 10,
|
||||||
navigateAfter: '10m',
|
navigateAfter: '10m',
|
||||||
navigateBefore: '10m',
|
navigateBefore: '10m',
|
||||||
@@ -47,7 +47,7 @@ const defaultResult: any = {
|
|||||||
async function setupTestContext({
|
async function setupTestContext({
|
||||||
options = defaultOptions,
|
options = defaultOptions,
|
||||||
results = [defaultResult],
|
results = [defaultResult],
|
||||||
}: { options?: AnnoOptions; results?: AnnotationEvent[] } = {}) {
|
}: { options?: PanelOptions; results?: AnnotationEvent[] } = {}) {
|
||||||
jest.clearAllMocks();
|
jest.clearAllMocks();
|
||||||
|
|
||||||
const getMock = jest.spyOn(backendSrv, 'get');
|
const getMock = jest.spyOn(backendSrv, 'get');
|
||||||
|
|||||||
@@ -20,7 +20,7 @@ import appEvents from 'app/core/app_events';
|
|||||||
import { getDashboardSrv } from 'app/features/dashboard/services/DashboardSrv';
|
import { getDashboardSrv } from 'app/features/dashboard/services/DashboardSrv';
|
||||||
|
|
||||||
import { AnnotationListItem } from './AnnotationListItem';
|
import { AnnotationListItem } from './AnnotationListItem';
|
||||||
import { AnnoOptions } from './types';
|
import { PanelOptions } from './models.gen';
|
||||||
|
|
||||||
interface UserInfo {
|
interface UserInfo {
|
||||||
id?: number;
|
id?: number;
|
||||||
@@ -28,7 +28,7 @@ interface UserInfo {
|
|||||||
email?: string;
|
email?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface Props extends PanelProps<AnnoOptions> {}
|
export interface Props extends PanelProps<PanelOptions> {}
|
||||||
interface State {
|
interface State {
|
||||||
annotations: AnnotationEvent[];
|
annotations: AnnotationEvent[];
|
||||||
timeInfo: string;
|
timeInfo: string;
|
||||||
|
|||||||
@@ -4,9 +4,9 @@ import React, { FC, MouseEvent } from 'react';
|
|||||||
import { AnnotationEvent, DateTimeInput, GrafanaTheme2, PanelProps } from '@grafana/data';
|
import { AnnotationEvent, DateTimeInput, GrafanaTheme2, PanelProps } from '@grafana/data';
|
||||||
import { Card, TagList, Tooltip, useStyles2 } from '@grafana/ui';
|
import { Card, TagList, Tooltip, useStyles2 } from '@grafana/ui';
|
||||||
|
|
||||||
import { AnnoOptions } from './types';
|
import { PanelOptions } from './models.gen';
|
||||||
|
|
||||||
interface Props extends Pick<PanelProps<AnnoOptions>, 'options'> {
|
interface Props extends Pick<PanelProps<PanelOptions>, 'options'> {
|
||||||
annotation: AnnotationEvent;
|
annotation: AnnotationEvent;
|
||||||
formatDate: (date: DateTimeInput, format?: string) => string;
|
formatDate: (date: DateTimeInput, format?: string) => string;
|
||||||
onClick: (annotation: AnnotationEvent) => void;
|
onClick: (annotation: AnnotationEvent) => void;
|
||||||
|
|||||||
37
public/app/plugins/panel/annolist/models.cue
Normal file
37
public/app/plugins/panel/annolist/models.cue
Normal file
@@ -0,0 +1,37 @@
|
|||||||
|
// Copyright 2022 Grafana Labs
|
||||||
|
//
|
||||||
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
|
// you may not use this file except in compliance with the License.
|
||||||
|
// You may obtain a copy of the License at
|
||||||
|
//
|
||||||
|
// http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
//
|
||||||
|
// Unless required by applicable law or agreed to in writing, software
|
||||||
|
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||||
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||||
|
// See the License for the specific language governing permissions and
|
||||||
|
// limitations under the License.
|
||||||
|
|
||||||
|
package grafanaschema
|
||||||
|
|
||||||
|
Panel: {
|
||||||
|
lineages: [
|
||||||
|
[
|
||||||
|
{
|
||||||
|
PanelOptions: {
|
||||||
|
onlyFromThisDashboard: bool | *false
|
||||||
|
onlyInTimeRange: bool | *false
|
||||||
|
tags: [...string]
|
||||||
|
limit: uint32 | *10
|
||||||
|
showUser: bool | *true
|
||||||
|
showTime: bool | *true
|
||||||
|
showTags: bool | *true
|
||||||
|
navigateToPanel: bool | *true
|
||||||
|
navigateBefore: string | *"10m"
|
||||||
|
navigateAfter: string | *"10m"
|
||||||
|
} @cuetsy(kind="interface")
|
||||||
|
}
|
||||||
|
]
|
||||||
|
]
|
||||||
|
migrations: []
|
||||||
|
}
|
||||||
@@ -1,29 +1,33 @@
|
|||||||
export interface AnnoOptions {
|
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||||
|
// This file was autogenerated by cuetsy. DO NOT EDIT!
|
||||||
|
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||||
|
|
||||||
|
|
||||||
|
export const modelVersion = Object.freeze([0, 0]);
|
||||||
|
|
||||||
|
|
||||||
|
export interface PanelOptions {
|
||||||
limit: number;
|
limit: number;
|
||||||
tags: string[];
|
navigateAfter: string;
|
||||||
|
navigateBefore: string;
|
||||||
|
navigateToPanel: boolean;
|
||||||
onlyFromThisDashboard: boolean;
|
onlyFromThisDashboard: boolean;
|
||||||
onlyInTimeRange: boolean;
|
onlyInTimeRange: boolean;
|
||||||
|
|
||||||
showTags: boolean;
|
showTags: boolean;
|
||||||
showUser: boolean;
|
|
||||||
showTime: boolean;
|
showTime: boolean;
|
||||||
|
showUser: boolean;
|
||||||
navigateBefore: string;
|
tags: string[];
|
||||||
navigateAfter: string;
|
|
||||||
navigateToPanel: boolean;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export const defaults: AnnoOptions = {
|
export const defaultPanelOptions: Partial<PanelOptions> = {
|
||||||
limit: 10,
|
limit: 10,
|
||||||
tags: [],
|
navigateAfter: '10m',
|
||||||
|
navigateBefore: '10m',
|
||||||
|
navigateToPanel: true,
|
||||||
onlyFromThisDashboard: false,
|
onlyFromThisDashboard: false,
|
||||||
onlyInTimeRange: false,
|
onlyInTimeRange: false,
|
||||||
|
|
||||||
showTags: true,
|
showTags: true,
|
||||||
showUser: true,
|
|
||||||
showTime: true,
|
showTime: true,
|
||||||
|
showUser: true,
|
||||||
navigateBefore: '10m',
|
tags: [],
|
||||||
navigateAfter: '10m',
|
|
||||||
navigateToPanel: true,
|
|
||||||
};
|
};
|
||||||
@@ -1,37 +1,36 @@
|
|||||||
import { truncate } from '@sentry/utils';
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import { PanelModel, PanelPlugin } from '@grafana/data';
|
import { PanelModel, PanelPlugin } from '@grafana/data';
|
||||||
import { TagsInput } from '@grafana/ui';
|
import { TagsInput } from '@grafana/ui';
|
||||||
|
|
||||||
import { AnnoListPanel } from './AnnoListPanel';
|
import { AnnoListPanel } from './AnnoListPanel';
|
||||||
import { AnnoOptions } from './types';
|
import { defaultPanelOptions, PanelOptions } from './models.gen';
|
||||||
|
|
||||||
export const plugin = new PanelPlugin<AnnoOptions>(AnnoListPanel)
|
export const plugin = new PanelPlugin<PanelOptions>(AnnoListPanel)
|
||||||
.setPanelOptions((builder) => {
|
.setPanelOptions((builder) => {
|
||||||
builder
|
builder
|
||||||
.addRadio({
|
.addRadio({
|
||||||
category: ['Annotation query'],
|
category: ['Annotation query'],
|
||||||
path: 'onlyFromThisDashboard',
|
path: 'onlyFromThisDashboard',
|
||||||
name: 'Query filter',
|
name: 'Query filter',
|
||||||
defaultValue: false,
|
defaultValue: defaultPanelOptions.onlyFromThisDashboard,
|
||||||
settings: {
|
settings: {
|
||||||
options: [
|
options: [
|
||||||
{ value: false, label: 'All dashboards' },
|
{ value: false, label: 'All dashboards' },
|
||||||
{ value: true, label: 'This dashboard' },
|
{ value: true, label: 'This dashboard' },
|
||||||
] as any, // does not like boolean, but works fine!
|
],
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
.addRadio({
|
.addRadio({
|
||||||
category: ['Annotation query'],
|
category: ['Annotation query'],
|
||||||
path: 'onlyInTimeRange',
|
path: 'onlyInTimeRange',
|
||||||
name: 'Time range',
|
name: 'Time range',
|
||||||
defaultValue: false,
|
defaultValue: defaultPanelOptions.onlyInTimeRange,
|
||||||
settings: {
|
settings: {
|
||||||
options: [
|
options: [
|
||||||
{ value: false, label: 'None' },
|
{ value: false, label: 'None' },
|
||||||
{ value: true, label: 'This dashboard' },
|
{ value: true, label: 'This dashboard' },
|
||||||
] as any, // does not like boolean, but works fine!
|
],
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
.addCustomEditor({
|
.addCustomEditor({
|
||||||
@@ -48,57 +47,58 @@ export const plugin = new PanelPlugin<AnnoOptions>(AnnoListPanel)
|
|||||||
category: ['Annotation query'],
|
category: ['Annotation query'],
|
||||||
path: 'limit',
|
path: 'limit',
|
||||||
name: 'Limit',
|
name: 'Limit',
|
||||||
defaultValue: 10,
|
defaultValue: defaultPanelOptions.limit,
|
||||||
})
|
})
|
||||||
.addBooleanSwitch({
|
.addBooleanSwitch({
|
||||||
category: ['Display'],
|
category: ['Display'],
|
||||||
path: 'showUser',
|
path: 'showUser',
|
||||||
name: 'Show user',
|
name: 'Show user',
|
||||||
defaultValue: true,
|
defaultValue: defaultPanelOptions.showUser,
|
||||||
})
|
})
|
||||||
.addBooleanSwitch({
|
.addBooleanSwitch({
|
||||||
category: ['Display'],
|
category: ['Display'],
|
||||||
path: 'showTime',
|
path: 'showTime',
|
||||||
name: 'Show time',
|
name: 'Show time',
|
||||||
defaultValue: true,
|
defaultValue: defaultPanelOptions.showTime,
|
||||||
})
|
})
|
||||||
.addBooleanSwitch({
|
.addBooleanSwitch({
|
||||||
category: ['Display'],
|
category: ['Display'],
|
||||||
path: 'showTags',
|
path: 'showTags',
|
||||||
name: 'Show tags',
|
name: 'Show tags',
|
||||||
defaultValue: true,
|
defaultValue: defaultPanelOptions.showTags,
|
||||||
})
|
})
|
||||||
.addRadio({
|
.addRadio({
|
||||||
category: ['Link behavior'],
|
category: ['Link behavior'],
|
||||||
path: 'navigateToPanel',
|
path: 'navigateToPanel',
|
||||||
name: 'Link target',
|
name: 'Link target',
|
||||||
defaultValue: truncate,
|
defaultValue: defaultPanelOptions.navigateToPanel,
|
||||||
settings: {
|
settings: {
|
||||||
options: [
|
options: [
|
||||||
{ value: true, label: 'Panel' },
|
{ value: true, label: 'Panel' },
|
||||||
{ value: false, label: 'Dashboard' },
|
{ value: false, label: 'Dashboard' },
|
||||||
] as any, // does not like boolean, but works fine!
|
],
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
.addTextInput({
|
.addTextInput({
|
||||||
category: ['Link behavior'],
|
category: ['Link behavior'],
|
||||||
path: 'navigateBefore',
|
path: 'navigateBefore',
|
||||||
name: 'Time before',
|
name: 'Time before',
|
||||||
defaultValue: '10m',
|
defaultValue: defaultPanelOptions.navigateBefore,
|
||||||
description: '',
|
description: '',
|
||||||
})
|
})
|
||||||
.addTextInput({
|
.addTextInput({
|
||||||
category: ['Link behavior'],
|
category: ['Link behavior'],
|
||||||
path: 'navigateAfter',
|
path: 'navigateAfter',
|
||||||
name: 'Time after',
|
name: 'Time after',
|
||||||
defaultValue: '10m',
|
defaultValue: defaultPanelOptions.navigateAfter,
|
||||||
description: '',
|
description: '',
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
// TODO, we should support this directly in the plugin infrastructure
|
// TODO, we should support this directly in the plugin infrastructure
|
||||||
.setPanelChangeHandler((panel: PanelModel<AnnoOptions>, prevPluginId: string, prevOptions: any) => {
|
.setPanelChangeHandler((panel: PanelModel<PanelOptions>, prevPluginId: string, prevOptions: unknown) => {
|
||||||
if (prevPluginId === 'ryantxu-annolist-panel') {
|
if (prevPluginId === 'ryantxu-annolist-panel') {
|
||||||
return prevOptions as AnnoOptions;
|
return prevOptions as PanelOptions;
|
||||||
}
|
}
|
||||||
|
|
||||||
return panel.options;
|
return panel.options;
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { PanelPlugin, VizOrientation } from '@grafana/data';
|
import { PanelPlugin, VizOrientation } from '@grafana/data';
|
||||||
import { commonOptionsBuilder, sharedSingleStatPanelChangedHandler } from '@grafana/ui';
|
import { commonOptionsBuilder, sharedSingleStatPanelChangedHandler } from '@grafana/ui';
|
||||||
|
|
||||||
import { addOrientationOption, addStandardDataReduceOptions } from '../stat/types';
|
import { addOrientationOption, addStandardDataReduceOptions } from '../stat/common';
|
||||||
|
|
||||||
import { barGaugePanelMigrationHandler } from './BarGaugeMigrations';
|
import { barGaugePanelMigrationHandler } from './BarGaugeMigrations';
|
||||||
import { BarGaugePanel } from './BarGaugePanel';
|
import { BarGaugePanel } from './BarGaugePanel';
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { PanelPlugin } from '@grafana/data';
|
import { PanelPlugin } from '@grafana/data';
|
||||||
import { commonOptionsBuilder } from '@grafana/ui';
|
import { commonOptionsBuilder } from '@grafana/ui';
|
||||||
|
|
||||||
import { addOrientationOption, addStandardDataReduceOptions } from '../stat/types';
|
import { addOrientationOption, addStandardDataReduceOptions } from '../stat/common';
|
||||||
|
|
||||||
import { gaugePanelMigrationHandler, gaugePanelChangedHandler } from './GaugeMigrations';
|
import { gaugePanelMigrationHandler, gaugePanelChangedHandler } from './GaugeMigrations';
|
||||||
import { GaugePanel } from './GaugePanel';
|
import { GaugePanel } from './GaugePanel';
|
||||||
|
|||||||
@@ -2,7 +2,7 @@ import { FieldColorModeId, FieldConfigProperty, PanelPlugin } from '@grafana/dat
|
|||||||
import { LegendDisplayMode } from '@grafana/schema';
|
import { LegendDisplayMode } from '@grafana/schema';
|
||||||
import { commonOptionsBuilder } from '@grafana/ui';
|
import { commonOptionsBuilder } from '@grafana/ui';
|
||||||
|
|
||||||
import { addStandardDataReduceOptions } from '../stat/types';
|
import { addStandardDataReduceOptions } from '../stat/common';
|
||||||
|
|
||||||
import { PieChartPanel } from './PieChartPanel';
|
import { PieChartPanel } from './PieChartPanel';
|
||||||
import { PieChartPanelChangedHandler } from './migrations';
|
import { PieChartPanelChangedHandler } from './migrations';
|
||||||
|
|||||||
@@ -1,6 +1,5 @@
|
|||||||
import { PanelModel } from '@grafana/data';
|
import { PanelModel } from '@grafana/data';
|
||||||
import { BigValueGraphMode, BigValueColorMode } from '@grafana/ui';
|
import { BigValueGraphMode, BigValueColorMode, BigValueTextMode } from '@grafana/schema';
|
||||||
import { BigValueTextMode } from '@grafana/ui/src/components/BigValue/BigValue';
|
|
||||||
|
|
||||||
import { statPanelChangedHandler } from './StatMigrations';
|
import { statPanelChangedHandler } from './StatMigrations';
|
||||||
|
|
||||||
|
|||||||
@@ -1,17 +1,17 @@
|
|||||||
import { FieldColorModeId, FieldConfigSource, PanelModel } from '@grafana/data';
|
import { FieldColorModeId, FieldConfigSource, PanelModel } from '@grafana/data';
|
||||||
import { sharedSingleStatPanelChangedHandler, BigValueGraphMode, BigValueColorMode } from '@grafana/ui';
|
import { BigValueTextMode, BigValueGraphMode, BigValueColorMode } from '@grafana/schema';
|
||||||
import { BigValueTextMode } from '@grafana/ui/src/components/BigValue/BigValue';
|
import { sharedSingleStatPanelChangedHandler } from '@grafana/ui';
|
||||||
|
|
||||||
import { StatPanelOptions } from './types';
|
import { PanelOptions } from './models.gen';
|
||||||
|
|
||||||
// This is called when the panel changes from another panel
|
// This is called when the panel changes from another panel
|
||||||
export const statPanelChangedHandler = (
|
export const statPanelChangedHandler = (
|
||||||
panel: PanelModel<Partial<StatPanelOptions>> | any,
|
panel: PanelModel<Partial<PanelOptions>> | any,
|
||||||
prevPluginId: string,
|
prevPluginId: string,
|
||||||
prevOptions: any
|
prevOptions: any
|
||||||
) => {
|
) => {
|
||||||
// This handles most config changes
|
// This handles most config changes
|
||||||
const options = sharedSingleStatPanelChangedHandler(panel, prevPluginId, prevOptions) as StatPanelOptions;
|
const options = sharedSingleStatPanelChangedHandler(panel, prevPluginId, prevOptions) as PanelOptions;
|
||||||
|
|
||||||
// Changing from angular singlestat
|
// Changing from angular singlestat
|
||||||
if (prevOptions.angular && (prevPluginId === 'singlestat' || prevPluginId === 'grafana-singlestat-panel')) {
|
if (prevOptions.angular && (prevPluginId === 'singlestat' || prevPluginId === 'grafana-singlestat-panel')) {
|
||||||
|
|||||||
@@ -11,20 +11,14 @@ import {
|
|||||||
PanelProps,
|
PanelProps,
|
||||||
} from '@grafana/data';
|
} from '@grafana/data';
|
||||||
import { findNumericFieldMinMax } from '@grafana/data/src/field/fieldOverrides';
|
import { findNumericFieldMinMax } from '@grafana/data/src/field/fieldOverrides';
|
||||||
import {
|
import { BigValueTextMode, BigValueGraphMode } from '@grafana/schema';
|
||||||
BigValue,
|
import { BigValue, DataLinksContextMenu, VizRepeater, VizRepeaterRenderValueProps } from '@grafana/ui';
|
||||||
BigValueGraphMode,
|
|
||||||
DataLinksContextMenu,
|
|
||||||
VizRepeater,
|
|
||||||
VizRepeaterRenderValueProps,
|
|
||||||
BigValueTextMode,
|
|
||||||
} from '@grafana/ui';
|
|
||||||
import { DataLinksContextMenuApi } from '@grafana/ui/src/components/DataLinks/DataLinksContextMenu';
|
import { DataLinksContextMenuApi } from '@grafana/ui/src/components/DataLinks/DataLinksContextMenu';
|
||||||
import { config } from 'app/core/config';
|
import { config } from 'app/core/config';
|
||||||
|
|
||||||
import { StatPanelOptions } from './types';
|
import { PanelOptions } from './models.gen';
|
||||||
|
|
||||||
export class StatPanel extends PureComponent<PanelProps<StatPanelOptions>> {
|
export class StatPanel extends PureComponent<PanelProps<PanelOptions>> {
|
||||||
renderComponent = (
|
renderComponent = (
|
||||||
valueProps: VizRepeaterRenderValueProps<FieldDisplay, DisplayValueAlignmentFactors>,
|
valueProps: VizRepeaterRenderValueProps<FieldDisplay, DisplayValueAlignmentFactors>,
|
||||||
menuProps: DataLinksContextMenuApi
|
menuProps: DataLinksContextMenuApi
|
||||||
|
|||||||
@@ -1,27 +1,14 @@
|
|||||||
|
// These are used in some other plugins for some reason
|
||||||
|
|
||||||
import {
|
import {
|
||||||
ReducerID,
|
escapeStringForRegex,
|
||||||
standardEditorsRegistry,
|
|
||||||
FieldOverrideContext,
|
FieldOverrideContext,
|
||||||
getFieldDisplayName,
|
getFieldDisplayName,
|
||||||
escapeStringForRegex,
|
|
||||||
VizOrientation,
|
|
||||||
PanelOptionsEditorBuilder,
|
PanelOptionsEditorBuilder,
|
||||||
|
ReducerID,
|
||||||
|
standardEditorsRegistry,
|
||||||
} from '@grafana/data';
|
} from '@grafana/data';
|
||||||
import {
|
import { SingleStatBaseOptions, VizOrientation } from '@grafana/schema';
|
||||||
SingleStatBaseOptions,
|
|
||||||
BigValueColorMode,
|
|
||||||
BigValueGraphMode,
|
|
||||||
BigValueJustifyMode,
|
|
||||||
BigValueTextMode,
|
|
||||||
} from '@grafana/ui';
|
|
||||||
|
|
||||||
// Structure copied from angular
|
|
||||||
export interface StatPanelOptions extends SingleStatBaseOptions {
|
|
||||||
graphMode: BigValueGraphMode;
|
|
||||||
colorMode: BigValueColorMode;
|
|
||||||
justifyMode: BigValueJustifyMode;
|
|
||||||
textMode: BigValueTextMode;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function addStandardDataReduceOptions<T extends SingleStatBaseOptions>(
|
export function addStandardDataReduceOptions<T extends SingleStatBaseOptions>(
|
||||||
builder: PanelOptionsEditorBuilder<T>,
|
builder: PanelOptionsEditorBuilder<T>,
|
||||||
@@ -64,6 +51,7 @@ export function addStandardDataReduceOptions<T extends SingleStatBaseOptions>(
|
|||||||
description: 'Choose a reducer function / calculation',
|
description: 'Choose a reducer function / calculation',
|
||||||
category: valueOptionsCategory,
|
category: valueOptionsCategory,
|
||||||
editor: standardEditorsRegistry.get('stats-picker').editor as any,
|
editor: standardEditorsRegistry.get('stats-picker').editor as any,
|
||||||
|
// TODO: Get ReducerID from generated schema one day?
|
||||||
defaultValue: [ReducerID.lastNotNull],
|
defaultValue: [ReducerID.lastNotNull],
|
||||||
// Hides it when all values mode is on
|
// Hides it when all values mode is on
|
||||||
showIf: (currentConfig) => currentConfig.reduceOptions.values === false,
|
showIf: (currentConfig) => currentConfig.reduceOptions.values === false,
|
||||||
@@ -22,10 +22,10 @@ Panel: {
|
|||||||
{
|
{
|
||||||
PanelOptions: {
|
PanelOptions: {
|
||||||
ui.SingleStatBaseOptions
|
ui.SingleStatBaseOptions
|
||||||
graphMode: ui.BigValueGraphMode
|
graphMode: ui.BigValueGraphMode | *"area"
|
||||||
colorMode: ui.BigValueColorMode
|
colorMode: ui.BigValueColorMode | *"value"
|
||||||
justifyMode: ui.BigValueJustifyMode
|
justifyMode: ui.BigValueJustifyMode | *"auto"
|
||||||
textMode: ui.BigValueTextMode
|
textMode: ui.BigValueTextMode | *"auto"
|
||||||
} @cuetsy(kind="interface")
|
} @cuetsy(kind="interface")
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|||||||
22
public/app/plugins/panel/stat/models.gen.ts
Normal file
22
public/app/plugins/panel/stat/models.gen.ts
Normal file
@@ -0,0 +1,22 @@
|
|||||||
|
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||||
|
// This file was autogenerated by cuetsy. DO NOT EDIT!
|
||||||
|
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||||
|
|
||||||
|
import * as ui from '@grafana/schema';
|
||||||
|
|
||||||
|
export const modelVersion = Object.freeze([0, 0]);
|
||||||
|
|
||||||
|
|
||||||
|
export interface PanelOptions extends ui.SingleStatBaseOptions {
|
||||||
|
colorMode: ui.BigValueColorMode;
|
||||||
|
graphMode: ui.BigValueGraphMode;
|
||||||
|
justifyMode: ui.BigValueJustifyMode;
|
||||||
|
textMode: ui.BigValueTextMode;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const defaultPanelOptions: Partial<PanelOptions> = {
|
||||||
|
colorMode: ui.BigValueColorMode.Value,
|
||||||
|
graphMode: ui.BigValueGraphMode.Area,
|
||||||
|
justifyMode: ui.BigValueJustifyMode.Auto,
|
||||||
|
textMode: ui.BigValueTextMode.Auto,
|
||||||
|
};
|
||||||
@@ -1,17 +1,14 @@
|
|||||||
import { PanelPlugin } from '@grafana/data';
|
import { PanelPlugin } from '@grafana/data';
|
||||||
import {
|
import { BigValueColorMode, BigValueGraphMode, BigValueJustifyMode, BigValueTextMode } from '@grafana/schema';
|
||||||
BigValueColorMode,
|
import { commonOptionsBuilder, sharedSingleStatMigrationHandler } from '@grafana/ui';
|
||||||
BigValueTextMode,
|
|
||||||
commonOptionsBuilder,
|
|
||||||
sharedSingleStatMigrationHandler,
|
|
||||||
} from '@grafana/ui';
|
|
||||||
|
|
||||||
import { statPanelChangedHandler } from './StatMigrations';
|
import { statPanelChangedHandler } from './StatMigrations';
|
||||||
import { StatPanel } from './StatPanel';
|
import { StatPanel } from './StatPanel';
|
||||||
|
import { addStandardDataReduceOptions, addOrientationOption } from './common';
|
||||||
|
import { defaultPanelOptions, PanelOptions } from './models.gen';
|
||||||
import { StatSuggestionsSupplier } from './suggestions';
|
import { StatSuggestionsSupplier } from './suggestions';
|
||||||
import { addOrientationOption, addStandardDataReduceOptions, StatPanelOptions } from './types';
|
|
||||||
|
|
||||||
export const plugin = new PanelPlugin<StatPanelOptions>(StatPanel)
|
export const plugin = new PanelPlugin<PanelOptions>(StatPanel)
|
||||||
.useFieldConfig()
|
.useFieldConfig()
|
||||||
.setPanelOptions((builder) => {
|
.setPanelOptions((builder) => {
|
||||||
const mainCategory = ['Stat styles'];
|
const mainCategory = ['Stat styles'];
|
||||||
@@ -34,7 +31,7 @@ export const plugin = new PanelPlugin<StatPanelOptions>(StatPanel)
|
|||||||
{ value: BigValueTextMode.None, label: 'None' },
|
{ value: BigValueTextMode.None, label: 'None' },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
defaultValue: 'auto',
|
defaultValue: defaultPanelOptions.textMode,
|
||||||
});
|
});
|
||||||
|
|
||||||
builder
|
builder
|
||||||
@@ -56,23 +53,23 @@ export const plugin = new PanelPlugin<StatPanelOptions>(StatPanel)
|
|||||||
name: 'Graph mode',
|
name: 'Graph mode',
|
||||||
description: 'Stat panel graph / sparkline mode',
|
description: 'Stat panel graph / sparkline mode',
|
||||||
category: mainCategory,
|
category: mainCategory,
|
||||||
defaultValue: 'area',
|
defaultValue: defaultPanelOptions.graphMode,
|
||||||
settings: {
|
settings: {
|
||||||
options: [
|
options: [
|
||||||
{ value: 'none', label: 'None' },
|
{ value: BigValueGraphMode.None, label: 'None' },
|
||||||
{ value: 'area', label: 'Area' },
|
{ value: BigValueGraphMode.Area, label: 'Area' },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
.addRadio({
|
.addRadio({
|
||||||
path: 'justifyMode',
|
path: 'justifyMode',
|
||||||
name: 'Text alignment',
|
name: 'Text alignment',
|
||||||
defaultValue: 'auto',
|
defaultValue: defaultPanelOptions.justifyMode,
|
||||||
category: mainCategory,
|
category: mainCategory,
|
||||||
settings: {
|
settings: {
|
||||||
options: [
|
options: [
|
||||||
{ value: 'auto', label: 'Auto' },
|
{ value: BigValueJustifyMode.Auto, label: 'Auto' },
|
||||||
{ value: 'center', label: 'Center' },
|
{ value: BigValueJustifyMode.Center, label: 'Center' },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
import { VisualizationSuggestionsBuilder } from '@grafana/data';
|
import { VisualizationSuggestionsBuilder } from '@grafana/data';
|
||||||
import { BigValueColorMode, BigValueGraphMode } from '@grafana/ui';
|
import { BigValueColorMode, BigValueGraphMode } from '@grafana/schema';
|
||||||
import { SuggestionName } from 'app/types/suggestions';
|
import { SuggestionName } from 'app/types/suggestions';
|
||||||
|
|
||||||
import { StatPanelOptions } from './types';
|
import { PanelOptions } from './models.gen';
|
||||||
|
|
||||||
export class StatSuggestionsSupplier {
|
export class StatSuggestionsSupplier {
|
||||||
getSuggestionsForData(builder: VisualizationSuggestionsBuilder) {
|
getSuggestionsForData(builder: VisualizationSuggestionsBuilder) {
|
||||||
@@ -12,7 +12,7 @@ export class StatSuggestionsSupplier {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const list = builder.getListAppender<StatPanelOptions, {}>({
|
const list = builder.getListAppender<PanelOptions, {}>({
|
||||||
name: SuggestionName.Stat,
|
name: SuggestionName.Stat,
|
||||||
pluginId: 'stat',
|
pluginId: 'stat',
|
||||||
options: {},
|
options: {},
|
||||||
|
|||||||
@@ -1,9 +1,11 @@
|
|||||||
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||||
// This file was almost autogenerated by cuetsy.
|
// This file was autogenerated by cuetsy. DO NOT EDIT!
|
||||||
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||||
|
|
||||||
|
|
||||||
export const modelVersion = Object.freeze([0, 0]);
|
export const modelVersion = Object.freeze([0, 0]);
|
||||||
|
|
||||||
|
|
||||||
export enum TextMode {
|
export enum TextMode {
|
||||||
HTML = 'html',
|
HTML = 'html',
|
||||||
Markdown = 'markdown',
|
Markdown = 'markdown',
|
||||||
@@ -14,7 +16,7 @@ export interface PanelOptions {
|
|||||||
mode: TextMode;
|
mode: TextMode;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const defaultPanelOptions: PanelOptions = {
|
export const defaultPanelOptions: Partial<PanelOptions> = {
|
||||||
content: `# Title
|
content: `# Title
|
||||||
|
|
||||||
For markdown syntax help: [commonmark.org/help](https://commonmark.org/help/)`,
|
For markdown syntax help: [commonmark.org/help](https://commonmark.org/help/)`,
|
||||||
|
|||||||
Reference in New Issue
Block a user