Modularize service and clean up (#595)

Signed-off-by: Eugene Lee <[email protected]>
opensearch-project · Mar 18, 2022 · af54d6a · af54d6a
1 parent 7958e72
commit af54d6a
Show file tree

Hide file tree

Showing 17 changed files with 3,008 additions and 2,787 deletions.
diff --git a/dashboards-observability/public/components/application_analytics/components/application.tsx b/dashboards-observability/public/components/application_analytics/components/application.tsx
@@ -7,6 +7,7 @@
 
 import {
   EuiHorizontalRule,
+  EuiLink,
   EuiPage,
   EuiPageBody,
   EuiPageHeader,
@@ -24,7 +25,7 @@ import PPLService from 'public/services/requests/ppl';
 import SavedObjects from 'public/services/saved_objects/event_analytics/saved_objects';
 import TimestampUtils from 'public/services/timestamp/timestamp';
 import React, { ReactChild, useEffect, useState } from 'react';
-import { uniqueId } from 'lodash';
+import { truncate, uniqueId } from 'lodash';
 import { useHistory } from 'react-router-dom';
 import { useDispatch } from 'react-redux';
 import { last } from 'lodash';
@@ -35,7 +36,6 @@ import {
 } from '../../../../public/components/trace_analytics/components/common/helper_functions';
 import { SpanDetailTable } from '../../../../public/components/trace_analytics/components/traces/span_detail_table';
 import { Explorer } from '../../explorer/explorer';
-import { Services } from '../../trace_analytics/components/services';
 import { Traces } from '../../trace_analytics/components/traces';
 import { Configuration } from './configuration';
 import {
@@ -63,6 +63,7 @@ import { ServiceDetailFlyout } from './flyout_components/service_detail_flyout';
 import { SpanDetailFlyout } from '../../../../public/components/trace_analytics/components/traces/span_detail_flyout';
 import { TraceDetailFlyout } from './flyout_components/trace_detail_flyout';
 import { fetchAppById, initializeTabData } from '../helpers/utils';
+import { ServicesContent } from '../../trace_analytics/components/services/services_content';
 
 const TAB_OVERVIEW_ID = uniqueId(TAB_OVERVIEW_ID_TXT_PFX);
 const TAB_SERVICE_ID = uniqueId(TAB_SERVICE_ID_TXT_PFX);
@@ -293,19 +294,23 @@ export function Application(props: AppDetailProps) {
     );
   };
 
+  const nameColumnAction = (item: any) => openServiceFlyout(item);
+  const traceColumnAction = () => switchToTrace();
+
   const getService = () => {
     return (
-      <Services
-        {...props}
-        page="app"
-        appId={appId}
-        appName={application.name}
-        openServiceFlyout={openServiceFlyout}
-        setStartTime={setStartTimeForApp}
-        setEndTime={setEndTimeForApp}
-        switchToTrace={switchToTrace}
-        switchToEditViz={switchToEditViz}
-      />
+      <>
+        <EuiSpacer size="m" />
+        <ServicesContent
+          {...props}
+          page="app"
+          nameColumnAction={nameColumnAction}
+          traceColumnAction={traceColumnAction}
+          childBreadcrumbs={childBreadcrumbs}
+          setStartTime={setStartTimeForApp}
+          setEndTime={setEndTimeForApp}
+        />
+      </>
     );
   };
 

diff --git a/...y/public/components/application_analytics/components/config_components/service_config.tsx b/...y/public/components/application_analytics/components/config_components/service_config.tsx
@@ -49,7 +49,7 @@ export const ServiceConfig = (props: ServiceConfigProps) => {
   const [modalLayout, setModalLayout] = useState(<EuiOverlayMask />);
 
   useEffect(() => {
-    handleServiceMapRequest(http, dslService, serviceMap, setServiceMap);
+    handleServiceMapRequest(http, dslService, setServiceMap);
   }, []);
 
   useEffect(() => {

diff --git a/...c/components/application_analytics/components/flyout_components/service_detail_flyout.tsx b/...c/components/application_analytics/components/flyout_components/service_detail_flyout.tsx
@@ -117,8 +117,8 @@ export function ServiceDetailFlyout(props: ServiceFlyoutProps) {
 
   useEffect(() => {
     const serviceDSL = filtersToDsl(filters, query, startTime, endTime, 'app', appConfigs);
-    handleServiceViewRequest(serviceName, http, serviceDSL, fields, setFields);
-    handleServiceMapRequest(http, serviceDSL, serviceMap, setServiceMap, serviceName);
+    handleServiceViewRequest(serviceName, http, serviceDSL, setFields);
+    handleServiceMapRequest(http, serviceDSL, setServiceMap, serviceName);
     const spanDSL = filtersToDsl(filters, query, startTime, endTime, 'app', appConfigs);
     spanDSL.query.bool.must.push({
       term: {

diff --git a/...rds-observability/public/components/trace_analytics/components/common/filters/filters.tsx b/...rds-observability/public/components/trace_analytics/components/common/filters/filters.tsx
@@ -32,7 +32,7 @@ export interface FilterType {
 
 export interface FiltersProps {
   filters: FilterType[];
-  appConfigs: FilterType[];
+  appConfigs?: FilterType[];
   setFilters: (filters: FilterType[]) => void;
 }
 

diff --git a/...bservability/public/components/trace_analytics/components/dashboard/dashboard_content.tsx b/...bservability/public/components/trace_analytics/components/dashboard/dashboard_content.tsx
@@ -127,13 +127,7 @@ export function DashboardContent(props: DashboardProps) {
     serviceMapDSL.query.bool.must = serviceMapDSL.query.bool.must.filter(
       (must: any) => must?.term?.serviceName == null
     );
-    handleServiceMapRequest(
-      http,
-      serviceMapDSL,
-      serviceMap,
-      setServiceMap,
-      currService || filteredService
-    );
+    handleServiceMapRequest(http, serviceMapDSL, setServiceMap, currService || filteredService);
   };
 
   const addFilter = (filter: FilterType) => {