merged main and resloved conflicts

Signed-off-by: Eric Wei <[email protected]>
opensearch-project · Sep 26, 2022 · 0c3b35b · 0c3b35b
2 parents 764a718 + 3ce8d87
commit 0c3b35b
Show file tree

Hide file tree

Showing 41 changed files with 944 additions and 798 deletions.
diff --git a/dashboards-observability/common/constants/explorer.ts b/dashboards-observability/common/constants/explorer.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { visChartTypes } from './shared';
+import { VIS_CHART_TYPES } from './shared';
 export const EVENT_ANALYTICS_DOCUMENTATION_URL =
   'https://opensearch.org/docs/latest/observability-plugin/event-analytics/';
 export const OPEN_TELEMETRY_LOG_CORRELATION_LINK =
@@ -81,11 +81,11 @@ export const DEFAULT_AVAILABILITY_QUERY = 'stats count() by span( timestamp, 1h
 export const ADD_BUTTON_TEXT = '+ Add color theme';
 
 export const VIZ_CONTAIN_XY_AXIS = [
-  visChartTypes.Bar,
-  visChartTypes.Histogram,
-  visChartTypes.Line,
-  visChartTypes.Pie,
-  visChartTypes.Scatter,
+  VIS_CHART_TYPES.Bar,
+  VIS_CHART_TYPES.Histogram,
+  VIS_CHART_TYPES.Line,
+  VIS_CHART_TYPES.Pie,
+  VIS_CHART_TYPES.Scatter,
 ];
 
 // default ppl aggregation method options
@@ -120,7 +120,16 @@ export const AGGREGATION_OPTIONS = [
 ];
 
 // numeric fields type for metrics
-export const numericalTypes = ['float', 'double', 'bigint', 'long', 'octet', 'short', 'byte', 'integer'];
+export const numericalTypes = [
+  'float',
+  'double',
+  'bigint',
+  'long',
+  'octet',
+  'short',
+  'byte',
+  'integer',
+];
 // Data table constants
 export const GRID_HEADER_COLUMN_MAX_WIDTH = '150px';
 export const GRID_PAGE_RANGE_DISPLAY = 5;
@@ -136,19 +145,33 @@ export const HEADER_HEIGHT = 35;
 
 // gauge chart default parameters
 export interface DefaultGaugeChartParametersProps {
-  GaugeTitleSize: number,
-  DisplayDefaultGauges: number,
-  OrientationDefault: string,
-  TickLength: number, 
-  LegendPlacement: string,
-  ThresholdsMaxLimit: number
-};
+  GaugeTitleSize: number;
+  DisplayDefaultGauges: number;
+  OrientationDefault: string;
+  TickLength: number;
+  LegendPlacement: string;
+  ThresholdsMaxLimit: number;
+}
 
-export const DefaultGaugeChartParameters: DefaultGaugeChartParametersProps = {
+export const DEFAULT_GAUGE_CHART_PARAMETERS: DefaultGaugeChartParametersProps = {
   GaugeTitleSize: 14,
   DisplayDefaultGauges: 1,
   OrientationDefault: 'h',
   TickLength: 5,
   LegendPlacement: 'center',
-  ThresholdsMaxLimit: 1
+  ThresholdsMaxLimit: 1,
+};
+
+// pie chart default parameters
+export const PLOTLY_PIE_COLUMN_NUMBER = 2;
+export const PIE_XAXIS_GAP = 0.2;
+export const PIE_YAXIS_GAP = 0.1;
+export interface DefaultPieChartParameterProps {
+  DefaultMode: string;
 }
+
+export const DEFAULT_PIE_CHART_PARAMETERS: DefaultPieChartParameterProps = {
+  DefaultMode: 'pie',
+};
+export const GROUPBY = 'dimensions';
+export const AGGREGATIONS = 'series';
diff --git a/dashboards-observability/common/constants/shared.ts b/dashboards-observability/common/constants/shared.ts
@@ -2,8 +2,6 @@
  * Copyright OpenSearch Contributors
  * SPDX-License-Identifier: Apache-2.0
  */
-
-import { IField } from '../../common/types/explorer';
 import CSS from 'csstype';
 
 // Client route
@@ -72,7 +70,7 @@ export const pageStyles: CSS.Properties = {
   maxWidth: '1130px',
 };
 
-export enum visChartTypes {
+export enum VIS_CHART_TYPES {
   Bar = 'bar',
   HorizontalBar = 'horizontal_bar',
   Line = 'line',
@@ -86,30 +84,20 @@ export enum visChartTypes {
   LogsView = 'logs_view',
 }
 
-export interface ValueOptionsAxes {
-  xaxis?: IField[];
-  yaxis?: IField[];
-  zaxis?: IField[];
-  childField?: IField[];
-  valueField?: IField[];
-  series?: IField[];
-  value?: IField[];
-}
-
 export const NUMERICAL_FIELDS = ['short', 'integer', 'long', 'float', 'double'];
 
 export const ENABLED_VIS_TYPES = [
-  visChartTypes.Bar,
-  visChartTypes.HorizontalBar,
-  visChartTypes.Line,
-  visChartTypes.Pie,
-  visChartTypes.HeatMap,
-  visChartTypes.Text,
-  visChartTypes.TreeMap,
-  visChartTypes.Gauge,
-  visChartTypes.Histogram,
-  visChartTypes.Scatter,
-  visChartTypes.LogsView,
+  VIS_CHART_TYPES.Bar,
+  VIS_CHART_TYPES.HorizontalBar,
+  VIS_CHART_TYPES.Line,
+  VIS_CHART_TYPES.Pie,
+  VIS_CHART_TYPES.HeatMap,
+  VIS_CHART_TYPES.Text,
+  VIS_CHART_TYPES.TreeMap,
+  VIS_CHART_TYPES.Gauge,
+  VIS_CHART_TYPES.Histogram,
+  VIS_CHART_TYPES.Scatter,
+  VIS_CHART_TYPES.LogsView,
 ];
 
 //Live tail constants
@@ -175,7 +163,7 @@ export interface DefaultChartStylesProps {
   DefaultModeScatter: string;
 }
 
-export const DefaultChartStyles: DefaultChartStylesProps = {
+export const DEFAULT_CHART_STYLES: DefaultChartStylesProps = {
   DefaultModeLine: 'lines',
   Interpolation: 'spline',
   LineWidth: 2,

diff --git a/dashboards-observability/common/query_manager/ast/types/stats.ts b/dashboards-observability/common/query_manager/ast/types/stats.ts
@@ -53,15 +53,15 @@ export interface ExpressionChunk {
   value: string | number;
 }
 
-export interface DataConfigMetric {
+export interface DataConfigSeries {
   alias: string;
   label: string;
   name: string;
   aggregation: string;
 }
 
 export interface AggregationConfigurations {
-  metrics: Array<DataConfigMetric>;
+  series: Array<DataConfigSeries>;
   dimensions: Array<GroupField>;
   span: SpanChunk;
 }

diff --git a/dashboards-observability/common/query_manager/utils/index.ts b/dashboards-observability/common/query_manager/utils/index.ts
@@ -10,7 +10,7 @@ export const composeAggregations = (
   staleStats: PreviouslyParsedStaleStats
 ) => {
   return {
-    aggregations: aggConfig.metrics.map((metric) => ({
+    aggregations: aggConfig.series.map((metric) => ({
       function_alias: metric.alias,
       function: {
         name: metric.aggregation,

diff --git a/dashboards-observability/common/types/explorer.ts b/dashboards-observability/common/types/explorer.ts
@@ -5,6 +5,7 @@
 
 import { History } from 'history';
 import Plotly from 'plotly.js-dist';
+import { QueryManager } from 'common/query_manager';
 import {
   RAW_QUERY,
   SELECTED_FIELDS,
@@ -15,13 +16,21 @@ import {
   FINAL_QUERY,
   SELECTED_TIMESTAMP,
   SELECTED_DATE_RANGE,
+  GROUPBY,
+  AGGREGATIONS,
 } from '../constants/explorer';
-import { CoreStart, HttpSetup, HttpStart, NotificationsStart } from '../../../../src/core/public';
+import {
+  CoreStart,
+  CoreSetup,
+  HttpSetup,
+  HttpStart,
+  NotificationsStart,
+} from '../../../../src/core/public';
 import SavedObjects from '../../public/services/saved_objects/event_analytics/saved_objects';
 import TimestampUtils from '../../public/services/timestamp/timestamp';
 import PPLService from '../../public/services/requests/ppl';
 import DSLService from '../../public/services/requests/dsl';
-
+import { SavedObjectsStart } from '../../../../src/core/public/saved_objects';
 export interface IQueryTab {
   id: string;
   name: React.ReactNode | string;
@@ -34,6 +43,13 @@ export interface IField {
   label?: string;
 }
 
+export interface ExplorerFields {
+  availableFields: IField[];
+  queriedFields: IField[];
+  selectedFields: IField[];
+  unselectedFields: IField[];
+}
+
 export interface ITabQueryResults {
   [tabId: string]: any;
 }
@@ -83,6 +99,7 @@ export interface ILogExplorerProps {
   ) => void;
   savedObjectId: string;
   getExistingEmptyTab: (params: EmptyTabParams) => string;
+  qm: QueryManager;
 }
 
 export interface IExplorerProps {
@@ -113,6 +130,7 @@ export interface IExplorerProps {
   appBaseQuery?: string;
   callback?: any;
   callbackInApp?: any;
+  qm: QueryManager;
 }
 
 export interface SavedQuery {
@@ -278,8 +296,35 @@ export interface DimensionSpan {
 }
 
 export interface ConfigList {
-  dimensions?: ConfigListEntry[] | HistogramConfigList[];
-  metrics?: ConfigListEntry[];
+  [GROUPBY]?: ConfigListEntry[] | HistogramConfigList[];
+  [AGGREGATIONS]?: ConfigListEntry[];
   breakdowns?: ConfigListEntry[] | HistogramConfigList[];
   span?: DimensionSpan;
 }
+
+export interface Breadcrumbs {
+  text: string;
+  href: string;
+}
+
+export interface EventAnalyticsProps {
+  chrome: CoreSetup;
+  parentBreadcrumbs: Breadcrumbs[];
+  pplService: any;
+  dslService: any;
+  savedObjects: SavedObjectsStart;
+  timestampUtils: TimestampUtils;
+  http: HttpStart;
+  notifications: NotificationsStart;
+  qm: QueryManager;
+}
+
+export interface DataConfigPanelProps {
+  fieldOptionList: IField[];
+  visualizations: IVisualizationContainerProps;
+  qm?: QueryManager;
+}
+export interface GetTooltipHoverInfoType {
+  tooltipMode: string;
+  tooltipText: string;
+}
diff --git a/dashboards-observability/public/components/app.tsx b/dashboards-observability/public/components/app.tsx
@@ -7,6 +7,7 @@ import { I18nProvider } from '@osd/i18n/react';
 import React from 'react';
 import { Provider } from 'react-redux';
 import { HashRouter, Route, Switch } from 'react-router-dom';
+import { QueryManager } from 'common/query_manager';
 import { CoreStart } from '../../../../src/core/public';
 import { observabilityID, observabilityTitle } from '../../common/constants/shared';
 import store from '../framework/redux/store';
@@ -24,6 +25,7 @@ interface ObservabilityAppDeps {
   dslService: any;
   savedObjects: any;
   timestampUtils: any;
+  qm: QueryManager;
 }
 
 // for cypress to test redux store
@@ -38,6 +40,7 @@ export const App = ({
   dslService,
   savedObjects,
   timestampUtils,
+  qm,
 }: ObservabilityAppDeps) => {
   const { chrome, http, notifications } = CoreStartProp;
   const parentBreadcrumb = {
@@ -130,6 +133,7 @@ export const App = ({
                       timestampUtils={timestampUtils}
                       http={http}
                       notifications={notifications}
+                      qm={qm}
                       {...props}
                     />
                   );