Update components to be aware of the current tenant

Signed-off-by: Julian Quispel <[email protected]>

public/components/app.tsx

@@ -20,13 +20,15 @@ import { Home as MetricsHome } from './metrics/index';
 import { Main as NotebooksHome } from './notebooks/components/main';
 import { Home as TraceAnalyticsHome } from './trace_analytics/home';
 import { Home as DataConnectionsHome } from './datasources/home';
+import { PublicConfig } from '../plugin';
 
 interface ObservabilityAppDeps {
   CoreStartProp: CoreStart;
   DepsStart: AppPluginStartDependencies;
   pplService: any;
   dslService: any;
   savedObjects: any;
+  config: PublicConfig;
   timestampUtils: any;
   queryManager: QueryManager;
   startPage: string;
@@ -54,12 +56,13 @@ export const App = ({
   pplService,
   dslService,
   savedObjects,
+  config,
   timestampUtils,
   queryManager,
   startPage,
   dataSourcePluggables,
 }: ObservabilityAppDeps) => {
-  const { chrome, http, notifications, savedObjects: coreSavedObjects } = CoreStartProp;
+  const { chrome, http, notifications } = CoreStartProp;
   const parentBreadcrumb = {
     text: observabilityTitle,
     href: `${observabilityID}#/`,
@@ -83,6 +86,7 @@ export const App = ({
             pplService={pplService}
             dslService={dslService}
             savedObjects={savedObjects}
+            config={config}
             timestampUtils={timestampUtils}
             queryManager={queryManager}
             parentBreadcrumb={parentBreadcrumb}

public/components/application_analytics/components/config_components/service_config.tsx

@@ -24,6 +24,7 @@ import { handleServiceMapRequest } from '../../../trace_analytics/requests/servi
 import { AppAnalyticsComponentDeps } from '../../home';
 import { OptionType } from '../../../../../common/types/application_analytics';
 import { getClearModal } from '../../helpers/modal_containers';
+import { tenantName } from '../../../../components/trace_analytics/components/common/indices';
 
 interface ServiceConfigProps extends AppAnalyticsComponentDeps {
   dslService: DSLService;
@@ -50,7 +51,7 @@ export const ServiceConfig = (props: ServiceConfigProps) => {
   const [modalLayout, setModalLayout] = useState(<EuiOverlayMask />);
 
   useEffect(() => {
-    handleServiceMapRequest(http, dslService, mode, setServiceMap);
+    handleServiceMapRequest(http, dslService, mode, setServiceMap, undefined, tenantName);
   }, []);
 
   useEffect(() => {

public/components/application_analytics/components/flyout_components/service_detail_flyout.tsx

@@ -28,6 +28,7 @@ import { ServiceObject } from '../../../../../public/components/trace_analytics/
 import { SpanDetailTable } from '../../../../../public/components/trace_analytics/components/traces/span_detail_table';
 import { TraceAnalyticsComponentDeps } from '../../../../../public/components/trace_analytics/home';
 import { getListItem } from '../../helpers/utils';
+import { tenantName } from '../../../../components/trace_analytics/components/common/indices';
 
 interface ServiceFlyoutProps extends TraceAnalyticsComponentDeps {
   serviceName: string;
@@ -131,7 +132,7 @@ export function ServiceDetailFlyout(props: ServiceFlyoutProps) {
       appConfigs
     );
     handleServiceViewRequest(serviceName, http, serviceDSL, setFields, mode);
-    handleServiceMapRequest(http, serviceDSL, mode, setServiceMap, serviceName);
+    handleServiceMapRequest(http, serviceDSL, mode, setServiceMap, serviceName, tenantName);
     const spanDSL = filtersToDsl(mode, filters, query, startTime, endTime, 'app', appConfigs);
     spanDSL.query.bool.must.push({
       term: {

public/components/application_analytics/components/flyout_components/trace_detail_render.tsx

@@ -20,10 +20,17 @@ interface TraceDetailRenderProps {
   traceId: string;
   http: HttpStart;
   openSpanFlyout: (spanId: string) => void;
-  mode : TraceAnalyticsMode
+  mode: TraceAnalyticsMode;
+  tenant?: string;
 }
 
-export const TraceDetailRender = ({ traceId, http, openSpanFlyout, mode }: TraceDetailRenderProps) => {
+export const TraceDetailRender = ({
+  traceId,
+  http,
+  openSpanFlyout,
+  mode,
+  tenant,
+}: TraceDetailRenderProps) => {
   const [fields, setFields] = useState<any>({});
   const [serviceBreakdownData, setServiceBreakdownData] = useState([]);
   const [payloadData, setPayloadData] = useState('');
@@ -86,9 +93,16 @@ export const TraceDetailRender = ({ traceId, http, openSpanFlyout, mode }: Trace
   }, [traceId, fields, serviceBreakdownData, colorMap, payloadData]);
 
   useEffect(() => {
-    handleTraceViewRequest(traceId, http, fields, setFields, mode);
-    handleServicesPieChartRequest(traceId, http, setServiceBreakdownData, setColorMap, mode);
-    handlePayloadRequest(traceId, http, payloadData, setPayloadData, mode);
+    handleTraceViewRequest(traceId, http, fields, setFields, mode, tenant);
+    handleServicesPieChartRequest(
+      traceId,
+      http,
+      setServiceBreakdownData,
+      setColorMap,
+      mode,
+      tenant
+    );
+    handlePayloadRequest(traceId, http, payloadData, setPayloadData, mode, tenant);
   }, [traceId]);
 
   return renderContent;

public/components/index.tsx

@@ -7,8 +7,9 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import { QueryManager } from 'common/query_manager';
 import { AppMountParameters, CoreStart } from '../../../../src/core/public';
-import { AppPluginStartDependencies, SetupDependencies } from '../types';
+import { AppPluginStartDependencies } from '../types';
 import { App } from './app';
+import { PublicConfig } from '../plugin';
 
 export const Observability = (
   CoreStartProp: CoreStart,
@@ -20,7 +21,8 @@ export const Observability = (
   timestampUtils: any,
   queryManager: QueryManager,
   startPage: string,
-  dataSourcePluggables
+  dataSourcePluggables,
+  config: PublicConfig
 ) => {
   ReactDOM.render(
     <App
@@ -29,6 +31,7 @@ export const Observability = (
       pplService={pplService}
       dslService={dslService}
       savedObjects={savedObjects}
+      config={config}
       timestampUtils={timestampUtils}
       queryManager={queryManager}
       startPage={startPage}

public/components/trace_analytics/components/common/__tests__/__snapshots__/helper_functions.test.tsx.snap

@@ -116,6 +116,33 @@ exports[`Helper functions renders no match and missing configuration messages 2`
 </Fragment>
 `;
 
+exports[`Helper functions renders no match and missing configuration messages 3`] = `
+<Fragment>
+  <EuiEmptyPrompt
+    actions={
+      <EuiButton
+        color="primary"
+        iconSide="right"
+        iconType="popout"
+        onClick={[Function]}
+      >
+        Learn more
+      </EuiButton>
+    }
+    body={
+      <EuiText>
+        The indices required for trace analytics (otel-v1-apm-span-test* and otel-v1-apm-service-map-test*) do not exist or you do not have permission to access them.
+      </EuiText>
+    }
+    title={
+      <h2>
+        Trace Analytics not set up
+      </h2>
+    }
+  />
+</Fragment>
+`;
+
 exports[`Helper functions renders panel title 1`] = `
 <EuiText
   size="m"

public/components/trace_analytics/components/common/__tests__/helper_functions.test.tsx

@@ -5,7 +5,6 @@
 
 import { configure, mount, shallow } from 'enzyme';
 import Adapter from 'enzyme-adapter-react-16';
-import { TraceAnalyticsMode } from 'public/components/trace_analytics/home';
 import React from 'react';
 import { TEST_SERVICE_MAP, TEST_SERVICE_MAP_GRAPH } from '../../../../../../test/constants';
 import {
@@ -38,9 +37,15 @@ describe('Helper functions', () => {
 
   it('renders no match and missing configuration messages', () => {
     const noMatchMessage = shallow(<NoMatchMessage size="s" />);
-    const missingConfigurationMessage = shallow(<MissingConfigurationMessage mode='data_prepper'/>)
+    const missingConfigurationMessage = shallow(
+      <MissingConfigurationMessage mode="data_prepper" />
+    );
+    const missingConfigurationMessageWithTenant = shallow(
+      <MissingConfigurationMessage mode="data_prepper" tenant="test" />
+    );
     expect(noMatchMessage).toMatchSnapshot();
     expect(missingConfigurationMessage).toMatchSnapshot();
+    expect(missingConfigurationMessageWithTenant).toMatchSnapshot();
   });
 
   it('renders benchmark', () => {

public/components/trace_analytics/components/common/helper_functions.tsx

@@ -21,10 +21,7 @@ import { TraceAnalyticsMode } from '../../home';
 import { serviceMapColorPalette } from './color_palette';
 import { FilterType } from './filters/filters';
 import { ServiceObject } from './plots/service_map';
-
-const missingJaegerTracesConfigurationMessage = `The indices required for trace analytics (${JAEGER_INDEX_NAME} and ${JAEGER_SERVICE_INDEX_NAME}) do not exist or you do not have permission to access them.`;
-
-const missingDataPrepperTracesConfigurationMessage = `The indices required for trace analytics (${DATA_PREPPER_INDEX_NAME} and ${DATA_PREPPER_SERVICE_INDEX_NAME}) do not exist or you do not have permission to access them.`;
+import { getTenantIndexName } from '../../../../../common/utils/tenant_index_name';
 
 export function PanelTitle({ title, totalItems }: { title: string; totalItems?: number }) {
   return (
@@ -55,7 +52,23 @@ export function NoMatchMessage(props: { size: SpacerSize }) {
   );
 }
 
-export function MissingConfigurationMessage(props: { mode: TraceAnalyticsMode }) {
+export function MissingConfigurationMessage(props: { mode: TraceAnalyticsMode; tenant?: string }) {
+  const missingJaegerTracesConfigurationMessage = `The indices required for trace analytics (${getTenantIndexName(
+    JAEGER_INDEX_NAME,
+    props.tenant
+  )} and ${getTenantIndexName(
+    JAEGER_SERVICE_INDEX_NAME,
+    props.tenant
+  )}) do not exist or you do not have permission to access them.`;
+
+  const missingDataPrepperTracesConfigurationMessage = `The indices required for trace analytics (${getTenantIndexName(
+    DATA_PREPPER_INDEX_NAME,
+    props.tenant
+  )} and ${getTenantIndexName(
+    DATA_PREPPER_SERVICE_INDEX_NAME,
+    props.tenant
+  )}) do not exist or you do not have permission to access them.`;
+
   const missingConfigurationBody =
     props.mode === 'jaeger'
       ? missingJaegerTracesConfigurationMessage

public/components/trace_analytics/components/common/indices.ts

@@ -0,0 +1,41 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+export async function loadTenantInfo(multitenancyEnabled: boolean) {
+  if (!multitenancyEnabled) {
+    return;
+  }
+
+  return await fetch(`../api/v1/multitenancy/tenant`, {
+    headers: {
+      'Content-Type': 'application/json',
+      'osd-xsrf': 'true',
+      accept: '*/*',
+      'accept-language': 'en-US,en;q=0.9,zh-CN;q=0.8,zh;q=0.7,zh-TW;q=0.6',
+      pragma: 'no-cache',
+      'sec-fetch-dest': 'empty',
+      'sec-fetch-mode': 'cors',
+      'sec-fetch-site': 'same-origin',
+    },
+    method: 'GET',
+    referrerPolicy: 'strict-origin-when-cross-origin',
+    mode: 'cors',
+    credentials: 'include',
+  })
+    .then((response) => {
+      if (response.status === 404) {
+        // endpoint doesn't exist, security plugin is not enabled.
+        return undefined;
+      } else {
+        return response.text();
+      }
+    })
+    .then((tenant) => {
+      if (tenant === '' || tenant === '__user__') {
+        tenant = '';
+      }
+      return tenant;
+    });
+}

public/components/trace_analytics/components/dashboard/dashboard_content.tsx

@@ -15,7 +15,6 @@ import {
   handleJaegerDashboardRequest,
   handleJaegerErrorDashboardRequest,
 } from '../../requests/dashboard_request_handler';
-import { handleServiceMapRequest } from '../../requests/services_request_handler';
 import { FilterType } from '../common/filters/filters';
 import { getValidFilterFields } from '../common/filters/filter_helpers';
 import {
@@ -27,9 +26,7 @@ import {
   processTimeStamp,
 } from '../common/helper_functions';
 import { ErrorRatePlt } from '../common/plots/error_rate_plt';
-import { ServiceMap, ServiceObject } from '../common/plots/service_map';
 import { ThroughputPlt } from '../common/plots/throughput_plt';
-import { SearchBar } from '../common/search_bar';
 import { DashboardProps } from './dashboard';
 import { DashboardTable } from './dashboard_table';
 import { TopGroupsPage } from './top_groups_page';
@@ -49,20 +46,19 @@ export function DashboardContent(props: DashboardProps) {
     filters,
     setStartTime,
     setEndTime,
-    setQuery,
     setFilters,
     mode,
     dataPrepperIndicesExist,
     jaegerIndicesExist,
     toasts,
+    tenant,
   } = props;
   const [tableItems, setTableItems] = useState([]);
   const [jaegerTableItems, setJaegerTableItems] = useState([]);
   const [jaegerErrorTableItems, setJaegerErrorTableItems] = useState([]);
   const [throughputPltItems, setThroughputPltItems] = useState({ items: [], fixedInterval: '1h' });
   const [errorRatePltItems, setErrorRatePltItems] = useState({ items: [], fixedInterval: '1h' });
   const [percentileMap, setPercentileMap] = useState<{ [traceGroup: string]: number[] }>({});
-  const [filteredService, setFilteredService] = useState('');
   const [redirect, setRedirect] = useState(true);
   const [loading, setLoading] = useState(false);
   const [showTimeoutToast, setShowTimeoutToast] = useState(false);
@@ -92,27 +88,12 @@ export function DashboardContent(props: DashboardProps) {
   }, []);
 
   useEffect(() => {
-    let newFilteredService = '';
-    for (const filter of filters) {
-      if (mode === 'data_prepper') {
-        if (filter.field === 'serviceName') {
-          newFilteredService = filter.value;
-          break;
-        }
-      } else if (mode === 'jaeger') {
-        if (filter.field === 'process.serviceName') {
-          newFilteredService = filter.value;
-          break;
-        }
-      }
-    }
-    setFilteredService(newFilteredService);
     if (
       !redirect &&
       ((mode === 'data_prepper' && dataPrepperIndicesExist) ||
         (mode === 'jaeger' && jaegerIndicesExist))
     )
-      refresh(newFilteredService);
+      refresh();
   }, [
     filters,
     startTime,
@@ -124,7 +105,7 @@ export function DashboardContent(props: DashboardProps) {
     jaegerIndicesExist,
   ]);
 
-  const refresh = async (currService?: string) => {
+  const refresh = async () => {
     setLoading(true);
     const DSL = filtersToDsl(
       mode,
@@ -201,7 +182,8 @@ export function DashboardContent(props: DashboardProps) {
         setTableItems,
         mode,
         () => setShowTimeoutToast(true),
-        setPercentileMap
+        setPercentileMap,
+        tenant
       ).then(() => setLoading(false));
       // service map should not be filtered by service name (https://github.com/opensearch-project/observability/issues/442)
       const serviceMapDSL = _.cloneDeep(DSL);
@@ -216,7 +198,8 @@ export function DashboardContent(props: DashboardProps) {
       fixedInterval,
       throughputPltItems,
       setThroughputPltItems,
-      mode
+      mode,
+      tenant
     );
 
     handleDashboardErrorRatePltRequest(
@@ -225,7 +208,8 @@ export function DashboardContent(props: DashboardProps) {
       fixedInterval,
       errorRatePltItems,
       setErrorRatePltItems,
-      mode
+      mode,
+      tenant
     );
   };
 
@@ -344,7 +328,7 @@ export function DashboardContent(props: DashboardProps) {
           )}
         </div>
       ) : (
-        <MissingConfigurationMessage mode={mode} />
+        <MissingConfigurationMessage mode={mode} tenant={tenant} />
       )}
     </>
   );