Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature/metrics chart #4

Open
wants to merge 8 commits into
base: main
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 18 additions & 0 deletions dashboards-observability/common/constants/explorer.ts
Original file line number Diff line number Diff line change
@@ -248,3 +248,21 @@ export enum ConfigChartOptionsEnum {

export const CUSTOM_LABEL = 'customLabel';
export const BREAKDOWNS = 'breakdowns';

export const METRICS_AGGREGATION_OPTIONS = [
{
label: 'COUNT',
},
{
label: 'SUM',
},
{
label: 'AVERAGE',
},
{
label: 'MAX',
},
{
label: 'MIN',
},
];
2 changes: 2 additions & 0 deletions dashboards-observability/common/constants/shared.ts
Original file line number Diff line number Diff line change
@@ -85,6 +85,7 @@ export enum VIS_CHART_TYPES {
LogsView = 'logs_view',
Stats = 'stats',
TableView = 'data_table',
Metrics = 'metrics',
}

export const NUMERICAL_FIELDS = ['short', 'integer', 'long', 'float', 'double'];
@@ -103,6 +104,7 @@ export const ENABLED_VIS_TYPES = [
VIS_CHART_TYPES.LogsView,
VIS_CHART_TYPES.Stats,
VIS_CHART_TYPES.TableView,
VIS_CHART_TYPES.Metrics,
];

// Live tail constants
13 changes: 13 additions & 0 deletions dashboards-observability/common/types/explorer.ts
Original file line number Diff line number Diff line change
@@ -211,6 +211,7 @@ export interface IVisualizationContainerPropsData {
}

export interface IVisualizationContainerPropsVis {
name: any;
vis: IVisualizationTypeDefination;
}

@@ -359,3 +360,15 @@ export interface DataConfigPanelFieldProps {
handleServiceRemove: (index: number, name: string) => void;
handleServiceEdit: (isClose: boolean, arrIndex: number, sectionName: string) => void;
}

export interface MetricListEntry {
label: string;
aggregation: string[];
[CUSTOM_LABEL]: string;
name: string;
}

export interface MetricList {
[AGGREGATIONS]?: MetricListEntry[];
[GROUPBY]: [];
}
Original file line number Diff line number Diff line change
@@ -92,7 +92,7 @@ exports[`Visualization Flyout Component renders add visualization Flyout 1`] = `
ownFocus={false}
size="m"
>
<OuiWindowEvent
<EuiWindowEvent
event="keydown"
handler={[Function]}
/>
@@ -1319,7 +1319,7 @@ exports[`Visualization Flyout Component renders replace visualization Flyout 1`]
ownFocus={false}
size="m"
>
<OuiWindowEvent
<EuiWindowEvent
event="keydown"
handler={[Function]}
/>
Original file line number Diff line number Diff line change
@@ -192,11 +192,13 @@ exports[`No result component Renders No result component 1`] = `
</h2>
<p>
<FormattedMessage
defaultMessage="Your query may not match anything in the current time range, or there may not be any data at all in the currently selected time range. Try change time range, query filters or choose different time fields"
defaultMessage="Your query may not match anything in the current time range, or there may not be any data at all in
the currently selected time range. Try change time range, query filters or choose different time fields"
id="discover.noResults.queryMayNotMatchTitle"
values={Object {}}
>
Your query may not match anything in the current time range, or there may not be any data at all in the currently selected time range. Try change time range, query filters or choose different time fields
Your query may not match anything in the current time range, or there may not be any data at all in
the currently selected time range. Try change time range, query filters or choose different time fields
</FormattedMessage>
</p>
</div>
Original file line number Diff line number Diff line change
@@ -3728,6 +3728,108 @@ exports[`Config panel component Renders config panel with visualization data 1`]
},
},
},
Object {
"category": "Visualizations",
"categoryaxis": "xaxis",
"component": [Function],
"editorconfig": Object {
"panelTabs": Array [
Object {
"editor": [Function],
"id": "data-panel",
"mapTo": "dataConfig",
"name": "Style",
"sections": Array [
Object {
"editor": [Function],
"id": "color-theme",
"mapTo": "colorTheme",
"name": "Color theme",
"schemas": Array [],
},
Object {
"editor": [Function],
"id": "fontSize",
"mapTo": "fontSize",
"name": "Metric FontSize",
"schemas": Array [
Object {
"component": [Function],
"eleType": "input",
"mapTo": "fontSize",
"name": "Font size",
"title": "Font size",
},
],
},
],
},
],
},
"fulllabel": "Metrics",
"icon": [Function],
"icontype": "visTable",
"id": "metrics",
"label": "Metrics",
"name": "metrics",
"selection": Object {
"dataLoss": "nothing",
},
"seriesaxis": "yaxis",
"type": "metrics",
"visconfig": Object {
"config": Object {
"barmode": "line",
"displaylogo": false,
"responsive": true,
"xaxis": Object {
"automargin": true,
},
"yaxis": Object {
"automargin": true,
},
},
"layout": Object {
"colorway": Array [
"#3CA1C7",
"#8C55A3",
"#DB748A",
"#F2BE4B",
"#68CCC2",
"#2A7866",
"#843769",
"#374FB8",
"#BD6F26",
"#4C636F",
],
"height": 1180,
"legend": Object {
"orientation": "v",
"traceorder": "normal",
},
"margin": Object {
"b": 30,
"l": 60,
"pad": 0,
"r": 30,
"t": 50,
},
"paper_bgcolor": "rgba(0, 0, 0, 0)",
"plot_bgcolor": "rgba(0, 0, 0, 0)",
"showlegend": true,
"xaxis": Object {
"fixedrange": true,
"showgrid": false,
"visible": true,
},
"yaxis": Object {
"fixedrange": true,
"showgrid": false,
"visible": true,
},
},
},
},
]
}
placeholder="Select a chart"
Original file line number Diff line number Diff line change
@@ -8,7 +8,12 @@ import { EuiAccordion, EuiSpacer } from '@elastic/eui';
import { ButtonGroupItem } from './config_button_group';
import { IConfigPanelOptionSection } from '../../../../../../../../common/types/explorer';

export const ConfigLegend = ({ schemas, vizState, handleConfigChange }: any) => {
export const ConfigLegend = ({
schemas,
vizState,
handleConfigChange,
sectionName = 'Legend',
}: any) => {
const handleConfigurationChange = useCallback(
(stateFiledName) => {
return (changes) => {
@@ -50,15 +55,20 @@ export const ConfigLegend = ({ schemas, vizState, handleConfigChange }: any) =>
}
return (
<Fragment key={`viz-series-${index}`}>
<DimensionComponent {...params} />
<DimensionComponent {...params} />
<EuiSpacer size="s" />
</Fragment>
);
});
}, [schemas, vizState, handleConfigurationChange]);

return (
<EuiAccordion initialIsOpen id="configPanel__legend" buttonContent="Legend" paddingSize="s">
<EuiAccordion
initialIsOpen
id="configPanel__legend"
buttonContent={sectionName}
paddingSize="s"
>
{dimensions}
</EuiAccordion>
);
Original file line number Diff line number Diff line change
@@ -446,9 +446,13 @@ export const DataConfigPanelItem = ({
<EuiSpacer size="s" />
{visualizations.vis.name !== VIS_CHART_TYPES.Histogram ? (
<>
{DataConfigPanelFields(getRenderFieldsObj(AGGREGATIONS))}
<EuiSpacer size="s" />
{DataConfigPanelFields(getRenderFieldsObj(GROUPBY))}
{visualizations.vis.name !== VIS_CHART_TYPES.Metrics && (
<>
{DataConfigPanelFields(getRenderFieldsObj(AGGREGATIONS))}
<EuiSpacer size="s" />
{DataConfigPanelFields(getRenderFieldsObj(GROUPBY))}
</>
)}
<EuiSpacer size="s" />
<EuiTitle size="xxs">
<h3>Date Histogram</h3>
Loading