[SIEM] fix circular dependency (#57729) (#57897)

* fix Timeline url dependency * fix circular dependency * rename ColumnHeader to ColumnHeaderOptions
elastic · Feb 18, 2020 · 3986275 · 3986275
1 parent 4ed506f
commit 3986275
Show file tree

Hide file tree

Showing 80 changed files with 455 additions and 390 deletions.
diff --git a/x-pack/legacy/plugins/siem/dev_tools/circular_deps/run_check_circular_deps_cli.js b/x-pack/legacy/plugins/siem/dev_tools/circular_deps/run_check_circular_deps_cli.js
@@ -21,8 +21,7 @@ run(
     );
 
     const circularFound = result.circular();
-    // We can only care about SIEM code, we should not be penalyze for others
-    if (circularFound.filter(cf => cf.includes('siem')).length !== 0) {
+    if (circularFound.length !== 0) {
       throw createFailError(
         `SIEM circular dependencies of imports has been found:\n - ${circularFound.join('\n - ')}`
       );

diff --git a/x-pack/legacy/plugins/siem/public/components/alerts_viewer/default_headers.ts b/x-pack/legacy/plugins/siem/public/components/alerts_viewer/default_headers.ts
@@ -4,12 +4,15 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
 import { defaultColumnHeaderType } from '../timeline/body/column_headers/default_headers';
-import { DEFAULT_COLUMN_MIN_WIDTH, DEFAULT_DATE_COLUMN_MIN_WIDTH } from '../timeline/body/helpers';
-import { timelineDefaults, SubsetTimelineModel } from '../../store/timeline/model';
+import {
+  DEFAULT_COLUMN_MIN_WIDTH,
+  DEFAULT_DATE_COLUMN_MIN_WIDTH,
+} from '../timeline/body/constants';
+import { ColumnHeaderOptions, SubsetTimelineModel } from '../../store/timeline/model';
+import { timelineDefaults } from '../../store/timeline/defaults';
 
-export const alertsHeaders: ColumnHeader[] = [
+export const alertsHeaders: ColumnHeaderOptions[] = [
   {
     columnHeaderType: defaultColumnHeaderType,
     id: '@timestamp',

diff --git a/x-pack/legacy/plugins/siem/public/components/drag_and_drop/helpers.ts b/x-pack/legacy/plugins/siem/public/components/drag_and_drop/helpers.ts
@@ -11,8 +11,8 @@ import { ActionCreator } from 'typescript-fsa';
 
 import { BrowserFields, getAllFieldsByName } from '../../containers/source';
 import { IdToDataProvider } from '../../store/drag_and_drop/model';
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
-import { DEFAULT_COLUMN_MIN_WIDTH } from '../timeline/body/helpers';
+import { ColumnHeaderOptions } from '../../store/timeline/model';
+import { DEFAULT_COLUMN_MIN_WIDTH } from '../timeline/body/constants';
 
 import { DataProvider } from '../timeline/data_providers/data_provider';
 import { dragAndDropActions, timelineActions } from '../../store/actions';
@@ -124,7 +124,7 @@ interface AddProviderToTimelineParams {
 
 interface AddFieldToTimelineColumnsParams {
   upsertColumn?: ActionCreator<{
-    column: ColumnHeader;
+    column: ColumnHeaderOptions;
     id: string;
     index: number;
   }>;

diff --git a/x-pack/legacy/plugins/siem/public/components/event_details/columns.tsx b/x-pack/legacy/plugins/siem/public/components/event_details/columns.tsx
@@ -22,16 +22,16 @@ import styled from 'styled-components';
 import { BrowserFields } from '../../containers/source';
 import { ToStringArray } from '../../graphql/types';
 import { WithCopyToClipboard } from '../../lib/clipboard/with_copy_to_clipboard';
+import { ColumnHeaderOptions } from '../../store/timeline/model';
 import { DragEffects } from '../drag_and_drop/draggable_wrapper';
 import { DroppableWrapper } from '../drag_and_drop/droppable_wrapper';
 import { getDroppableId, getDraggableFieldId, DRAG_TYPE_FIELD } from '../drag_and_drop/helpers';
 import { DraggableFieldBadge } from '../draggables/field_badge';
 import { FieldName } from '../fields_browser/field_name';
 import { SelectableText } from '../selectable_text';
 import { OverflowField } from '../tables/helpers';
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
 import { defaultColumnHeaderType } from '../timeline/body/column_headers/default_headers';
-import { DEFAULT_COLUMN_MIN_WIDTH } from '../timeline/body/helpers';
+import { DEFAULT_COLUMN_MIN_WIDTH } from '../timeline/body/constants';
 import { MESSAGE_FIELD_NAME } from '../timeline/body/renderers/constants';
 import { FormattedFieldValue } from '../timeline/body/renderers/formatted_field';
 import { OnUpdateColumns } from '../timeline/events';
@@ -63,11 +63,11 @@ export const getColumns = ({
   toggleColumn,
 }: {
   browserFields: BrowserFields;
-  columnHeaders: ColumnHeader[];
+  columnHeaders: ColumnHeaderOptions[];
   eventId: string;
   onUpdateColumns: OnUpdateColumns;
   contextId: string;
-  toggleColumn: (column: ColumnHeader) => void;
+  toggleColumn: (column: ColumnHeaderOptions) => void;
 }) => [
   {
     field: 'field',

diff --git a/x-pack/legacy/plugins/siem/public/components/event_details/event_details.tsx b/x-pack/legacy/plugins/siem/public/components/event_details/event_details.tsx
@@ -10,7 +10,7 @@ import styled from 'styled-components';
 
 import { BrowserFields } from '../../containers/source';
 import { DetailItem } from '../../graphql/types';
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
+import { ColumnHeaderOptions } from '../../store/timeline/model';
 import { OnUpdateColumns } from '../timeline/events';
 import { EventFieldsBrowser } from './event_fields_browser';
 import { JsonView } from './json_view';
@@ -20,14 +20,14 @@ export type View = 'table-view' | 'json-view';
 
 interface Props {
   browserFields: BrowserFields;
-  columnHeaders: ColumnHeader[];
+  columnHeaders: ColumnHeaderOptions[];
   data: DetailItem[];
   id: string;
   view: View;
   onUpdateColumns: OnUpdateColumns;
   onViewSelected: (selected: View) => void;
   timelineId: string;
-  toggleColumn: (column: ColumnHeader) => void;
+  toggleColumn: (column: ColumnHeaderOptions) => void;
 }
 
 const Details = styled.div`

diff --git a/x-pack/legacy/plugins/siem/public/components/event_details/event_fields_browser.tsx b/x-pack/legacy/plugins/siem/public/components/event_details/event_fields_browser.tsx
@@ -8,7 +8,7 @@ import { sortBy } from 'lodash';
 import { EuiInMemoryTable } from '@elastic/eui';
 import React, { useMemo } from 'react';
 
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
+import { ColumnHeaderOptions } from '../../store/timeline/model';
 import { BrowserFields, getAllFieldsByName } from '../../containers/source';
 import { DetailItem } from '../../graphql/types';
 import { OnUpdateColumns } from '../timeline/events';
@@ -18,12 +18,12 @@ import { search } from './helpers';
 
 interface Props {
   browserFields: BrowserFields;
-  columnHeaders: ColumnHeader[];
+  columnHeaders: ColumnHeaderOptions[];
   data: DetailItem[];
   eventId: string;
   onUpdateColumns: OnUpdateColumns;
   timelineId: string;
-  toggleColumn: (column: ColumnHeader) => void;
+  toggleColumn: (column: ColumnHeaderOptions) => void;
 }
 
 /** Renders a table view or JSON view of the `ECS` `data` */

diff --git a/x-pack/legacy/plugins/siem/public/components/event_details/helpers.tsx b/x-pack/legacy/plugins/siem/public/components/event_details/helpers.tsx
@@ -7,8 +7,11 @@
 import { get, getOr, isEmpty, uniqBy } from 'lodash/fp';
 
 import { BrowserField, BrowserFields } from '../../containers/source';
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
-import { DEFAULT_DATE_COLUMN_MIN_WIDTH, DEFAULT_COLUMN_MIN_WIDTH } from '../timeline/body/helpers';
+import { ColumnHeaderOptions } from '../../store/timeline/model';
+import {
+  DEFAULT_DATE_COLUMN_MIN_WIDTH,
+  DEFAULT_COLUMN_MIN_WIDTH,
+} from '../timeline/body/constants';
 import { ToStringArray } from '../../graphql/types';
 
 import * as i18n from './translations';
@@ -46,7 +49,7 @@ export const getColumnHeaderFromBrowserField = ({
 }: {
   browserField: Partial<BrowserField>;
   width?: number;
-}): ColumnHeader => ({
+}): ColumnHeaderOptions => ({
   category: browserField.category,
   columnHeaderType: 'not-filtered',
   description: browserField.description != null ? browserField.description : undefined,
@@ -68,7 +71,7 @@ export const getColumnsWithTimestamp = ({
 }: {
   browserFields: BrowserFields;
   category: string;
-}): ColumnHeader[] => {
+}): ColumnHeaderOptions[] => {
   const emptyFields: Record<string, Partial<BrowserField>> = {};
   const timestamp = get('base.fields.@timestamp', browserFields);
   const categoryFields: Array<Partial<BrowserField>> = [

diff --git a/x-pack/legacy/plugins/siem/public/components/event_details/stateful_event_details.tsx b/x-pack/legacy/plugins/siem/public/components/event_details/stateful_event_details.tsx
@@ -7,20 +7,20 @@
 import React, { useCallback, useState } from 'react';
 
 import { BrowserFields } from '../../containers/source';
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
 import { DetailItem } from '../../graphql/types';
+import { ColumnHeaderOptions } from '../../store/timeline/model';
 import { OnUpdateColumns } from '../timeline/events';
 
 import { EventDetails, View } from './event_details';
 
 interface Props {
   browserFields: BrowserFields;
-  columnHeaders: ColumnHeader[];
+  columnHeaders: ColumnHeaderOptions[];
   data: DetailItem[];
   id: string;
   onUpdateColumns: OnUpdateColumns;
   timelineId: string;
-  toggleColumn: (column: ColumnHeader) => void;
+  toggleColumn: (column: ColumnHeaderOptions) => void;
 }
 
 export const StatefulEventDetails = React.memo<Props>(

diff --git a/x-pack/legacy/plugins/siem/public/components/events_viewer/default_headers.tsx b/x-pack/legacy/plugins/siem/public/components/events_viewer/default_headers.tsx
@@ -4,11 +4,14 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
+import { ColumnHeaderOptions } from '../../store/timeline/model';
 import { defaultColumnHeaderType } from '../timeline/body/column_headers/default_headers';
-import { DEFAULT_COLUMN_MIN_WIDTH, DEFAULT_DATE_COLUMN_MIN_WIDTH } from '../timeline/body/helpers';
+import {
+  DEFAULT_COLUMN_MIN_WIDTH,
+  DEFAULT_DATE_COLUMN_MIN_WIDTH,
+} from '../timeline/body/constants';
 
-export const defaultHeaders: ColumnHeader[] = [
+export const defaultHeaders: ColumnHeaderOptions[] = [
   {
     columnHeaderType: defaultColumnHeaderType,
     id: '@timestamp',

diff --git a/x-pack/legacy/plugins/siem/public/components/events_viewer/default_model.tsx b/x-pack/legacy/plugins/siem/public/components/events_viewer/default_model.tsx
@@ -5,7 +5,8 @@
  */
 
 import { defaultHeaders } from './default_headers';
-import { SubsetTimelineModel, timelineDefaults } from '../../store/timeline/model';
+import { SubsetTimelineModel } from '../../store/timeline/model';
+import { timelineDefaults } from '../../store/timeline/defaults';
 
 export const eventsDefaultModel: SubsetTimelineModel = {
   ...timelineDefaults,

diff --git a/x-pack/legacy/plugins/siem/public/components/events_viewer/events_viewer.tsx b/x-pack/legacy/plugins/siem/public/components/events_viewer/events_viewer.tsx
@@ -15,9 +15,8 @@ import { BrowserFields } from '../../containers/source';
 import { TimelineQuery } from '../../containers/timeline';
 import { Direction } from '../../graphql/types';
 import { useKibana } from '../../lib/kibana';
-import { KqlMode } from '../../store/timeline/model';
+import { ColumnHeaderOptions, KqlMode } from '../../store/timeline/model';
 import { HeaderSection } from '../header_section';
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
 import { defaultHeaders } from '../timeline/body/column_headers/default_headers';
 import { Sort } from '../timeline/body/sort';
 import { StatefulBody } from '../timeline/body/stateful_body';
@@ -50,7 +49,7 @@ const StyledEuiPanel = styled(EuiPanel)`
 
 interface Props {
   browserFields: BrowserFields;
-  columns: ColumnHeader[];
+  columns: ColumnHeaderOptions[];
   dataProviders: DataProvider[];
   deletedEventIds: Readonly<string[]>;
   end: number;
@@ -68,7 +67,7 @@ interface Props {
   start: number;
   sort: Sort;
   timelineTypeContext: TimelineTypeContextProps;
-  toggleColumn: (column: ColumnHeader) => void;
+  toggleColumn: (column: ColumnHeaderOptions) => void;
   utilityBar?: (refetch: inputsModel.Refetch, totalCount: number) => React.ReactNode;
 }
 

diff --git a/x-pack/legacy/plugins/siem/public/components/events_viewer/index.tsx b/x-pack/legacy/plugins/siem/public/components/events_viewer/index.tsx
@@ -7,10 +7,14 @@
 import { isEqual } from 'lodash/fp';
 import React, { useCallback, useMemo, useEffect } from 'react';
 import { connect, ConnectedProps } from 'react-redux';
+
 import { inputsModel, inputsSelectors, State, timelineSelectors } from '../../store';
 import { inputsActions, timelineActions } from '../../store/actions';
-import { SubsetTimelineModel, TimelineModel } from '../../store/timeline/model';
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
+import {
+  ColumnHeaderOptions,
+  SubsetTimelineModel,
+  TimelineModel,
+} from '../../store/timeline/model';
 import { OnChangeItemsPerPage } from '../timeline/events';
 import { Filter } from '../../../../../../../src/plugins/data/public';
 
@@ -86,7 +90,7 @@ const StatefulEventsViewerComponent: React.FC<Props> = ({
   );
 
   const toggleColumn = useCallback(
-    (column: ColumnHeader) => {
+    (column: ColumnHeaderOptions) => {
       const exists = columns.findIndex(c => c.id === column.id) !== -1;
 
       if (!exists && upsertColumn != null) {

diff --git a/x-pack/legacy/plugins/siem/public/components/fields_browser/field_browser.tsx b/x-pack/legacy/plugins/siem/public/components/fields_browser/field_browser.tsx
@@ -10,7 +10,7 @@ import { noop } from 'lodash/fp';
 import styled from 'styled-components';
 
 import { BrowserFields } from '../../containers/source';
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
+import { ColumnHeaderOptions } from '../../store/timeline/model';
 import { CategoriesPane } from './categories_pane';
 import { FieldsPane } from './fields_pane';
 import { Header } from './header';
@@ -57,7 +57,7 @@ type Props = Pick<
   /**
    * The current timeline column headers
    */
-  columnHeaders: ColumnHeader[];
+  columnHeaders: ColumnHeaderOptions[];
   /**
    * A map of categoryId -> metadata about the fields in that category,
    * filtered such that the name of every field in the category includes
@@ -95,7 +95,7 @@ type Props = Pick<
   /**
    * Invoked to add or remove a column from the timeline
    */
-  toggleColumn: (column: ColumnHeader) => void;
+  toggleColumn: (column: ColumnHeaderOptions) => void;
 };
 
 /**

diff --git a/x-pack/legacy/plugins/siem/public/components/fields_browser/field_items.test.tsx b/x-pack/legacy/plugins/siem/public/components/fields_browser/field_items.test.tsx
@@ -9,9 +9,9 @@ import React from 'react';
 
 import { mockBrowserFields } from '../../containers/source/mock';
 import { TestProviders } from '../../mock';
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
+import { ColumnHeaderOptions } from '../../store/timeline/model';
 import { defaultColumnHeaderType } from '../timeline/body/column_headers/default_headers';
-import { DEFAULT_DATE_COLUMN_MIN_WIDTH } from '../timeline/body/helpers';
+import { DEFAULT_DATE_COLUMN_MIN_WIDTH } from '../timeline/body/constants';
 
 import { Category } from './category';
 import { getFieldColumns, getFieldItems } from './field_items';
@@ -21,7 +21,7 @@ import { useMountAppended } from '../../utils/use_mount_appended';
 const selectedCategoryId = 'base';
 const selectedCategoryFields = mockBrowserFields[selectedCategoryId].fields;
 const timestampFieldId = '@timestamp';
-const columnHeaders: ColumnHeader[] = [
+const columnHeaders: ColumnHeaderOptions[] = [
   {
     category: 'base',
     columnHeaderType: defaultColumnHeaderType,

diff --git a/x-pack/legacy/plugins/siem/public/components/fields_browser/field_items.tsx b/x-pack/legacy/plugins/siem/public/components/fields_browser/field_items.tsx
@@ -13,16 +13,16 @@ import { Draggable } from 'react-beautiful-dnd';
 import styled from 'styled-components';
 
 import { BrowserField, BrowserFields } from '../../containers/source';
+import { ColumnHeaderOptions } from '../../store/timeline/model';
 import { DragEffects } from '../drag_and_drop/draggable_wrapper';
 import { DroppableWrapper } from '../drag_and_drop/droppable_wrapper';
 import { getDraggableFieldId, getDroppableId, DRAG_TYPE_FIELD } from '../drag_and_drop/helpers';
 import { DraggableFieldBadge } from '../draggables/field_badge';
 import { getEmptyValue } from '../empty_value';
 import { getColumnsWithTimestamp, getExampleText, getIconFromType } from '../event_details/helpers';
 import { SelectableText } from '../selectable_text';
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
 import { defaultColumnHeaderType } from '../timeline/body/column_headers/default_headers';
-import { DEFAULT_COLUMN_MIN_WIDTH } from '../timeline/body/helpers';
+import { DEFAULT_COLUMN_MIN_WIDTH } from '../timeline/body/constants';
 import { OnUpdateColumns } from '../timeline/events';
 import { TruncatableText } from '../truncatable_text';
 import { FieldName } from './field_name';
@@ -68,10 +68,10 @@ export const getFieldItems = ({
   browserFields: BrowserFields;
   category: Partial<BrowserField>;
   categoryId: string;
-  columnHeaders: ColumnHeader[];
+  columnHeaders: ColumnHeaderOptions[];
   highlight?: string;
   timelineId: string;
-  toggleColumn: (column: ColumnHeader) => void;
+  toggleColumn: (column: ColumnHeaderOptions) => void;
   onUpdateColumns: OnUpdateColumns;
 }): FieldItem[] =>
   uniqBy('name', [

diff --git a/x-pack/legacy/plugins/siem/public/components/fields_browser/field_name.tsx b/x-pack/legacy/plugins/siem/public/components/fields_browser/field_name.tsx
@@ -18,7 +18,7 @@ import React, { useContext } from 'react';
 import styled from 'styled-components';
 
 import { WithCopyToClipboard } from '../../lib/clipboard/with_copy_to_clipboard';
-import { ColumnHeader } from '../timeline/body/column_headers/column_header';
+import { ColumnHeaderOptions } from '../../store/timeline/model';
 import { OnUpdateColumns } from '../timeline/events';
 import { TimelineContext } from '../timeline/timeline_context';
 import { WithHoverActions } from '../with_hover_actions';
@@ -107,7 +107,7 @@ ViewCategoryIcon.displayName = 'ViewCategoryIcon';
 interface ToolTipProps {
   categoryId: string;
   onUpdateColumns: OnUpdateColumns;
-  categoryColumns: ColumnHeader[];
+  categoryColumns: ColumnHeaderOptions[];
 }
 
 const ViewCategory = React.memo<ToolTipProps>(
@@ -138,7 +138,7 @@ ViewCategory.displayName = 'ViewCategory';
 /** Renders a field name in it's non-dragging state */
 export const FieldName = React.memo<{
   categoryId: string;
-  categoryColumns: ColumnHeader[];
+  categoryColumns: ColumnHeaderOptions[];
   fieldId: string;
   highlight?: string;
   onUpdateColumns: OnUpdateColumns;