[Backport 2.x] [Home] Add support for otel sample data - logs, traces and metrics

changelogs/fragments/8587.yml

@@ -0,0 +1,2 @@
+feat:
+- Add support for otel sample data - logs, traces and metrics ([#8587](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8587))

src/plugins/home/public/application/components/sample_data_set_card.js

@@ -117,6 +117,7 @@ export class SampleDataSetCard extends React.Component {
             <EuiFlexItem grow={false}>
               <SampleDataViewDataButton
                 id={this.props.id}
+                dataSourceId={this.props.dataSourceId}
                 name={this.props.name}
                 overviewDashboard={this.props.overviewDashboard}
                 appLinks={this.props.appLinks}

src/plugins/home/public/application/components/sample_data_view_data_button.js

@@ -38,6 +38,8 @@
 
 export class SampleDataViewDataButton extends React.Component {
   addBasePath = getServices().addBasePath;
+  isDataSourceEnabled = !!getServices().dataSource;
+  chrome = getServices().chrome;
 
   state = {
     isPopoverOpen: false,
@@ -71,7 +73,7 @@
     const dashboardPath = `/app/dashboards#/view/${this.props.overviewDashboard}`;
     const prefixedDashboardPath = this.addBasePath(dashboardPath);
 
-    if (this.props.appLinks.length === 0) {
+    if (this.props.appLinks.length === 0 && this.props.overviewDashboard !== '') {
       return (
         <EuiSmallButton
           onClick={createAppNavigationHandler(dashboardPath)}
@@ -83,26 +85,40 @@
       );
     }
 
-    const additionalItems = this.props.appLinks.map(({ path, label, icon }) => {
-      return {
-        name: label,
-        icon: <EuiIcon type={icon} size="m" />,
-        href: this.addBasePath(path),
-        onClick: createAppNavigationHandler(path),
-      };
-    });
+    const additionalItems = this.props.appLinks.map(
+      ({ path, label, icon, newPath, appendDatasourceToPath }) => {
+        // switch paths if new nav is enabled
+        let appPath = this.chrome.navGroup.getNavGroupEnabled()
+          ? this.addBasePath(newPath)
+          : this.addBasePath(path);
+        // append datasourceId to app path
+        if (this.isDataSourceEnabled && appendDatasourceToPath) {
+          appPath = `${appPath}?datasourceId=${this.props.dataSourceId}`;
+        }
+        return {
+          name: label,
+          icon: <EuiIcon type={icon} size="m" />,
+          href: appPath,
+          onClick: createAppNavigationHandler(appPath),
+        };
+      }
+    );
     const panels = [
       {
         id: 0,
         items: [
-          {
-            name: i18n.translate('home.sampleDataSetCard.dashboardLinkLabel', {
-              defaultMessage: 'Dashboard',
-            }),
-            icon: <EuiIcon type="dashboardApp" size="m" />,
-            href: prefixedDashboardPath,
-            onClick: createAppNavigationHandler(dashboardPath),
-          },
+          ...(this.props.overviewDashboard !== ''
+            ? [
+                {
+                  name: i18n.translate('home.sampleDataSetCard.dashboardLinkLabel', {
+                    defaultMessage: 'Dashboard',
+                  }),
+                  icon: <EuiIcon type="dashboardApp" size="m" />,
+                  href: prefixedDashboardPath,
+                  onClick: createAppNavigationHandler(dashboardPath),
+                },
+              ]
+            : []),
           ...additionalItems,
         ],
       },

src/plugins/home/public/application/components/sample_data_view_data_button.test.js

@@ -36,6 +36,11 @@ import { SampleDataViewDataButton } from './sample_data_view_data_button';
 jest.mock('../opensearch_dashboards_services', () => ({
   getServices: () => ({
     addBasePath: (path) => `root${path}`,
+    chrome: {
+      navGroup: {
+        getNavGroupEnabled: jest.fn().mockReturnValue(true),
+      },
+    },
   }),
 }));
 

src/plugins/home/server/services/sample_data/data_sets/otel/index.ts

@@ -0,0 +1,101 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { i18n } from '@osd/i18n';
+import path from 'path';
+import { AppLinkSchema, SampleDatasetSchema } from '../../lib/sample_dataset_registry_types';
+import {
+  appendDataSourceId,
+  getSavedObjectsWithDataSource,
+  overwriteSavedObjectsWithWorkspaceId,
+} from '../util';
+import { logsFieldMappings } from './logs_field_mappings';
+import { metricsFieldMappings } from './metrics_field_mappings';
+import { servicesFieldMappings } from './services_field_mappings';
+import { tracesFieldMappings } from './traces_field_mappings';
+
+const otelDataName = i18n.translate('home.sampleData.otelSpecTitle', {
+  defaultMessage: 'Sample Observability Logs, Traces, and Metrics',
+});
+const otelDataDescription = i18n.translate('home.sampleData.otelSpecDescription', {
+  defaultMessage:
+    'Correlated observability signals for an e-commerce application in OpenTelemetry standard.',
+});
+const initialAppLinks: AppLinkSchema[] = [
+  {
+    path: 'observability-traces#/traces',
+    icon: 'apmTrace',
+    label: 'View traces',
+    newPath: 'observability-traces-nav#/traces',
+    appendDatasourceToPath: true,
+  },
+  {
+    path: 'observability-traces#/services',
+    icon: 'graphApp',
+    label: 'View services',
+    newPath: 'observability-services-nav#/services',
+    appendDatasourceToPath: true,
+  },
+];
+
+export const otelSpecProvider = function (): SampleDatasetSchema {
+  return {
+    id: 'otel',
+    name: otelDataName,
+    description: otelDataDescription,
+    previewImagePath: '/plugins/home/assets/sample_data_resources/otel/otel_traces.png',
+    darkPreviewImagePath: '/plugins/home/assets/sample_data_resources/otel/otel_traces_dark.png',
+    hasNewThemeImages: true,
+    overviewDashboard: '',
+    getDataSourceIntegratedDashboard: appendDataSourceId(''),
+    appLinks: initialAppLinks,
+    defaultIndex: '',
+    getDataSourceIntegratedDefaultIndex: appendDataSourceId(''),
+    savedObjects: [],
+    getDataSourceIntegratedSavedObjects: (dataSourceId?: string, dataSourceTitle?: string) =>
+      getSavedObjectsWithDataSource([], dataSourceId, dataSourceTitle),
+    getWorkspaceIntegratedSavedObjects: (workspaceId) =>
+      overwriteSavedObjectsWithWorkspaceId([], workspaceId),
+    dataIndices: [
+      {
+        id: 'otel-v1-apm-span-sample',
+        dataPath: path.join(__dirname, './sample_traces.json.gz'),
+        fields: tracesFieldMappings,
+        timeFields: ['startTime', 'endTime', 'traceGroupFields.endTime'], // TODO: add support for 'events.time'
+        currentTimeMarker: '2024-10-16T19:00:01',
+        preserveDayOfWeekTimeOfDay: false,
+        indexName: 'otel-v1-apm-span-sample',
+      },
+      {
+        id: 'otel-v1-apm-service-map-sample',
+        dataPath: path.join(__dirname, './sample_service_map.json.gz'),
+        fields: servicesFieldMappings,
+        timeFields: [],
+        currentTimeMarker: '2024-10-16T19:00:01',
+        preserveDayOfWeekTimeOfDay: false,
+        indexName: 'otel-v1-apm-service-map-sample',
+      },
+      {
+        id: 'ss4o_metrics-otel-sample',
+        dataPath: path.join(__dirname, './sample_metrics.json.gz'),
+        fields: metricsFieldMappings,
+        timeFields: ['@timestamp', 'exemplar.time', 'startTime', 'time', 'observedTimestamp'],
+        currentTimeMarker: '2024-10-16T19:00:01',
+        preserveDayOfWeekTimeOfDay: false,
+        indexName: 'ss4o_metrics-otel-sample',
+      },
+      {
+        id: 'ss4o_logs-otel-sample',
+        dataPath: path.join(__dirname, './sample_logs.json.gz'),
+        fields: logsFieldMappings,
+        timeFields: ['time', 'observedTime'],
+        currentTimeMarker: '2024-10-16T19:00:01',
+        preserveDayOfWeekTimeOfDay: false,
+        indexName: 'ss4o_logs-otel-sample',
+      },
+    ],
+    status: 'not_installed',
+  };
+};