Merge branch 'master' into fix-enrollment-api-key-selection

elastic · Jul 28, 2020 · cb64611 · cb64611
2 parents bc77d1e + f61df05
commit cb64611
Show file tree

Hide file tree

Showing 4 changed files with 59 additions and 44 deletions.
diff --git a/src/plugins/dashboard/public/application/dashboard_app_controller.tsx b/src/plugins/dashboard/public/application/dashboard_app_controller.tsx
@@ -172,6 +172,10 @@ export class DashboardAppController {
       chrome.docTitle.change(dash.title);
     }
 
+    const incomingEmbeddable = embeddable
+      .getStateTransfer(scopedHistory())
+      .getIncomingEmbeddablePackage();
+
     const dashboardStateManager = new DashboardStateManager({
       savedDashboard: dash,
       hideWriteControls: dashboardConfig.getHideWriteControls(),
@@ -444,21 +448,24 @@ export class DashboardAppController {
               refreshDashboardContainer();
             });
 
-            const incomingState = embeddable
-              .getStateTransfer(scopedHistory())
-              .getIncomingEmbeddablePackage();
-            if (incomingState) {
-              if ('id' in incomingState) {
-                container.addOrUpdateEmbeddable<SavedObjectEmbeddableInput>(incomingState.type, {
-                  savedObjectId: incomingState.id,
-                });
-              } else if ('input' in incomingState) {
-                const input = incomingState.input;
+            if (incomingEmbeddable) {
+              if ('id' in incomingEmbeddable) {
+                container.addOrUpdateEmbeddable<SavedObjectEmbeddableInput>(
+                  incomingEmbeddable.type,
+                  {
+                    savedObjectId: incomingEmbeddable.id,
+                  }
+                );
+              } else if ('input' in incomingEmbeddable) {
+                const input = incomingEmbeddable.input;
                 delete input.id;
                 const explicitInput = {
                   savedVis: input,
                 };
-                container.addOrUpdateEmbeddable<EmbeddableInput>(incomingState.type, explicitInput);
+                container.addOrUpdateEmbeddable<EmbeddableInput>(
+                  incomingEmbeddable.type,
+                  explicitInput
+                );
               }
             }
           }

diff --git a/...ctions/agent_config/create_package_config_page/components/package_config_input_config.tsx b/...ctions/agent_config/create_package_config_page/components/package_config_input_config.tsx
@@ -4,6 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 import React, { useState, Fragment, memo, useMemo } from 'react';
+import styled from 'styled-components';
 import { FormattedMessage } from '@kbn/i18n/react';
 import {
   EuiFlexGrid,
@@ -21,6 +22,10 @@ import {
 } from '../services';
 import { PackageConfigInputVarField } from './package_config_input_var_field';
 
+const FlexItemWithMaxWidth = styled(EuiFlexItem)`
+  max-width: calc(50% - ${(props) => props.theme.eui.euiSizeL});
+`;
+
 export const PackageConfigInputConfig: React.FunctionComponent<{
   packageInputVars?: RegistryVarsEntry[];
   packageConfigInput: PackageConfigInput;
@@ -88,7 +93,7 @@ export const PackageConfigInputConfig: React.FunctionComponent<{
             </EuiFlexItem>
           </EuiFlexGroup>
         </EuiFlexItem>
-        <EuiFlexItem>
+        <FlexItemWithMaxWidth>
           <EuiFlexGroup direction="column" gutterSize="m">
             {requiredVars.map((varDef) => {
               const { name: varName, type: varType } = varDef;
@@ -176,7 +181,7 @@ export const PackageConfigInputConfig: React.FunctionComponent<{
               </Fragment>
             ) : null}
           </EuiFlexGroup>
-        </EuiFlexItem>
+        </FlexItemWithMaxWidth>
       </EuiFlexGrid>
     );
   }

diff --git a/...gins/security_solution/public/timelines/components/timeline/search_super_select/index.tsx b/...gins/security_solution/public/timelines/components/timeline/search_super_select/index.tsx
@@ -4,19 +4,41 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { EuiInputPopover, EuiSelectableOption, EuiSuperSelect } from '@elastic/eui';
+import { EuiInputPopover, EuiSelectableOption, EuiFieldText } from '@elastic/eui';
 import React, { memo, useCallback, useMemo, useState } from 'react';
-import { createGlobalStyle } from 'styled-components';
+import styled from 'styled-components';
 
 import { OpenTimelineResult } from '../../open_timeline/types';
 import { SelectableTimeline } from '../selectable_timeline';
 import * as i18n from '../translations';
 import { TimelineType, TimelineTypeLiteral } from '../../../../../common/types/timeline';
 
-const SearchTimelineSuperSelectGlobalStyle = createGlobalStyle`
-  .euiPopover__panel.euiPopover__panel-isOpen.timeline-search-super-select-popover__popoverPanel {
-    visibility: hidden;
-    z-index: 0;
+const StyledEuiFieldText = styled(EuiFieldText)`
+  padding-left: 12px;
+  padding-right: 40px;
+
+  &[readonly] {
+    cursor: pointer;
+    background-size: 0 100%;
+    background-repeat: no-repeat;
+
+    // To match EuiFieldText focus state
+    &:focus {
+      background-color: #fff;
+      background-image: linear-gradient(
+        to top,
+        #006bb4,
+        #006bb4 2px,
+        transparent 2px,
+        transparent 100%
+      );
+      background-size: 100% 100%;
+    }
+  }
+
+  & + .euiFormControlLayoutIcons {
+    left: unset;
+    right: 12px;
   }
 `;
 
@@ -29,13 +51,6 @@ interface SearchTimelineSuperSelectProps {
   onTimelineChange: (timelineTitle: string, timelineId: string | null) => void;
 }
 
-const basicSuperSelectOptions = [
-  {
-    value: '-1',
-    inputDisplay: i18n.DEFAULT_TIMELINE_TITLE,
-  },
-];
-
 const getBasicSelectableOptions = (timelineId: string) => [
   {
     description: i18n.DEFAULT_TIMELINE_DESCRIPTION,
@@ -67,26 +82,15 @@ const SearchTimelineSuperSelectComponent: React.FC<SearchTimelineSuperSelectProp
 
   const superSelect = useMemo(
     () => (
-      <EuiSuperSelect
+      <StyledEuiFieldText
+        readOnly
         disabled={isDisabled}
         onFocus={handleOpenPopover}
-        options={
-          timelineId == null
-            ? basicSuperSelectOptions
-            : [
-                {
-                  value: timelineId,
-                  inputDisplay: timelineTitle,
-                },
-              ]
-        }
-        valueOfSelected={timelineId == null ? '-1' : timelineId}
-        itemLayoutAlign="top"
-        hasDividers={false}
-        popoverClassName="timeline-search-super-select-popover"
+        value={timelineTitle ?? i18n.DEFAULT_TIMELINE_TITLE}
+        icon="arrowDown"
       />
     ),
-    [handleOpenPopover, isDisabled, timelineId, timelineTitle]
+    [handleOpenPopover, isDisabled, timelineTitle]
   );
 
   const handleGetSelectableOptions = useCallback(
@@ -126,7 +130,6 @@ const SearchTimelineSuperSelectComponent: React.FC<SearchTimelineSuperSelectProp
         onTimelineChange={onTimelineChange}
         timelineType={timelineType}
       />
-      <SearchTimelineSuperSelectGlobalStyle />
     </EuiInputPopover>
   );
 };

diff --git a/...gins/security_solution/public/timelines/components/timeline/selectable_timeline/index.tsx b/...gins/security_solution/public/timelines/components/timeline/selectable_timeline/index.tsx
@@ -165,7 +165,7 @@ const SelectableTimelineComponent: React.FC<SelectableTimelineProps> = ({
         responsive={false}
       >
         <EuiFlexItem grow={false}>
-          <EuiIcon type={`${option.checked === 'on' ? 'check' : 'none'}`} color="primary" />
+          <EuiIcon type={`${option.checked === 'on' ? 'check' : 'empty'}`} color="primary" />
         </EuiFlexItem>
         <EuiFlexItem grow={true}>
           <EuiFlexGroup gutterSize="none" direction="column">