Merge branch 'master' of github.com:elastic/kibana into rac-summary-view

elastic · Aug 16, 2021 · 8bee34f · 8bee34f
2 parents e29d182 + 0eea6f7
commit 8bee34f
Show file tree

Hide file tree

Showing 21 changed files with 45 additions and 92 deletions.
diff --git a/packages/kbn-docs-utils/.babelrc b/packages/kbn-docs-utils/.babelrc
@@ -0,0 +1,3 @@
+{
+  "presets": ["@kbn/babel-preset/node_preset"]
+}
diff --git a/packages/kbn-docs-utils/BUILD.bazel b/packages/kbn-docs-utils/BUILD.bazel
@@ -1,5 +1,6 @@
 load("@npm//@bazel/typescript:index.bzl", "ts_config", "ts_project")
 load("@build_bazel_rules_nodejs//:index.bzl", "js_library", "pkg_npm")
+load("//src/dev/bazel:index.bzl", "jsts_transpiler")
 
 PKG_BASE_NAME = "kbn-docs-utils"
 PKG_REQUIRE_NAME = "@kbn/docs-utils"
@@ -26,7 +27,7 @@ NPM_MODULE_EXTRA_FILES = [
   "package.json",
 ]
 
-SRC_DEPS = [
+RUNTIME_DEPS = [
   "//packages/kbn-config",
   "//packages/kbn-dev-utils",
   "//packages/kbn-utils",
@@ -35,12 +36,20 @@ SRC_DEPS = [
 ]
 
 TYPES_DEPS = [
+  "//packages/kbn-config",
+  "//packages/kbn-dev-utils",
+  "//packages/kbn-utils",
+  "@npm//ts-morph",
   "@npm//@types/dedent",
   "@npm//@types/jest",
   "@npm//@types/node",
 ]
 
-DEPS = SRC_DEPS + TYPES_DEPS
+jsts_transpiler(
+  name = "target_node",
+  srcs = SRCS,
+  build_pkg_name = package_name(),
+)
 
 ts_config(
   name = "tsconfig",
@@ -52,13 +61,14 @@ ts_config(
 )
 
 ts_project(
-  name = "tsc",
+  name = "tsc_types",
   args = ['--pretty'],
   srcs = SRCS,
-  deps = DEPS,
+  deps = TYPES_DEPS,
   declaration = True,
   declaration_map = True,
-  out_dir = "target",
+  emit_declaration_only = True,
+  out_dir = "target_types",
   source_map = True,
   root_dir = "src",
   tsconfig = ":tsconfig",
@@ -67,7 +77,7 @@ ts_project(
 js_library(
   name = PKG_BASE_NAME,
   srcs = NPM_MODULE_EXTRA_FILES,
-  deps = DEPS + [":tsc"],
+  deps = RUNTIME_DEPS + [":target_node", ":tsc_types"],
   package_name = PKG_REQUIRE_NAME,
   visibility = ["//visibility:public"],
 )

diff --git a/packages/kbn-docs-utils/package.json b/packages/kbn-docs-utils/package.json
@@ -3,8 +3,8 @@
   "version": "1.0.0",
   "license": "SSPL-1.0 OR Elastic License 2.0",
   "private": "true",
-  "main": "target/index.js",
-  "types": "target/index.d.ts",
+  "main": "target_node/index.js",
+  "types": "target_types/index.d.ts",
   "kibana": {
     "devOnly": true
   }

diff --git a/packages/kbn-docs-utils/tsconfig.json b/packages/kbn-docs-utils/tsconfig.json
@@ -1,9 +1,10 @@
 {
   "extends": "../../tsconfig.bazel.json",
   "compilerOptions": {
-    "outDir": "./target/types",
     "declaration": true,
     "declarationMap": true,
+    "emitDeclarationOnly": true,
+    "outDir": "target_types",
     "rootDir": "src",
     "sourceMap": true,
     "sourceRoot": "../../../../packages/kbn-docs-utils/src",

diff --git a/x-pack/plugins/apm/public/application/uxApp.tsx b/x-pack/plugins/apm/public/application/uxApp.tsx
@@ -50,10 +50,15 @@ function UxApp() {
   const basePath = core.http.basePath.get();
 
   useBreadcrumbs([
-    { text: UX_LABEL, href: basePath + '/app/ux' },
     {
-      text: i18n.translate('xpack.apm.ux.overview', {
-        defaultMessage: 'Overview',
+      text: i18n.translate('xpack.apm.ux.breadcrumbs.root', {
+        defaultMessage: 'User Experience',
+      }),
+      href: basePath + '/app/ux',
+    },
+    {
+      text: i18n.translate('xpack.apm.ux.breadcrumbs.dashboard', {
+        defaultMessage: 'Dashboard',
       }),
     },
   ]);

diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/RumHome.tsx b/x-pack/plugins/apm/public/components/app/RumDashboard/RumHome.tsx
@@ -18,7 +18,7 @@ import { UserPercentile } from './UserPercentile';
 import { useBreakPoints } from '../../../hooks/use_break_points';
 
 export const UX_LABEL = i18n.translate('xpack.apm.ux.title', {
-  defaultMessage: 'User Experience',
+  defaultMessage: 'Dashboard',
 });
 
 export function RumHome() {
@@ -36,7 +36,7 @@ export function RumHome() {
           isXXL
             ? {
                 pageTitle: i18n.translate('xpack.apm.ux.overview', {
-                  defaultMessage: 'Overview',
+                  defaultMessage: 'Dashboard',
                 }),
                 rightSideItems: [
                   <DatePicker />,

diff --git a/x-pack/plugins/apm/public/components/app/service_inventory/index.tsx b/x-pack/plugins/apm/public/components/app/service_inventory/index.tsx
@@ -149,7 +149,6 @@ function useServicesFetcher({
     mainStatisticsData,
     mainStatisticsStatus,
     comparisonData,
-    isLoading: mainStatisticsStatus === FETCH_STATUS.LOADING,
   };
 }
 
@@ -167,7 +166,6 @@ export function ServiceInventory() {
     mainStatisticsData,
     mainStatisticsStatus,
     comparisonData,
-    isLoading,
   } = useServicesFetcher({ environment, kuery });
 
   const {
@@ -188,6 +186,8 @@ export function ServiceInventory() {
     canCreateJob &&
     !userHasDismissedCallout;
 
+  const isLoading = mainStatisticsStatus === FETCH_STATUS.LOADING;
+
   return (
     <>
       <SearchBar showTimeComparison />

diff --git a/x-pack/plugins/cases/public/components/case_view/index.tsx b/x-pack/plugins/cases/public/components/case_view/index.tsx
@@ -105,7 +105,6 @@ export const CaseComponent = React.memo<CaseComponentProps>(
     const [initLoadingData, setInitLoadingData] = useState(true);
     const init = useRef(true);
     const timelineUi = useTimelineContext()?.ui;
-    const alertConsumers = useTimelineContext()?.alertConsumers;
 
     const {
       caseUserActions,
@@ -487,9 +486,7 @@ export const CaseComponent = React.memo<CaseComponentProps>(
             </EuiFlexGroup>
           </ContentWrapper>
         </WhitePageWrapper>
-        {timelineUi?.renderTimelineDetailsPanel
-          ? timelineUi.renderTimelineDetailsPanel({ alertConsumers })
-          : null}
+        {timelineUi?.renderTimelineDetailsPanel ? timelineUi.renderTimelineDetailsPanel() : null}
       </>
     );
   }

diff --git a/x-pack/plugins/cases/public/components/timeline_context/index.tsx b/x-pack/plugins/cases/public/components/timeline_context/index.tsx
@@ -7,7 +7,6 @@
 
 import React, { useState } from 'react';
 import { EuiMarkdownEditorUiPlugin, EuiMarkdownAstNodePosition } from '@elastic/eui';
-import { AlertConsumers } from '@kbn/rule-data-utils';
 import { Plugin } from 'unified';
 /**
  * @description - manage the plugins, hooks, and ui components needed to enable timeline functionality within the cases plugin
@@ -29,7 +28,6 @@ interface TimelineProcessingPluginRendererProps {
 }
 
 export interface CasesTimelineIntegration {
-  alertConsumers?: AlertConsumers[];
   editor_plugins: {
     parsingPlugin: Plugin;
     processingPluginRenderer: React.FC<
@@ -45,11 +43,7 @@ export interface CasesTimelineIntegration {
   };
   ui?: {
     renderInvestigateInTimelineActionComponent?: (alertIds: string[]) => JSX.Element;
-    renderTimelineDetailsPanel?: ({
-      alertConsumers,
-    }: {
-      alertConsumers?: AlertConsumers[];
-    }) => JSX.Element;
+    renderTimelineDetailsPanel?: () => JSX.Element;
   };
 }
 

diff --git a/x-pack/plugins/security_solution/public/cases/components/case_view/index.tsx b/x-pack/plugins/security_solution/public/cases/components/case_view/index.tsx
@@ -7,7 +7,6 @@
 
 import React, { useCallback, useRef, useState } from 'react';
 import { useDispatch } from 'react-redux';
-import { AlertConsumers } from '@kbn/rule-data-utils';
 
 import {
   getCaseDetailsUrl,
@@ -34,7 +33,6 @@ import { SpyRoute } from '../../../common/utils/route/spy_routes';
 import * as timelineMarkdownPlugin from '../../../common/components/markdown_editor/plugins/timeline';
 import { CaseDetailsRefreshContext } from '../../../common/components/endpoint/host_isolation/endpoint_host_isolation_cases_context';
 import { getEndpointDetailsPath } from '../../../management/common/routing';
-import { EntityType } from '../../../timelines/containers/details';
 
 interface Props {
   caseId: string;
@@ -55,17 +53,13 @@ export interface CaseProps extends Props {
   updateCase: (newCase: Case) => void;
 }
 
-const ALERT_CONSUMER: AlertConsumers[] = [AlertConsumers.SIEM];
-
-const TimelineDetailsPanel = ({ alertConsumers }: { alertConsumers?: AlertConsumers[] }) => {
+const TimelineDetailsPanel = () => {
   const { browserFields, docValueFields } = useSourcererScope(SourcererScopeName.detections);
 
   return (
     <DetailsPanel
-      alertConsumers={alertConsumers}
       browserFields={browserFields}
       docValueFields={docValueFields}
-      entityType={EntityType.ALERTS}
       isFlyoutView
       timelineId={TimelineId.casePage}
     />
@@ -234,7 +228,6 @@ export const CaseView = React.memo(({ caseId, subCaseId, userCanCrud }: Props) =
         showAlertDetails,
         subCaseId,
         timelineIntegration: {
-          alertConsumers: ALERT_CONSUMER,
           editor_plugins: {
             parsingPlugin: timelineMarkdownPlugin.parser,
             processingPluginRenderer: timelineMarkdownPlugin.renderer,

diff --git a/x-pack/plugins/security_solution/public/common/components/events_viewer/index.tsx b/x-pack/plugins/security_solution/public/common/components/events_viewer/index.tsx
@@ -11,7 +11,6 @@ import deepEqual from 'fast-deep-equal';
 import styled from 'styled-components';
 
 import { isEmpty } from 'lodash/fp';
-import { AlertConsumers } from '@kbn/rule-data-utils';
 import { inputsModel, inputsSelectors, State } from '../../store';
 import { inputsActions } from '../../store/actions';
 import { ControlColumnProps, RowRenderer, TimelineId } from '../../../../common/types/timeline';
@@ -32,7 +31,6 @@ import { useKibana } from '../../lib/kibana';
 import { defaultControlColumn } from '../../../timelines/components/timeline/body/control_columns';
 import { EventsViewer } from './events_viewer';
 import * as i18n from './translations';
-import { EntityType } from '../../../timelines/containers/details';
 
 const EMPTY_CONTROL_COLUMNS: ControlColumnProps[] = [];
 const leadingControlColumns: ControlColumnProps[] = [
@@ -71,8 +69,6 @@ export interface OwnProps {
 
 type Props = OwnProps & PropsFromRedux;
 
-const alertConsumers: AlertConsumers[] = [AlertConsumers.SIEM];
-
 /**
  * The stateful events viewer component is the highest level component that is utilized across the security_solution pages layer where
  * timeline is used BESIDES the flyout. The flyout makes use of the `EventsViewer` component which is a subcomponent here
@@ -213,9 +209,7 @@ const StatefulEventsViewerComponent: React.FC<Props> = ({
         </InspectButtonContainer>
       </FullScreenContainer>
       <DetailsPanel
-        alertConsumers={alertConsumers}
         browserFields={browserFields}
-        entityType={EntityType.ALERTS}
         docValueFields={docValueFields}
         isFlyoutView
         timelineId={id}

diff --git a/...ent/pages/endpoint_hosts/view/details/components/activity_log_date_range_picker/index.tsx b/...ent/pages/endpoint_hosts/view/details/components/activity_log_date_range_picker/index.tsx
@@ -20,9 +20,11 @@ const DatePickerWrapper = styled.div`
   background: white;
 `;
 const StickyFlexItem = styled(EuiFlexItem)`
+  max-width: 350px;
   position: sticky;
   top: ${(props) => props.theme.eui.euiSizeM};
   z-index: 1;
+  padding: ${(props) => `0 ${props.theme.eui.paddingSizes.m}`};
 `;
 
 export const DateRangePicker = memo(() => {

diff --git a/.../plugins/security_solution/public/timelines/components/side_panel/event_details/index.tsx b/.../plugins/security_solution/public/timelines/components/side_panel/event_details/index.tsx
@@ -17,10 +17,9 @@ import {
 import React, { useState, useCallback, useMemo } from 'react';
 import styled from 'styled-components';
 import deepEqual from 'fast-deep-equal';
-import { AlertConsumers } from '@kbn/rule-data-utils';
 import { BrowserFields, DocValueFields } from '../../../../common/containers/source';
 import { ExpandableEvent, ExpandableEventTitle } from './expandable_event';
-import { EntityType, useTimelineEventsDetails } from '../../../containers/details';
+import { useTimelineEventsDetails } from '../../../containers/details';
 import { TimelineTabs } from '../../../../../common/types/timeline';
 import { HostIsolationPanel } from '../../../../detections/components/host_isolation';
 import { EndpointIsolateSuccess } from '../../../../common/components/endpoint/host_isolation';
@@ -50,10 +49,8 @@ const StyledEuiFlyoutBody = styled(EuiFlyoutBody)`
 `;
 
 interface EventDetailsPanelProps {
-  alertConsumers?: AlertConsumers[];
   browserFields: BrowserFields;
   docValueFields: DocValueFields[];
-  entityType?: EntityType;
   expandedEvent: {
     eventId: string;
     indexName: string;
@@ -68,20 +65,16 @@ interface EventDetailsPanelProps {
 }
 
 const EventDetailsPanelComponent: React.FC<EventDetailsPanelProps> = ({
-  alertConsumers,
   browserFields,
   docValueFields,
-  entityType,
   expandedEvent,
   handleOnEventClosed,
   isFlyoutView,
   tabType,
   timelineId,
 }) => {
   const [loading, detailsData] = useTimelineEventsDetails({
-    alertConsumers,
     docValueFields,
-    entityType,
     indexName: expandedEvent.indexName ?? '',
     eventId: expandedEvent.eventId ?? '',
     skip: !expandedEvent.eventId,

diff --git a/x-pack/plugins/security_solution/public/timelines/components/side_panel/index.tsx b/x-pack/plugins/security_solution/public/timelines/components/side_panel/index.tsx
@@ -8,8 +8,6 @@
 import React, { useCallback, useMemo } from 'react';
 import { useDispatch } from 'react-redux';
 import { EuiFlyout, EuiFlyoutProps } from '@elastic/eui';
-import { AlertConsumers } from '@kbn/rule-data-utils';
-
 import { timelineActions, timelineSelectors } from '../../store/timeline';
 import { timelineDefaults } from '../../store/timeline/defaults';
 import { BrowserFields, DocValueFields } from '../../../common/containers/source';
@@ -18,13 +16,10 @@ import { useDeepEqualSelector } from '../../../common/hooks/use_selector';
 import { EventDetailsPanel } from './event_details';
 import { HostDetailsPanel } from './host_details';
 import { NetworkDetailsPanel } from './network_details';
-import { EntityType } from '../../containers/details';
 
 interface DetailsPanelProps {
-  alertConsumers?: AlertConsumers[];
   browserFields: BrowserFields;
   docValueFields: DocValueFields[];
-  entityType?: EntityType;
   handleOnPanelClosed?: () => void;
   isFlyoutView?: boolean;
   tabType?: TimelineTabs;
@@ -38,10 +33,8 @@ interface DetailsPanelProps {
  */
 export const DetailsPanel = React.memo(
   ({
-    alertConsumers,
     browserFields,
     docValueFields,
-    entityType,
     handleOnPanelClosed,
     isFlyoutView,
     tabType,
@@ -77,10 +70,8 @@ export const DetailsPanel = React.memo(
       panelSize = 'm';
       visiblePanel = (
         <EventDetailsPanel
-          alertConsumers={alertConsumers}
           browserFields={browserFields}
           docValueFields={docValueFields}
-          entityType={entityType}
           expandedEvent={currentTabDetail?.params}
           handleOnEventClosed={closePanel}
           isFlyoutView={isFlyoutView}