[SIEM] Fix Timeline drag and drop behavior (#51558) (#51793)

2025-04-23 17:28:26 -04:00 · 2019-11-27 10:56:06 +01:00 · 2019-11-27 10:56:06 +01:00 · a44ccb7fab
commit a44ccb7fab
parent d7182cb4a1
28 changed files with 238 additions and 231 deletions
--- a/package.json
+++ b/package.json
@ -84,7 +84,10 @@
    "**/graphql-toolkit/lodash": "^4.17.13",
    "**/isomorphic-git/**/base64-js": "^1.2.1",
    "**/image-diff/gm/debug": "^2.6.9",
-    "**/deepmerge": "^4.2.2"
+    "**/deepmerge": "^4.2.2",
+    "**/react": "16.8.6",
+    "**/react-dom": "16.8.6",
+    "**/react-test-renderer": "16.8.6"
  },
  "workspaces": {
    "packages": [
@ -211,10 +214,10 @@
    "pug": "^2.0.3",
    "querystring-browser": "1.0.4",
    "raw-loader": "3.1.0",
-    "react": "^16.8.0",
+    "react": "^16.8.6",
    "react-addons-shallow-compare": "15.6.2",
    "react-color": "^2.13.8",
-    "react-dom": "^16.8.0",
+    "react-dom": "^16.8.6",
    "react-grid-layout": "^0.16.2",
    "react-hooks-testing-library": "^0.5.0",
    "react-input-range": "^1.3.0",
--- a/packages/kbn-i18n/package.json
+++ b/packages/kbn-i18n/package.json
@ -28,7 +28,7 @@
    "intl-messageformat": "^2.2.0",
    "intl-relativeformat": "^2.1.0",
    "prop-types": "^15.6.2",
-    "react": "^16.8.0",
+    "react": "^16.8.6",
    "react-intl": "^2.8.0"
  }
 }
--- a/packages/kbn-ui-framework/package.json
+++ b/packages/kbn-ui-framework/package.json
@ -19,7 +19,7 @@
    "focus-trap-react": "^3.1.1",
    "lodash": "npm:@elastic/lodash@3.10.1-kibana3",
    "prop-types": "15.6.0",
-    "react": "^16.8.0",
+    "react": "^16.8.6",
    "react-ace": "^5.9.0",
    "react-color": "^2.13.8",
    "tabbable": "1.1.3",
@ -57,7 +57,7 @@
    "postcss": "^7.0.5",
    "postcss-loader": "^3.0.0",
    "raw-loader": "^3.1.0",
-    "react-dom": "^16.8.0",
+    "react-dom": "^16.8.6",
    "react-redux": "^5.0.6",
    "react-router": "^3.2.0",
    "react-router-redux": "^4.0.8",
--- a/test/interpreter_functional/plugins/kbn_tp_run_pipeline/package.json
+++ b/test/interpreter_functional/plugins/kbn_tp_run_pipeline/package.json
@ -8,7 +8,7 @@
  "license": "Apache-2.0",
  "dependencies": {
    "@elastic/eui": "16.0.0",
-    "react": "^16.8.0",
-    "react-dom": "^16.8.0"
+    "react": "^16.8.6",
+    "react-dom": "^16.8.6"
  }
 }
--- a/test/plugin_functional/plugins/kbn_tp_custom_visualizations/package.json
+++ b/test/plugin_functional/plugins/kbn_tp_custom_visualizations/package.json
@ -8,6 +8,6 @@
  "license": "Apache-2.0",
  "dependencies": {
    "@elastic/eui": "16.0.0",
-    "react": "^16.8.0"
+    "react": "^16.8.6"
  }
 }
--- a/test/plugin_functional/plugins/kbn_tp_embeddable_explorer/package.json
+++ b/test/plugin_functional/plugins/kbn_tp_embeddable_explorer/package.json
@ -9,7 +9,7 @@
  "license": "Apache-2.0",
  "dependencies": {
    "@elastic/eui": "16.0.0",
-    "react": "^16.8.0"
+    "react": "^16.8.6"
  },
  "scripts": {
    "kbn": "node ../../../../scripts/kbn.js",
--- a/test/plugin_functional/plugins/kbn_tp_sample_panel_action/package.json
+++ b/test/plugin_functional/plugins/kbn_tp_sample_panel_action/package.json
@ -9,7 +9,7 @@
  "license": "Apache-2.0",
  "dependencies": {
    "@elastic/eui": "16.0.0",
-    "react": "^16.8.0"
+    "react": "^16.8.6"
  },
  "scripts": {
    "kbn": "node ../../../../scripts/kbn.js",
--- a/x-pack/legacy/plugins/siem/package.json
+++ b/x-pack/legacy/plugins/siem/package.json
@ -12,11 +12,11 @@
  "devDependencies": {
    "@types/lodash": "^4.14.110",
    "@types/js-yaml": "^3.12.1",
-    "@types/react-beautiful-dnd": "^10.0.1"
+    "@types/react-beautiful-dnd": "^11.0.3"
  },
  "dependencies": {
    "lodash": "^4.17.15",
-    "react-beautiful-dnd": "^10.0.1",
+    "react-beautiful-dnd": "^12.1.1",
    "react-markdown": "^4.0.6"
  }
 }
--- a/x-pack/legacy/plugins/siem/public/components/drag_and_drop/drag_drop_context.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/drag_and_drop/drag_drop_context.tsx
@ -0,0 +1,14 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+// https://github.com/DefinitelyTyped/DefinitelyTyped/pull/40309
+
+import { MovementMode, DraggableId } from 'react-beautiful-dnd';
+
+export interface BeforeCapture {
+  draggableId: DraggableId;
+  mode: MovementMode;
+}
--- a/x-pack/legacy/plugins/siem/public/components/drag_and_drop/drag_drop_context_wrapper.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/drag_and_drop/drag_drop_context_wrapper.tsx
@ -6,10 +6,11 @@

 import { defaultTo, noop } from 'lodash/fp';
 import React, { useCallback } from 'react';
-import { DragDropContext, DropResult, DragStart } from 'react-beautiful-dnd';
+import { DropResult, DragDropContext } from 'react-beautiful-dnd';
 import { connect } from 'react-redux';
 import { Dispatch } from 'redux';

+import { BeforeCapture } from './drag_drop_context';
 import { BrowserFields } from '../../containers/source';
 import { dragAndDropModel, dragAndDropSelectors } from '../../store';
 import { IdToDataProvider } from '../../store/drag_and_drop/model';
@ -20,6 +21,7 @@ import {
  addProviderToTimeline,
  fieldWasDroppedOnTimelineColumns,
  IS_DRAGGING_CLASS_NAME,
+  IS_TIMELINE_FIELD_DRAGGING_CLASS_NAME,
  providerWasDroppedOnTimeline,
  providerWasDroppedOnTimelineButton,
  draggableIsField,
@ -75,11 +77,16 @@ export const DragDropContextWrapperComponent = React.memo<Props>(
        if (!draggableIsField(result)) {
          document.body.classList.remove(IS_DRAGGING_CLASS_NAME);
        }
+
+        if (draggableIsField(result)) {
+          document.body.classList.remove(IS_TIMELINE_FIELD_DRAGGING_CLASS_NAME);
+        }
      },
      [browserFields, dataProviders]
    );
    return (
-      <DragDropContext onDragEnd={onDragEnd} onDragStart={onDragStart}>
+      // @ts-ignore
+      <DragDropContext onDragEnd={onDragEnd} onBeforeCapture={onBeforeCapture}>
        {children}
      </DragDropContext>
    );
@ -107,7 +114,7 @@ const mapStateToProps = (state: State) => {

 export const DragDropContextWrapper = connect(mapStateToProps)(DragDropContextWrapperComponent);

-const onDragStart = (initial: DragStart) => {
+const onBeforeCapture = (before: BeforeCapture) => {
  const x =
    window.pageXOffset !== undefined
      ? window.pageXOffset
@ -120,9 +127,13 @@ const onDragStart = (initial: DragStart) => {

  window.onscroll = () => window.scrollTo(x, y);

-  if (!draggableIsField(initial)) {
+  if (!draggableIsField(before)) {
    document.body.classList.add(IS_DRAGGING_CLASS_NAME);
  }
+
+  if (draggableIsField(before)) {
+    document.body.classList.add(IS_TIMELINE_FIELD_DRAGGING_CLASS_NAME);
+  }
 };

 const enableScrolling = () => (window.onscroll = () => noop);
--- a/x-pack/legacy/plugins/siem/public/components/drag_and_drop/draggable_wrapper.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/drag_and_drop/draggable_wrapper.tsx
@ -34,6 +34,10 @@ export const useDraggablePortalContext = () => useContext(DraggablePortalContext
 const Wrapper = styled.div`
  display: inline-block;
  max-width: 100%;
+
+  [data-rbd-placeholder-context-id] {
+    display: none !important;
+  }
 `;

 Wrapper.displayName = 'Wrapper';
--- a/x-pack/legacy/plugins/siem/public/components/drag_and_drop/helpers.test.ts
+++ b/x-pack/legacy/plugins/siem/public/components/drag_and_drop/helpers.test.ts
@ -116,7 +116,7 @@ describe('helpers', () => {
    test('it returns false when the draggable is NOT content', () => {
      expect(
        draggableIsContent({
-          destination: null,
+          destination: undefined,
          draggableId: `${draggableIdPrefix}.timeline.timeline.dataProvider.685260508808089`,
          reason: 'DROP',
          source: {
@ -230,10 +230,10 @@ describe('helpers', () => {
      ).toEqual(true);
    });

-    test('it returns false when the destination is null', () => {
+    test('it returns false when the destination is undefined', () => {
      expect(
        destinationIsTimelineProviders({
-          destination: null,
+          destination: undefined,
          draggableId: getDraggableId('685260508808089'),
          reason: 'DROP',
          source: {
@ -286,10 +286,10 @@ describe('helpers', () => {
      ).toEqual(true);
    });

-    test('it returns returns false when the destination is null', () => {
+    test('it returns returns false when the destination is undefined', () => {
      expect(
        destinationIsTimelineColumns({
-          destination: null,
+          destination: undefined,
          draggableId: getDraggableFieldId({ contextId: 'test', fieldId: 'event.action' }),
          reason: 'DROP',
          source: {
@ -342,10 +342,10 @@ describe('helpers', () => {
      ).toEqual(true);
    });

-    test('it returns false when the destination is null', () => {
+    test('it returns false when the destination is undefined', () => {
      expect(
        destinationIsTimelineButton({
-          destination: null,
+          destination: undefined,
          draggableId: getDraggableId('685260508808089'),
          reason: 'DROP',
          source: {
@ -436,10 +436,10 @@ describe('helpers', () => {
      ).toEqual('timeline');
    });

-    test('it returns returns an empty string when the destination is null', () => {
+    test('it returns returns an empty string when the destination is undefined', () => {
      expect(
        getTimelineIdFromDestination({
-          destination: null,
+          destination: undefined,
          draggableId: `${draggableIdPrefix}.timeline.timeline.dataProvider.685260508808089`,
          reason: 'DROP',
          source: {
@ -558,7 +558,7 @@ describe('helpers', () => {
    test('it returns false when the draggable is NOT content', () => {
      expect(
        providerWasDroppedOnTimeline({
-          destination: null,
+          destination: undefined,
          draggableId: `${draggableIdPrefix}.timeline.timeline.dataProvider.685260508808089`,
          reason: 'DROP',
          source: {
--- 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
@ -224,3 +224,6 @@ export const DRAG_TYPE_FIELD = 'drag-type-field';

 /** This class is added to the document body while dragging */
 export const IS_DRAGGING_CLASS_NAME = 'is-dragging';
+
+/** This class is added to the document body while timeline field dragging */
+export const IS_TIMELINE_FIELD_DRAGGING_CLASS_NAME = 'is-timeline-field-dragging';
--- a/x-pack/legacy/plugins/siem/public/components/error_toast_dispatcher/index.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/error_toast_dispatcher/index.test.tsx
@ -30,7 +30,7 @@ describe('Error Toast Dispatcher', () => {
          <ErrorToastDispatcher toastLifeTimeMs={9999999999} />
        </Provider>
      );
-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('Connect(ErrorToastDispatcherComponent)'))).toMatchSnapshot();
    });
  });
 });
--- a/x-pack/legacy/plugins/siem/public/components/page/hosts/authentications_table/index.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/page/hosts/authentications_table/index.test.tsx
@ -49,7 +49,7 @@ describe('Authentication Table Component', () => {
        </ReduxStoreProvider>
      );

-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('Connect(AuthenticationTableComponent)'))).toMatchSnapshot();
    });
  });

--- a/x-pack/legacy/plugins/siem/public/components/page/index.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/page/index.tsx
@ -19,7 +19,6 @@ import styled, { createGlobalStyle } from 'styled-components';
  SIDE EFFECT: the following `createGlobalStyle` overrides default styling in angular code that was not theme-friendly
  and `EuiPopover`, `EuiToolTip` global styles
 */
-
 export const AppGlobalStyle = createGlobalStyle`
  div.app-wrapper {
    background-color: rgba(0,0,0,0);
--- a/x-pack/legacy/plugins/siem/public/components/page/network/kpi_network/index.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/page/network/kpi_network/index.test.tsx
@ -42,7 +42,7 @@ describe('KpiNetwork Component', () => {
        </ReduxStoreProvider>
      );

-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('KpiNetworkComponent'))).toMatchSnapshot();
    });

    test('it renders the default widget', () => {
@ -59,7 +59,7 @@ describe('KpiNetwork Component', () => {
        </ReduxStoreProvider>
      );

-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('KpiNetworkComponent'))).toMatchSnapshot();
    });
  });
 });
--- a/x-pack/legacy/plugins/siem/public/components/page/network/network_dns_table/index.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/page/network/network_dns_table/index.test.tsx
@ -51,7 +51,7 @@ describe('NetworkTopNFlow Table Component', () => {
        </ReduxStoreProvider>
      );

-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('Connect(NetworkDnsTableComponent)'))).toMatchSnapshot();
    });
  });

--- a/x-pack/legacy/plugins/siem/public/components/page/network/network_http_table/index.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/page/network/network_http_table/index.test.tsx
@ -51,7 +51,7 @@ describe('NetworkHttp Table Component', () => {
        </ReduxStoreProvider>
      );

-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('Connect(NetworkHttpTableComponent)'))).toMatchSnapshot();
    });
  });

--- a/x-pack/legacy/plugins/siem/public/components/page/network/network_top_countries_table/index.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/page/network/network_top_countries_table/index.test.tsx
@ -57,7 +57,7 @@ describe('NetworkTopCountries Table Component', () => {
        </ReduxStoreProvider>
      );

-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('Connect(NetworkTopCountriesTableComponent)'))).toMatchSnapshot();
    });
    test('it renders the IP Details NetworkTopCountries table', () => {
      const wrapper = shallow(
@ -82,7 +82,7 @@ describe('NetworkTopCountries Table Component', () => {
        </ReduxStoreProvider>
      );

-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('Connect(NetworkTopCountriesTableComponent)'))).toMatchSnapshot();
    });
  });

--- a/x-pack/legacy/plugins/siem/public/components/page/network/network_top_n_flow_table/index.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/page/network/network_top_n_flow_table/index.test.tsx
@ -57,7 +57,7 @@ describe('NetworkTopNFlow Table Component', () => {
        </ReduxStoreProvider>
      );

-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('Connect(NetworkTopNFlowTableComponent)'))).toMatchSnapshot();
    });

    test('it renders the default NetworkTopNFlow table on the IP Details page', () => {
@ -83,7 +83,7 @@ describe('NetworkTopNFlow Table Component', () => {
        </ReduxStoreProvider>
      );

-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('Connect(NetworkTopNFlowTableComponent)'))).toMatchSnapshot();
    });
  });

--- a/x-pack/legacy/plugins/siem/public/components/page/network/tls_table/index.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/page/network/tls_table/index.test.tsx
@ -47,7 +47,7 @@ describe('Tls Table Component', () => {
        </ReduxStoreProvider>
      );

-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('Connect(TlsTableComponent)'))).toMatchSnapshot();
    });
  });

--- a/x-pack/legacy/plugins/siem/public/components/page/network/users_table/index.test.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/page/network/users_table/index.test.tsx
@ -55,7 +55,7 @@ describe('Users Table Component', () => {
        </ReduxStoreProvider>
      );

-      expect(toJson(wrapper)).toMatchSnapshot();
+      expect(toJson(wrapper.find('Connect(UsersTableComponent)'))).toMatchSnapshot();
    });
  });

--- a/x-pack/legacy/plugins/siem/public/components/timeline/body/column_headers/snapshots/index.test.tsx.snap
+++ b/x-pack/legacy/plugins/siem/public/components/timeline/body/column_headers/snapshots/index.test.tsx.snap
@ -483,8 +483,12 @@ exports[`ColumnHeaders rendering renders correctly against snapshot 1`] = `
    <Connect(Droppable)
      direction="horizontal"
      droppableId="droppableId.timelineColumns.test"
+      getContainerForClone={[Function]}
      ignoreContainerClipping={false}
+      isCombineEnabled={false}
      isDropDisabled={false}
+      mode="standard"
+      renderClone={null}
      type="drag-type-field"
    >
      <Component />
--- a/x-pack/legacy/plugins/siem/public/components/timeline/body/index.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/timeline/body/index.tsx
@ -19,7 +19,7 @@ import {
  OnUnPinEvent,
  OnUpdateColumns,
 } from '../events';
-import { EventsTable, TimelineBody } from '../styles';
+import { EventsTable, TimelineBody, TimelineBodyGlobalStyle } from '../styles';
 import { ColumnHeaders } from './column_headers';
 import { ColumnHeader } from './column_headers/column_header';
 import { Events } from './events';
@ -86,50 +86,53 @@ export const Body = React.memo<BodyProps>(
    );

    return (
-      <TimelineBody data-test-subj="timeline-body" bodyHeight={height}>
-        <EventsTable
-          data-test-subj="events-table"
-          // Passing the styles directly to the component because the width is being calculated and is recommended by Styled Components for performance: https://github.com/styled-components/styled-components/issues/134#issuecomment-312415291
-          style={{ minWidth: columnWidths + 'px' }}
-        >
-          <ColumnHeaders
-            actionsColumnWidth={getActionsColumnWidth(isEventViewer)}
-            browserFields={browserFields}
-            columnHeaders={columnHeaders}
-            isEventViewer={isEventViewer}
-            onColumnRemoved={onColumnRemoved}
-            onColumnResized={onColumnResized}
-            onColumnSorted={onColumnSorted}
-            onFilterChange={onFilterChange}
-            onUpdateColumns={onUpdateColumns}
-            showEventsSelect={false}
-            sort={sort}
-            timelineId={id}
-            toggleColumn={toggleColumn}
-          />
+      <>
+        <TimelineBody data-test-subj="timeline-body" bodyHeight={height}>
+          <EventsTable
+            data-test-subj="events-table"
+            // Passing the styles directly to the component because the width is being calculated and is recommended by Styled Components for performance: https://github.com/styled-components/styled-components/issues/134#issuecomment-312415291
+            style={{ minWidth: columnWidths + 'px' }}
+          >
+            <ColumnHeaders
+              actionsColumnWidth={getActionsColumnWidth(isEventViewer)}
+              browserFields={browserFields}
+              columnHeaders={columnHeaders}
+              isEventViewer={isEventViewer}
+              onColumnRemoved={onColumnRemoved}
+              onColumnResized={onColumnResized}
+              onColumnSorted={onColumnSorted}
+              onFilterChange={onFilterChange}
+              onUpdateColumns={onUpdateColumns}
+              showEventsSelect={false}
+              sort={sort}
+              timelineId={id}
+              toggleColumn={toggleColumn}
+            />

-          <Events
-            actionsColumnWidth={getActionsColumnWidth(isEventViewer)}
-            addNoteToEvent={addNoteToEvent}
-            browserFields={browserFields}
-            columnHeaders={columnHeaders}
-            columnRenderers={columnRenderers}
-            data={data}
-            eventIdToNoteIds={eventIdToNoteIds}
-            getNotesByIds={getNotesByIds}
-            id={id}
-            isEventViewer={isEventViewer}
-            onColumnResized={onColumnResized}
-            onPinEvent={onPinEvent}
-            onUpdateColumns={onUpdateColumns}
-            onUnPinEvent={onUnPinEvent}
-            pinnedEventIds={pinnedEventIds}
-            rowRenderers={rowRenderers}
-            toggleColumn={toggleColumn}
-            updateNote={updateNote}
-          />
-        </EventsTable>
-      </TimelineBody>
+            <Events
+              actionsColumnWidth={getActionsColumnWidth(isEventViewer)}
+              addNoteToEvent={addNoteToEvent}
+              browserFields={browserFields}
+              columnHeaders={columnHeaders}
+              columnRenderers={columnRenderers}
+              data={data}
+              eventIdToNoteIds={eventIdToNoteIds}
+              getNotesByIds={getNotesByIds}
+              id={id}
+              isEventViewer={isEventViewer}
+              onColumnResized={onColumnResized}
+              onPinEvent={onPinEvent}
+              onUpdateColumns={onUpdateColumns}
+              onUnPinEvent={onUnPinEvent}
+              pinnedEventIds={pinnedEventIds}
+              rowRenderers={rowRenderers}
+              toggleColumn={toggleColumn}
+              updateNote={updateNote}
+            />
+          </EventsTable>
+        </TimelineBody>
+        <TimelineBodyGlobalStyle />
+      </>
    );
  }
 );
--- a/x-pack/legacy/plugins/siem/public/components/timeline/styles.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/timeline/styles.tsx
@ -6,7 +6,9 @@

 import { EuiLoadingSpinner } from '@elastic/eui';
 import { rgba } from 'polished';
-import styled from 'styled-components';
+import styled, { createGlobalStyle } from 'styled-components';
+
+import { IS_TIMELINE_FIELD_DRAGGING_CLASS_NAME } from '../drag_and_drop/helpers';

 /**
 * OFFSET PIXEL VALUES
@ -18,6 +20,13 @@ export const OFFSET_SCROLLBAR = 17;
 * TIMELINE BODY
 */

+// SIDE EFFECT: the following creates a global class selector
+export const TimelineBodyGlobalStyle = createGlobalStyle`
+  body.${IS_TIMELINE_FIELD_DRAGGING_CLASS_NAME} .siemTimeline__body {
+    overflow: hidden;
+  }
+`;
+
 export const TimelineBody = styled.div.attrs(({ className }) => ({
  className: `siemTimeline__body ${className}`,
 }))<{ bodyHeight: number }>`
--- a/x-pack/package.json
+++ b/x-pack/package.json
@ -92,7 +92,7 @@
    "@types/react-resize-detector": "^4.0.1",
    "@types/react-router-dom": "^4.3.1",
    "@types/react-sticky": "^6.0.3",
-    "@types/react-test-renderer": "^16.8.0",
+    "@types/react-test-renderer": "^16.8.3",
    "@types/recompose": "^0.30.6",
    "@types/reduce-reducers": "^0.3.0",
    "@types/redux-actions": "^2.2.1",
@ -153,7 +153,7 @@
    "proxyquire": "1.8.0",
    "react-docgen-typescript-loader": "^3.1.1",
    "react-hooks-testing-library": "^0.3.8",
-    "react-test-renderer": "^16.8.0",
+    "react-test-renderer": "^16.8.6",
    "react-testing-library": "^6.0.0",
    "sass-loader": "^7.3.1",
    "simple-git": "1.116.0",
@ -292,11 +292,11 @@
    "puid": "1.0.7",
    "puppeteer-core": "^1.19.0",
    "raw-loader": "3.1.0",
-    "react": "^16.8.0",
+    "react": "^16.8.6",
    "react-apollo": "^2.1.4",
    "react-beautiful-dnd": "^8.0.7",
    "react-datetime": "^2.14.0",
-    "react-dom": "^16.8.0",
+    "react-dom": "^16.8.6",
    "react-dropzone": "^4.2.9",
    "react-fast-compare": "^2.0.4",
    "react-markdown": "^3.4.1",
--- a/yarn.lock
+++ b/yarn.lock
@ -982,6 +982,14 @@
    core-js "^2.6.5"
    regenerator-runtime "^0.13.2"

+"@babel/runtime-corejs2@^7.6.3":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/runtime-corejs2/-/runtime-corejs2-7.7.4.tgz#b9c2b1b5882762005785bc47740195a0ac780888"
+  integrity sha512-hKNcmHQbBSJFnZ82ewYtWDZ3fXkP/l1XcfRtm7c8gHPM/DMecJtFFBEp7KMLZTuHwwb7RfemHdsEnd7L916Z6A==
+  dependencies:
+    core-js "^2.6.5"
+    regenerator-runtime "^0.13.2"
+
 "@babel/runtime@7.0.0-beta.54":
  version "7.0.0-beta.54"
  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.0.0-beta.54.tgz#39ebb42723fe7ca4b3e1b00e967e80138d47cadf"
@ -3717,13 +3725,6 @@
    "@types/history" "*"
    "@types/react" "*"

-"@types/react-beautiful-dnd@^10.0.1":
-  version "10.1.2"
-  resolved "https://registry.yarnpkg.com/@types/react-beautiful-dnd/-/react-beautiful-dnd-10.1.2.tgz#74069f7b1d0cb67b7af99a2584b30e496e545d8b"
-  integrity sha512-76M5VRbhduUarM9wyMWQm3tLKCVMKTlhG0+W67dteg/HBE+kueIwuyLWzE0m5fmuilvrDXoM5NL890KLnHETZw==
-  dependencies:
-    "@types/react" "*"
-
 "@types/react-beautiful-dnd@^10.1.0":
  version "10.1.1"
  resolved "https://registry.yarnpkg.com/@types/react-beautiful-dnd/-/react-beautiful-dnd-10.1.1.tgz#7afae39a4247f30c13b8bbb726ccd1b8cda9d4a5"
@ -3731,6 +3732,13 @@
  dependencies:
    "@types/react" "*"

+"@types/react-beautiful-dnd@^11.0.3":
+  version "11.0.3"
+  resolved "https://registry.yarnpkg.com/@types/react-beautiful-dnd/-/react-beautiful-dnd-11.0.3.tgz#51d9f37942dd18cc4aa10da98a5c883664e7ee46"
+  integrity sha512-7ZbT/7mNJu+uRrUGdTQ1hAINtqg909L4NHrXyspV42fvVgBgda6ysiBzoDUMENmQ/RlRJdpyrcp8Dtd/77bp9Q==
+  dependencies:
+    "@types/react" "*"
+
 "@types/react-color@^3.0.1":
  version "3.0.1"
  resolved "https://registry.yarnpkg.com/@types/react-color/-/react-color-3.0.1.tgz#5433e2f503ea0e0831cbc6fd0c20f8157d93add0"
@ -3811,10 +3819,10 @@
  dependencies:
    "@types/react" "*"

-"@types/react-test-renderer@^16.8.0":
-  version "16.8.1"
-  resolved "https://registry.yarnpkg.com/@types/react-test-renderer/-/react-test-renderer-16.8.1.tgz#96f3ce45a3a41c94eca532a99103dd3042c9d055"
-  integrity sha512-8gU69ELfJGxzVWVYj4MTtuHxz9nO+d175XeQ1XrXXxesUBsB4KK6OCfzVhEX6leZWWBDVtMJXp/rUjhClzL7gw==
+"@types/react-test-renderer@^16.8.3":
+  version "16.9.1"
+  resolved "https://registry.yarnpkg.com/@types/react-test-renderer/-/react-test-renderer-16.9.1.tgz#9d432c46c515ebe50c45fa92c6fb5acdc22e39c4"
+  integrity sha512-nCXQokZN1jp+QkoDNmDZwoWpKY8HDczqevIDO4Uv9/s9rbGPbSpy8Uaxa5ixHKkcm/Wt0Y9C3wCxZivh4Al+rQ==
  dependencies:
    "@types/react" "*"

@ -4515,7 +4523,7 @@ acorn-walk@^7.0.0:
  resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-7.0.0.tgz#c8ba6f0f1aac4b0a9e32d1f0af12be769528f36b"
  integrity sha512-7Bv1We7ZGuU79zZbb6rRqcpxo3OY+zrdtloZWoyD8fmGX+FeXRjE+iuGkZjSXLVovLzrsvMGMy0EkwA0E0umxg==

-acorn@5.X, acorn@^5.0.0, acorn@^5.0.3, acorn@^5.1.2, acorn@^5.2.1, acorn@^5.5.0:
+acorn@5.X, acorn@^5.0.0, acorn@^5.0.3, acorn@^5.1.2, acorn@^5.5.0:
  version "5.7.3"
  resolved "https://registry.yarnpkg.com/acorn/-/acorn-5.7.3.tgz#67aa231bf8812974b85235a96771eb6bd07ea279"
  integrity sha512-T/zvzYRfbVojPWahDsE5evJdHb3oJoQfFbsrKM7w5Zcs++Tr257tia3BmMP8XYVjp1S9RZXQMh7gao96BlqZOw==
@ -6333,11 +6341,6 @@ balanced-match@^1.0.0:
  resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767"
  integrity sha1-ibTRmasr7kneFk6gK4nORi1xt2c=

-base62@^1.1.0:
-  version "1.2.8"
-  resolved "https://registry.yarnpkg.com/base62/-/base62-1.2.8.tgz#1264cb0fb848d875792877479dbe8bae6bae3428"
-  integrity sha512-V6YHUbjLxN1ymqNLb1DPHoU1CpfdL7d2YTIp5W3U4hhoG4hhxNmsFDs66M9EXxBiSEke5Bt5dwdfMwwZF70iLA==
-
 base64-arraybuffer@0.1.5:
  version "0.1.5"
  resolved "https://registry.yarnpkg.com/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz#73926771923b5a19747ad666aa5cd4bf9c6e9ce8"
@ -8191,11 +8194,6 @@ commander@2.20.0, commander@^2.13.0, commander@^2.15.1, commander@^2.16.0, comma
  resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.0.tgz#d58bb2b5c1ee8f87b0d340027e9e94e222c5a422"
  integrity sha512-7j2y+40w61zy6YC2iRNpUe/NwhNyoXrYpHMrSunaMG64nRnaf96zO/KMQR4OyN/UnE5KLyEBnKHd4aG3rskjpQ==

-commander@^2.5.0:
-  version "2.20.3"
-  resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"
-  integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
-
 commander@^2.8.1:
  version "2.18.0"
  resolved "https://registry.yarnpkg.com/commander/-/commander-2.18.0.tgz#2bf063ddee7c7891176981a2cc798e5754bc6970"
@ -8225,21 +8223,6 @@ commondir@^1.0.1:
  resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b"
  integrity sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs=

-commoner@^0.10.1:
-  version "0.10.8"
-  resolved "https://registry.yarnpkg.com/commoner/-/commoner-0.10.8.tgz#34fc3672cd24393e8bb47e70caa0293811f4f2c5"
-  integrity sha1-NPw2cs0kOT6LtH5wyqApOBH08sU=
-  dependencies:
-    commander "^2.5.0"
-    detective "^4.3.1"
-    glob "^5.0.15"
-    graceful-fs "^4.1.2"
-    iconv-lite "^0.4.5"
-    mkdirp "^0.5.0"
-    private "^0.1.6"
-    q "^1.1.2"
-    recast "^0.11.17"
-
 compare-versions@3.5.1:
  version "3.5.1"
  resolved "https://registry.yarnpkg.com/compare-versions/-/compare-versions-3.5.1.tgz#26e1f5cf0d48a77eced5046b9f67b6b61075a393"
@ -8933,6 +8916,13 @@ css-box-model@^1.1.1:
  dependencies:
    tiny-invariant "^1.0.3"

+css-box-model@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/css-box-model/-/css-box-model-1.2.0.tgz#3a26377b4162b3200d2ede4b064ec5b6a75186d0"
+  integrity sha512-lri0br+jSNV0kkkiGEp9y9y3Njq2PmpqbeGWRFQJuZteZzY9iC9GZhQ8Y4WpPwM/2YocjHePxy14igJY7YKzkA==
+  dependencies:
+    tiny-invariant "^1.0.6"
+
 css-color-keywords@^1.0.0:
  version "1.0.0"
  resolved "https://registry.yarnpkg.com/css-color-keywords/-/css-color-keywords-1.0.0.tgz#fea2616dc676b2962686b3af8dbdbe180b244e05"
@ -9762,7 +9752,7 @@ define-property@^2.0.2:
    is-descriptor "^1.0.2"
    isobject "^3.0.1"

-defined@^1.0.0, defined@~1.0.0:
+defined@~1.0.0:
  version "1.0.0"
  resolved "https://registry.yarnpkg.com/defined/-/defined-1.0.0.tgz#c98d9bcef75674188e110969151199e39b1fa693"
  integrity sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM=
@ -10011,14 +10001,6 @@ detective-typescript@^5.1.1:
    node-source-walk "^4.2.0"
    typescript "^3.4.5"

-detective@^4.3.1:
-  version "4.7.1"
-  resolved "https://registry.yarnpkg.com/detective/-/detective-4.7.1.tgz#0eca7314338442febb6d65da54c10bb1c82b246e"
-  integrity sha512-H6PmeeUcZloWtdt4DAkFyzFL94arpHr3NOwwmVILFiy+9Qd4JTxxXrzfyGk/lmct2qVGBwTSwSXagqu2BxmWig==
-  dependencies:
-    acorn "^5.2.1"
-    defined "^1.0.0"
-
 dezalgo@^1.0.0:
  version "1.0.3"
  resolved "https://registry.yarnpkg.com/dezalgo/-/dezalgo-1.0.3.tgz#7f742de066fc748bc8db820569dddce49bf0d456"
@ -10697,14 +10679,6 @@ env-variable@0.0.x:
  resolved "https://registry.yarnpkg.com/env-variable/-/env-variable-0.0.5.tgz#913dd830bef11e96a039c038d4130604eba37f88"
  integrity sha512-zoB603vQReOFvTg5xMl9I1P2PnHsHQQKTEowsKKD7nseUfJq6UWzK+4YtlWUO1nhiQUxe6XMkk+JleSZD1NZFA==

-envify@^3.0.0:
-  version "3.4.1"
-  resolved "https://registry.yarnpkg.com/envify/-/envify-3.4.1.tgz#d7122329e8df1688ba771b12501917c9ce5cbce8"
-  integrity sha1-1xIjKejfFoi6dxsSUBkXyc5cvOg=
-  dependencies:
-    jstransform "^11.0.3"
-    through "~2.3.4"
-
 enzyme-adapter-react-16@^1.15.1:
  version "1.15.1"
  resolved "https://registry.yarnpkg.com/enzyme-adapter-react-16/-/enzyme-adapter-react-16-1.15.1.tgz#8ad55332be7091dc53a25d7d38b3485fc2ba50d5"
@ -11396,11 +11370,6 @@ espree@^6.1.1:
    acorn-jsx "^5.0.2"
    eslint-visitor-keys "^1.1.0"

-esprima-fb@^15001.1.0-dev-harmony-fb:
-  version "15001.1.0-dev-harmony-fb"
-  resolved "https://registry.yarnpkg.com/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz#30a947303c6b8d5e955bee2b99b1d233206a6901"
-  integrity sha1-MKlHMDxrjV6VW+4rmbHSMyBqaQE=
-
 esprima@2.7.x, esprima@^2.7.1:
  version "2.7.3"
  resolved "https://registry.yarnpkg.com/esprima/-/esprima-2.7.3.tgz#96e3b70d5779f6ad49cd032673d1c312767ba581"
@ -12075,17 +12044,6 @@ fb-watchman@^2.0.0:
  dependencies:
    bser "^2.0.0"

-fbjs@^0.6.1:
-  version "0.6.1"
-  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.6.1.tgz#9636b7705f5ba9684d44b72f78321254afc860f7"
-  integrity sha1-lja3cF9bqWhNRLcveDISVK/IYPc=
-  dependencies:
-    core-js "^1.0.0"
-    loose-envify "^1.0.0"
-    promise "^7.0.3"
-    ua-parser-js "^0.7.9"
-    whatwg-fetch "^0.9.0"
-
 fbjs@^0.8.0, fbjs@^0.8.1, fbjs@^0.8.16:
  version "0.8.17"
  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
@ -14951,7 +14909,7 @@ icalendar@0.7.1:
  resolved "https://registry.yarnpkg.com/icalendar/-/icalendar-0.7.1.tgz#d0d3486795f8f1c5cf4f8cafac081b4b4e7a32ae"
  integrity sha1-0NNIZ5X48cXPT4yvrAgbS056Mq4=

-iconv-lite@0.4, iconv-lite@0.4.24, iconv-lite@^0.4.17, iconv-lite@^0.4.22, iconv-lite@^0.4.24, iconv-lite@^0.4.4, iconv-lite@^0.4.5, iconv-lite@~0.4.13:
+iconv-lite@0.4, iconv-lite@0.4.24, iconv-lite@^0.4.17, iconv-lite@^0.4.22, iconv-lite@^0.4.24, iconv-lite@^0.4.4, iconv-lite@~0.4.13:
  version "0.4.24"
  resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
  integrity sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==
@ -17203,17 +17161,6 @@ jssha@^2.1.0:
  resolved "https://registry.yarnpkg.com/jssha/-/jssha-2.3.1.tgz#147b2125369035ca4b2f7d210dc539f009b3de9a"
  integrity sha1-FHshJTaQNcpLL30hDcU58Amz3po=

-jstransform@^11.0.3:
-  version "11.0.3"
-  resolved "https://registry.yarnpkg.com/jstransform/-/jstransform-11.0.3.tgz#09a78993e0ae4d4ef4487f6155a91f6190cb4223"
-  integrity sha1-CaeJk+CuTU70SH9hVakfYZDLQiM=
-  dependencies:
-    base62 "^1.1.0"
-    commoner "^0.10.1"
-    esprima-fb "^15001.1.0-dev-harmony-fb"
-    object-assign "^2.0.0"
-    source-map "^0.4.2"
-
 jstransformer-ejs@^0.0.3:
  version "0.0.3"
  resolved "https://registry.yarnpkg.com/jstransformer-ejs/-/jstransformer-ejs-0.0.3.tgz#04d9201469274fcf260f1e7efd732d487fa234b6"
@ -18808,6 +18755,11 @@ memoize-one@^5.0.1:
  resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-5.0.2.tgz#6aba5276856d72fb44ead3efab86432f94ba203d"
  integrity sha512-o7lldN4fs/axqctc03NF+PMhd2veRrWeJ2n2GjEzUPBD4F9rmNg4A+bQCACIzwjHJEXuYv4aFFMaH35KZfHUrw==

+memoize-one@^5.1.1:
+  version "5.1.1"
+  resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-5.1.1.tgz#047b6e3199b508eaec03504de71229b8eb1d75c0"
+  integrity sha512-HKeeBpWvqiVJD57ZUAsJNm71eHTykffzcLZVYWiVfQeI1rJtuEaS7hQiEpWfVVk18donPwJEcFKIkCmPJNOhHA==
+
 memoizee@0.4.X:
  version "0.4.14"
  resolved "https://registry.yarnpkg.com/memoizee/-/memoizee-0.4.14.tgz#07a00f204699f9a95c2d9e77218271c7cd610d57"
@ -21931,7 +21883,7 @@ promise.prototype.finally@^3.1.0:
    es-abstract "^1.9.0"
    function-bind "^1.1.1"

-promise@^7.0.1, promise@^7.0.3, promise@^7.1.1:
+promise@^7.0.1, promise@^7.1.1:
  version "7.3.1"
  resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
  integrity sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==
@ -22382,6 +22334,11 @@ raf-schd@^4.0.0:
  resolved "https://registry.yarnpkg.com/raf-schd/-/raf-schd-4.0.0.tgz#9855756c5045ff4ed4516e14a47719387c3c907b"
  integrity sha512-m7zq0JkIrECzw9mO5Zcq6jN4KayE34yoIS9hJoiZNXyOAT06PPA8PrR+WtJIeFW09YjUfNkMMN9lrmAt6BURCA==

+raf-schd@^4.0.2:
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/raf-schd/-/raf-schd-4.0.2.tgz#bd44c708188f2e84c810bf55fcea9231bcaed8a0"
+  integrity sha512-VhlMZmGy6A6hrkJWHLNTGl5gtgMUm+xfGza6wbwnE914yeQ5Ybm18vgM734RZhMgfw4tacUrWseGZlpUrrakEQ==
+
 raf@^3.1.0, raf@^3.3.0:
  version "3.4.0"
  resolved "https://registry.yarnpkg.com/raf/-/raf-3.4.0.tgz#a28876881b4bc2ca9117d4138163ddb80f781575"
@ -22577,7 +22534,7 @@ react-apollo@^2.1.4:
    lodash "^4.17.10"
    prop-types "^15.6.0"

-react-beautiful-dnd@^10.0.1, react-beautiful-dnd@^10.1.0:
+react-beautiful-dnd@^10.1.0:
  version "10.1.1"
  resolved "https://registry.yarnpkg.com/react-beautiful-dnd/-/react-beautiful-dnd-10.1.1.tgz#d753088d77d7632e77cf8a8935fafcffa38f574b"
  integrity sha512-TdE06Shfp56wm28EzjgC56EEMgGI5PDHejJ2bxuAZvZr8CVsbksklsJC06Hxf0MSL7FHbflL/RpkJck9isuxHg==
@ -22591,6 +22548,19 @@ react-beautiful-dnd@^10.0.1, react-beautiful-dnd@^10.1.0:
    redux "^4.0.1"
    tiny-invariant "^1.0.4"

+react-beautiful-dnd@^12.1.1:
+  version "12.1.1"
+  resolved "https://registry.yarnpkg.com/react-beautiful-dnd/-/react-beautiful-dnd-12.1.1.tgz#810f9b9d94f667b15b253793e853d016a0f3f07c"
+  integrity sha512-w/mpIXMEXowc53PCEnMoFyAEYFgxMfygMK5msLo5ifJ2/CiSACLov9A79EomnPF7zno3N207QGXsraBxAJnyrw==
+  dependencies:
+    "@babel/runtime-corejs2" "^7.6.3"
+    css-box-model "^1.2.0"
+    memoize-one "^5.1.1"
+    raf-schd "^4.0.2"
+    react-redux "^7.1.1"
+    redux "^4.0.4"
+    use-memo-one "^1.1.1"
+
 react-beautiful-dnd@^8.0.7:
  version "8.0.7"
  resolved "https://registry.yarnpkg.com/react-beautiful-dnd/-/react-beautiful-dnd-8.0.7.tgz#2cc7ba62bffe08d3dad862fd8f48204440901b43"
@ -22715,17 +22685,7 @@ react-docgen@^4.1.0:
    node-dir "^0.1.10"
    recast "^0.17.3"

-react-dom@^16.8.0:
-  version "16.8.2"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.8.2.tgz#7c8a69545dd554d45d66442230ba04a6a0a3c3d3"
-  integrity sha512-cPGfgFfwi+VCZjk73buu14pYkYBR1b/SRMSYqkLDdhSEHnSwcuYTPu6/Bh6ZphJFIk80XLvbSe2azfcRzNF+Xg==
-  dependencies:
-    loose-envify "^1.1.0"
-    object-assign "^4.1.1"
-    prop-types "^15.6.2"
-    scheduler "^0.13.2"
-
-react-dom@^16.8.3, react-dom@^16.8.5:
+react-dom@16.8.6, react-dom@^16.8.3, react-dom@^16.8.5, react-dom@^16.8.6:
  version "16.8.6"
  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.8.6.tgz#71d6303f631e8b0097f56165ef608f051ff6e10f"
  integrity sha512-1nL7PIq9LTL3fthPqwkvr2zY7phIPjYrT0jp4HjyEQrEROnw4dG41VVwi/wfoCneoleqrNX7iAD+pXebJZwrwA==
@ -22888,7 +22848,7 @@ react-is@^16.10.2, react-is@^16.9.0:
  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.11.0.tgz#b85dfecd48ad1ce469ff558a882ca8e8313928fa"
  integrity sha512-gbBVYR2p8mnriqAwWx9LbuUrShnAuSCNnuPGyc7GJrMVQtPDAh8iLpv7FRuMPFb56KkaVZIYSz1PrjI9q0QPCw==

-react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.2, react-is@^16.8.6:
+react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.6:
  version "16.8.6"
  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.6.tgz#5bbc1e2d29141c9fbdfed456343fe2bc430a6a16"
  integrity sha512-aUk3bHfZ2bRSVFFbbeVS4i+lNPZr3/WM5jT2J5omUVV1zzcs1nAaf3l51ctA5FFvCRbhrH0bdAsRRQddFJZPtA==
@ -23065,6 +23025,18 @@ react-redux@^5.1.1:
    react-is "^16.6.0"
    react-lifecycles-compat "^3.0.0"

+react-redux@^7.1.1:
+  version "7.1.3"
+  resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-7.1.3.tgz#717a3d7bbe3a1b2d535c94885ce04cdc5a33fc79"
+  integrity sha512-uI1wca+ECG9RoVkWQFF4jDMqmaw0/qnvaSvOoL/GA4dNxf6LoV8sUAcNDvE5NWKs4hFpn0t6wswNQnY3f7HT3w==
+  dependencies:
+    "@babel/runtime" "^7.5.5"
+    hoist-non-react-statics "^3.3.0"
+    invariant "^2.2.4"
+    loose-envify "^1.4.0"
+    prop-types "^15.7.2"
+    react-is "^16.9.0"
+
 react-resizable@1.x:
  version "1.7.5"
  resolved "https://registry.yarnpkg.com/react-resizable/-/react-resizable-1.7.5.tgz#83eb75bb3684da6989bbbf4f826e1470f0af902e"
@ -23213,7 +23185,7 @@ react-syntax-highlighter@^8.0.1:
    prismjs "^1.8.4"
    refractor "^2.4.1"

-react-test-renderer@^16.0.0-0:
+react-test-renderer@16.8.6, react-test-renderer@^16.0.0-0, react-test-renderer@^16.8.6:
  version "16.8.6"
  resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-16.8.6.tgz#188d8029b8c39c786f998aa3efd3ffe7642d5ba1"
  integrity sha512-H2srzU5IWYT6cZXof6AhUcx/wEyJddQ8l7cLM/F7gDXYyPr4oq+vCIxJYXVGhId1J706sqziAjuOEjyNkfgoEw==
@ -23223,16 +23195,6 @@ react-test-renderer@^16.0.0-0:
    react-is "^16.8.6"
    scheduler "^0.13.6"

-react-test-renderer@^16.8.0:
-  version "16.8.2"
-  resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-16.8.2.tgz#3ce0bf12aa211116612fda01a886d6163c9c459b"
-  integrity sha512-gsd4NoOaYrZD2R8zi+CBV9wTGMsGhE2bRe4wvenGy0WcLJgdPscRZDDz+kmLjY+/5XpYC8yRR/v4CScgYfGyoQ==
-  dependencies:
-    object-assign "^4.1.1"
-    prop-types "^15.6.2"
-    react-is "^16.8.2"
-    scheduler "^0.13.2"
-
 react-testing-library@^6.0.0:
  version "6.0.0"
  resolved "https://registry.yarnpkg.com/react-testing-library/-/react-testing-library-6.0.0.tgz#81edfcfae8a795525f48685be9bf561df45bb35d"
@ -23320,25 +23282,7 @@ react-visibility-sensor@^5.1.1:
  dependencies:
    prop-types "^15.7.2"

-react@^0.14.0:
-  version "0.14.9"
-  resolved "https://registry.yarnpkg.com/react/-/react-0.14.9.tgz#9110a6497c49d44ba1c0edd317aec29c2e0d91d1"
-  integrity sha1-kRCmSXxJ1EuhwO3TF67CnC4NkdE=
-  dependencies:
-    envify "^3.0.0"
-    fbjs "^0.6.1"
-
-react@^16.8.0:
-  version "16.8.2"
-  resolved "https://registry.yarnpkg.com/react/-/react-16.8.2.tgz#83064596feaa98d9c2857c4deae1848b542c9c0c"
-  integrity sha512-aB2ctx9uQ9vo09HVknqv3DGRpI7OIGJhCx3Bt0QqoRluEjHSaObJl+nG12GDdYH6sTgE7YiPJ6ZUyMx9kICdXw==
-  dependencies:
-    loose-envify "^1.1.0"
-    object-assign "^4.1.1"
-    prop-types "^15.6.2"
-    scheduler "^0.13.2"
-
-react@^16.8.3, react@^16.8.5:
+react@16.8.6, react@^0.14.0, react@^16.8.3, react@^16.8.5, react@^16.8.6:
  version "16.8.6"
  resolved "https://registry.yarnpkg.com/react/-/react-16.8.6.tgz#ad6c3a9614fd3a4e9ef51117f54d888da01f2bbe"
  integrity sha512-pC0uMkhLaHm11ZSJULfOBqV4tIZkx87ZLvbbQYunNixAAvjnC+snJCg0XQXn9VIsttVsbZP/H/ewzgsd5fxKXw==
@ -23571,16 +23515,6 @@ realpath-native@^1.1.0:
  dependencies:
    util.promisify "^1.0.0"

-recast@^0.11.17, recast@~0.11.12:
-  version "0.11.23"
-  resolved "https://registry.yarnpkg.com/recast/-/recast-0.11.23.tgz#451fd3004ab1e4df9b4e4b66376b2a21912462d3"
-  integrity sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM=
-  dependencies:
-    ast-types "0.9.6"
-    esprima "~3.1.0"
-    private "~0.1.5"
-    source-map "~0.5.0"
-
 recast@^0.14.7:
  version "0.14.7"
  resolved "https://registry.yarnpkg.com/recast/-/recast-0.14.7.tgz#4f1497c2b5826d42a66e8e3c9d80c512983ff61d"
@ -23601,6 +23535,16 @@ recast@^0.17.3:
    private "^0.1.8"
    source-map "~0.6.1"

+recast@~0.11.12:
+  version "0.11.23"
+  resolved "https://registry.yarnpkg.com/recast/-/recast-0.11.23.tgz#451fd3004ab1e4df9b4e4b66376b2a21912462d3"
+  integrity sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM=
+  dependencies:
+    ast-types "0.9.6"
+    esprima "~3.1.0"
+    private "~0.1.5"
+    source-map "~0.5.0"
+
 rechoir@^0.6.2:
  version "0.6.2"
  resolved "https://registry.yarnpkg.com/rechoir/-/rechoir-0.6.2.tgz#85204b54dba82d5742e28c96756ef43af50e3384"
@ -23726,6 +23670,14 @@ redux@^4.0.1:
    loose-envify "^1.4.0"
    symbol-observable "^1.2.0"

+redux@^4.0.4:
+  version "4.0.4"
+  resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.4.tgz#4ee1aeb164b63d6a1bcc57ae4aa0b6e6fa7a3796"
+  integrity sha512-vKv4WdiJxOWKxK0yRoaK3Y4pxxB0ilzVx6dszU2W8wLxlb2yikRph4iV/ymtdJ6ZxpBLFbyrxklnT5yBbQSl3Q==
+  dependencies:
+    loose-envify "^1.4.0"
+    symbol-observable "^1.2.0"
+
 reflect.ownkeys@^0.2.0:
  version "0.2.0"
  resolved "https://registry.yarnpkg.com/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz#749aceec7f3fdf8b63f927a04809e90c5c0b3460"
@ -24776,7 +24728,7 @@ saxes@^3.1.3:
  dependencies:
    xmlchars "^2.1.1"

-scheduler@^0.13.2, scheduler@^0.13.3, scheduler@^0.13.6:
+scheduler@^0.13.3, scheduler@^0.13.6:
  version "0.13.6"
  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.13.6.tgz#466a4ec332467b31a91b9bf74e5347072e4cd889"
  integrity sha512-IWnObHt413ucAYKsD9J1QShUKkbKLQQHdxRyw73sw4FN26iWr3DY/H34xGPe4nmL1DwXyWmSWmMrA9TfQbE/XQ==
@ -26937,6 +26889,11 @@ tiny-invariant@^1.0.2, tiny-invariant@^1.0.3, tiny-invariant@^1.0.4:
  resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.0.4.tgz#346b5415fd93cb696b0c4e8a96697ff590f92463"
  integrity sha512-lMhRd/djQJ3MoaHEBrw8e2/uM4rs9YMNk0iOr8rHQ0QdbM7D4l0gFl3szKdeixrlyfm9Zqi4dxHCM2qVG8ND5g==

+tiny-invariant@^1.0.6:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.0.6.tgz#b3f9b38835e36a41c843a3b0907a5a7b3755de73"
+  integrity sha512-FOyLWWVjG+aC0UqG76V53yAWdXfH8bO6FNmyZOuUrzDzK8DI3/JRY25UD7+g49JWM1LXwymsKERB+DzI0dTEQA==
+
 tiny-lr@^1.1.1:
  version "1.1.1"
  resolved "https://registry.yarnpkg.com/tiny-lr/-/tiny-lr-1.1.1.tgz#9fa547412f238fedb068ee295af8b682c98b2aab"
@ -28357,6 +28314,11 @@ url@0.11.0, url@^0.11.0:
    punycode "1.3.2"
    querystring "0.2.0"

+use-memo-one@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/use-memo-one/-/use-memo-one-1.1.1.tgz#39e6f08fe27e422a7d7b234b5f9056af313bd22c"
+  integrity sha512-oFfsyun+bP7RX8X2AskHNTxu+R3QdE/RC5IefMbqptmACAA/gfol1KDD5KRzPsGMa62sWxGZw+Ui43u6x4ddoQ==
+
 use@^2.0.0:
  version "2.0.2"
  resolved "https://registry.yarnpkg.com/use/-/use-2.0.2.tgz#ae28a0d72f93bf22422a18a2e379993112dec8e8"
@ -29520,11 +29482,6 @@ whatwg-fetch@>=0.10.0, whatwg-fetch@^3.0.0:
  resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz#fc804e458cc460009b1a2b966bc8817d2578aefb"
  integrity sha512-9GSJUgz1D4MfyKU7KRqwOjXCXTqWdFNvEr7eUBYchQiVc744mqK/MzXPNR2WsPkmkOa4ywfg8C2n8h+13Bey1Q==

-whatwg-fetch@^0.9.0:
-  version "0.9.0"
-  resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz#0e3684c6cb9995b43efc9df03e4c365d95fd9cc0"
-  integrity sha1-DjaExsuZlbQ+/J3wPkw2XZX9nMA=
-
 whatwg-mimetype@^2.1.0:
  version "2.2.0"
  resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-2.2.0.tgz#a3d58ef10b76009b042d03e25591ece89b88d171"