Merge branch 'main' into adding-expanded-rows-to-pattern-analysis-table

elastic · Jan 24, 2024 · 5ab5061 · 5ab5061
2 parents 6ba4df2 + 0dd0664
commit 5ab5061
Show file tree

Hide file tree

Showing 40 changed files with 841 additions and 161 deletions.
diff --git a/packages/kbn-optimizer/limits.yml b/packages/kbn-optimizer/limits.yml
@@ -32,7 +32,7 @@ pageLoadAssetSize:
   datasetQuality: 50624
   dataViewEditor: 28082
   dataViewFieldEditor: 27000
-  dataViewManagement: 5136
+  dataViewManagement: 5176
   dataViews: 51000
   dataVisualizer: 27530
   devTools: 38637

diff --git a/packages/shared-ux/page/solution_nav/src/_variables.scss b/packages/shared-ux/page/solution_nav/src/_variables.scss
@@ -0,0 +1,4 @@
+// This size is also tracked with a variable in solution_nav.tsx, if updated
+// update there as well
+$solutionNavWidth: 248px;
+$solutionNavCollapsedWidth: $euiSizeXXL;
diff --git a/packages/shared-ux/page/solution_nav/src/collapse_button.scss b/packages/shared-ux/page/solution_nav/src/collapse_button.scss
@@ -1,7 +1,9 @@
+@import 'variables';
+
 .kbnSolutionNavCollapseButton {
   position: absolute;
   opacity: 0;
-  left: 248px - $euiSize;
+  left: $solutionNavWidth - $euiSize;
   top: $euiSizeL;
   z-index: 2;
 
@@ -18,7 +20,7 @@
   &:hover,
   &:focus {
     opacity: 1;
-    left: 248px - $euiSizeL;
+    left: $solutionNavWidth - $euiSizeL;
   }
 
   .kbnSolutionNav__sidebar:hover & {
@@ -39,7 +41,7 @@
   top: 0;
   bottom: 0;
   height: 100%;
-  width: $euiSizeXXL;
+  width: $solutionNavCollapsedWidth;
   border-radius: 0;
   // Keep the icon at the top instead of it getting shifted to the center of the page
   padding-top: $euiSizeL + $euiSizeS;

diff --git a/packages/shared-ux/page/solution_nav/src/solution_nav.scss b/packages/shared-ux/page/solution_nav/src/solution_nav.scss
@@ -1,5 +1,6 @@
 $euiSideNavEmphasizedBackgroundColor: transparentize($euiColorLightShade, .7);
 @import '@elastic/eui/src/components/side_nav/mixins';
+@import 'variables';
 
 // Put the page background color in the flyout version too
 .kbnSolutionNav__flyout {
@@ -14,7 +15,7 @@ $euiSideNavEmphasizedBackgroundColor: transparentize($euiColorLightShade, .7);
   flex-direction: column;
 
   @include euiBreakpoint('m', 'l', 'xl') {
-    width: 248px;
+    width: $solutionNavWidth;
     padding: $euiSizeL;
   }
 

diff --git a/packages/shared-ux/page/solution_nav/src/solution_nav.tsx b/packages/shared-ux/page/solution_nav/src/solution_nav.tsx
@@ -7,7 +7,7 @@
  */
 import './solution_nav.scss';
 
-import React, { FC, useState, useMemo } from 'react';
+import React, { FC, useState, useMemo, useEffect } from 'react';
 import classNames from 'classnames';
 import {
   EuiAvatarProps,
@@ -23,6 +23,8 @@ import {
   htmlIdGenerator,
   useIsWithinBreakpoints,
   useIsWithinMinBreakpoint,
+  useEuiTheme,
+  useEuiThemeCSSVariables,
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
 import { i18n } from '@kbn/i18n';
@@ -71,6 +73,7 @@ export type SolutionNavProps = Omit<EuiSideNavProps<{}>, 'children' | 'items' |
 };
 
 const FLYOUT_SIZE = 248;
+const FLYOUT_SIZE_CSS = `${FLYOUT_SIZE}px`;
 
 const setTabIndex = (items: Array<EuiSideNavItemType<{}>>, isHidden: boolean) => {
   return items.map((item) => {
@@ -174,6 +177,32 @@ export const SolutionNav: FC<SolutionNavProps> = ({
     );
   }, [children, headingID, isCustomSideNav, isHidden, items, rest]);
 
+  const { euiTheme } = useEuiTheme();
+  const navWidth = useMemo(() => {
+    if (isLargerBreakpoint) {
+      return isOpenOnDesktop ? FLYOUT_SIZE_CSS : euiTheme.size.xxl;
+    }
+    if (isMediumBreakpoint) {
+      return isSideNavOpenOnMobile || !canBeCollapsed ? FLYOUT_SIZE_CSS : euiTheme.size.xxl;
+    }
+    return '0';
+  }, [
+    euiTheme,
+    isOpenOnDesktop,
+    isSideNavOpenOnMobile,
+    canBeCollapsed,
+    isMediumBreakpoint,
+    isLargerBreakpoint,
+  ]);
+  const { setGlobalCSSVariables } = useEuiThemeCSSVariables();
+  // Setting a global CSS variable with the nav width
+  // so that other pages have it available when needed.
+  useEffect(() => {
+    setGlobalCSSVariables({
+      '--kbnSolutionNavOffset': navWidth,
+    });
+  }, [navWidth, setGlobalCSSVariables]);
+
   return (
     <>
       {isSmallerBreakpoint && (

diff --git a/src/plugins/console/public/application/containers/embeddable/_embeddable_console.scss b/src/plugins/console/public/application/containers/embeddable/_embeddable_console.scss
@@ -8,7 +8,6 @@
   box-shadow: inset 0 $embeddableConsoleInitialHeight 0 $embeddableConsoleBackground, inset 0 600rem 0 $euiPageBackgroundColor;
   bottom: 0;
   right: 0;
-  left: var(--euiCollapsibleNavOffset, 0);
   transform: translateY(0);
   height: $embeddableConsoleInitialHeight;
   max-height: $embeddableConsoleMaxHeight;
@@ -18,6 +17,18 @@
     z-index: $euiZLevel1;
   }
 
+  &--projectChrome {
+    left: var(--euiCollapsibleNavOffset, 0);
+  }
+
+  &--classicChrome {
+    left: var(--kbnSolutionNavOffset, 0);
+  }
+
+  &--unknownChrome {
+    left: 0;
+  }
+
   &-isOpen {
     animation-duration: $euiAnimSpeedNormal;
     animation-timing-function: $euiAnimSlightResistance;

diff --git a/src/plugins/console/public/application/containers/embeddable/embeddable_console.tsx b/src/plugins/console/public/application/containers/embeddable/embeddable_console.tsx
@@ -8,6 +8,7 @@
 
 import React, { useState } from 'react';
 import classNames from 'classnames';
+import useObservable from 'react-use/lib/useObservable';
 import {
   EuiButton,
   EuiFocusTrap,
@@ -38,6 +39,7 @@ export const EmbeddableConsole = ({
 }: EmbeddableConsoleProps & EmbeddableConsoleDependencies) => {
   const [isConsoleOpen, setIsConsoleOpen] = useState<boolean>(false);
   const toggleConsole = () => setIsConsoleOpen(!isConsoleOpen);
+  const chromeStyle = useObservable(core.chrome.getChromeStyle$());
 
   const onKeyDown = (event: any) => {
     if (event.key === keys.ESCAPE) {
@@ -52,6 +54,9 @@ export const EmbeddableConsole = ({
     'embeddableConsole--large': size === 'l',
     'embeddableConsole--medium': size === 'm',
     'embeddableConsole--small': size === 's',
+    'embeddableConsole--classicChrome': chromeStyle === 'classic',
+    'embeddableConsole--projectChrome': chromeStyle === 'project',
+    'embeddableConsole--unknownChrome': chromeStyle === undefined,
     'embeddableConsole--fixed': true,
     'embeddableConsole--showOnMobile': false,
   });

diff --git a/src/plugins/console/public/plugin.ts b/src/plugins/console/public/plugin.ts
@@ -105,7 +105,8 @@ export class ConsoleUIPlugin implements Plugin<void, void, AppSetupUIPluginDepen
     const {
       ui: { enabled: isConsoleUiEnabled },
     } = this.ctx.config.get<ClientConfigType>();
-    if (isConsoleUiEnabled) {
+
+    if (isConsoleUiEnabled && core.application.capabilities?.dev_tools?.show === true) {
       return {
         renderEmbeddableConsole: (props: EmbeddableConsoleProps) => {
           const consoleDeps: EmbeddableConsoleDependencies = {

diff --git a/x-pack/plugins/cloud_security_posture/common/types/index.ts b/x-pack/plugins/cloud_security_posture/common/types/index.ts
@@ -9,6 +9,7 @@ export * as rulesV1 from './rules/v1';
 export * as rulesV2 from './rules/v2';
 export * as rulesV3 from './rules/v3';
 export * as rulesV4 from './rules/v4';
+export * as rulesV5 from './rules/v5';
 
 export * as benchmarkV1 from './benchmarks/v1';
 export * as benchmarkV2 from './benchmarks/v2';

diff --git a/x-pack/plugins/cloud_security_posture/common/types/latest.ts b/x-pack/plugins/cloud_security_posture/common/types/latest.ts
@@ -5,5 +5,5 @@
  * 2.0.
  */
 
-export * from './rules/v4';
+export * from './rules/v5';
 export * from './benchmarks/v2';
diff --git a/x-pack/plugins/cloud_security_posture/common/types/rules/v1.ts b/x-pack/plugins/cloud_security_posture/common/types/rules/v1.ts
@@ -7,6 +7,9 @@
 import { schema, TypeOf } from '@kbn/config-schema';
 
 // Since version 8.3.0
+
+export type CspBenchmarkRule = TypeOf<typeof cspBenchmarkRuleSchema>;
+
 export const cspBenchmarkRuleSchema = schema.object({
   audit: schema.string(),
   benchmark: schema.object({ name: schema.string(), version: schema.string() }),
@@ -26,5 +29,3 @@ export const cspBenchmarkRuleSchema = schema.object({
   tags: schema.arrayOf(schema.string()),
   version: schema.string(),
 });
-
-export type CspBenchmarkRule = TypeOf<typeof cspBenchmarkRuleSchema>;
diff --git a/x-pack/plugins/cloud_security_posture/common/types/rules/v2.ts b/x-pack/plugins/cloud_security_posture/common/types/rules/v2.ts
@@ -7,6 +7,9 @@
 import { schema, TypeOf } from '@kbn/config-schema';
 
 // Since version 8.4.0
+
+export type CspBenchmarkRule = TypeOf<typeof cspBenchmarkRuleSchema>;
+
 export const cspBenchmarkRuleMetadataSchema = schema.object({
   audit: schema.string(),
   benchmark: schema.object({
@@ -34,5 +37,3 @@ export const cspBenchmarkRuleSchema = schema.object({
   metadata: cspBenchmarkRuleMetadataSchema,
   muted: schema.boolean(),
 });
-
-export type CspBenchmarkRule = TypeOf<typeof cspBenchmarkRuleSchema>;
diff --git a/x-pack/plugins/cloud_security_posture/common/types/rules/v3.ts b/x-pack/plugins/cloud_security_posture/common/types/rules/v3.ts
@@ -8,9 +8,18 @@
 import { schema, TypeOf } from '@kbn/config-schema';
 import { CSPM_POLICY_TEMPLATE, KSPM_POLICY_TEMPLATE } from '../../constants';
 
-const DEFAULT_BENCHMARK_RULES_PER_PAGE = 25;
+export const DEFAULT_BENCHMARK_RULES_PER_PAGE = 25;
 
 // Since version 8.7.0
+
+export type FindCspBenchmarkRuleRequest = TypeOf<typeof findCspBenchmarkRuleRequestSchema>;
+
+export type CspBenchmarkRuleMetadata = TypeOf<typeof cspBenchmarkRuleMetadataSchema>;
+
+export type CspBenchmarkRule = TypeOf<typeof cspBenchmarkRuleSchema>;
+
+export type PageUrlParams = Record<'policyId' | 'packagePolicyId', string>;
+
 export const cspBenchmarkRuleMetadataSchema = schema.object({
   audit: schema.string(),
   benchmark: schema.object({
@@ -37,14 +46,10 @@ export const cspBenchmarkRuleMetadataSchema = schema.object({
   version: schema.string(),
 });
 
-export type CspBenchmarkRuleMetadata = TypeOf<typeof cspBenchmarkRuleMetadataSchema>;
-
 export const cspBenchmarkRuleSchema = schema.object({
   metadata: cspBenchmarkRuleMetadataSchema,
 });
 
-export type CspBenchmarkRule = TypeOf<typeof cspBenchmarkRuleSchema>;
-
 export const findCspBenchmarkRuleRequestSchema = schema.object({
   /**
    * An Elasticsearch simple_query_string
@@ -125,13 +130,9 @@ export const findCspBenchmarkRuleRequestSchema = schema.object({
   section: schema.maybe(schema.string()),
 });
 
-export type FindCspBenchmarkRuleRequest = TypeOf<typeof findCspBenchmarkRuleRequestSchema>;
-
 export interface FindCspBenchmarkRuleResponse {
   items: CspBenchmarkRule[];
   total: number;
   page: number;
   perPage: number;
 }
-
-export type PageUrlParams = Record<'policyId' | 'packagePolicyId', string>;
diff --git a/x-pack/plugins/cloud_security_posture/common/types/rules/v4.ts b/x-pack/plugins/cloud_security_posture/common/types/rules/v4.ts
@@ -7,6 +7,7 @@
 
 import { schema, TypeOf } from '@kbn/config-schema';
 import { BenchmarksCisId } from '../latest';
+import { DEFAULT_BENCHMARK_RULES_PER_PAGE } from './v3';
 export type {
   cspBenchmarkRuleMetadataSchema,
   CspBenchmarkRuleMetadata,
@@ -15,7 +16,19 @@ export type {
   FindCspBenchmarkRuleResponse,
 } from './v3';
 
-const DEFAULT_BENCHMARK_RULES_PER_PAGE = 25;
+export type FindCspBenchmarkRuleRequest = TypeOf<typeof findCspBenchmarkRuleRequestSchema>;
+
+export type RulesToUpdate = TypeOf<typeof rulesToUpdate>;
+
+export type CspBenchmarkRulesBulkActionRequestSchema = TypeOf<
+  typeof cspBenchmarkRulesBulkActionRequestSchema
+>;
+
+export type RuleStateAttributes = TypeOf<typeof ruleStateAttributes>;
+
+export type CspBenchmarkRulesStates = TypeOf<typeof rulesStates>;
+
+export type CspSettings = TypeOf<typeof cspSettingsSchema>;
 
 export const findCspBenchmarkRuleRequestSchema = schema.object({
   /**
@@ -99,8 +112,6 @@ export const findCspBenchmarkRuleRequestSchema = schema.object({
   ruleNumber: schema.maybe(schema.string()),
 });
 
-export type FindCspBenchmarkRuleRequest = TypeOf<typeof findCspBenchmarkRuleRequestSchema>;
-
 export interface BenchmarkRuleSelectParams {
   section?: string;
   ruleNumber?: string;
@@ -125,12 +136,6 @@ export const cspBenchmarkRulesBulkActionRequestSchema = schema.object({
   rules: rulesToUpdate,
 });
 
-export type RulesToUpdate = TypeOf<typeof rulesToUpdate>;
-
-export type CspBenchmarkRulesBulkActionRequestSchema = TypeOf<
-  typeof cspBenchmarkRulesBulkActionRequestSchema
->;
-
 export interface CspBenchmarkRulesBulkActionResponse {
   updated_benchmark_rules: CspBenchmarkRulesStates;
   disabled_detection_rules?: string[];
@@ -145,18 +150,12 @@ const ruleStateAttributes = schema.object({
   rule_id: schema.string(),
 });
 
-export type RuleStateAttributes = TypeOf<typeof ruleStateAttributes>;
-
 const rulesStates = schema.recordOf(schema.string(), ruleStateAttributes);
 
-export type CspBenchmarkRulesStates = TypeOf<typeof rulesStates>;
-
 export const cspSettingsSchema = schema.object({
   rules: rulesStates,
 });
 
-export type CspSettings = TypeOf<typeof cspSettingsSchema>;
-
 export interface BulkActionBenchmarkRulesResponse {
   updatedBenchmarkRulesStates: CspBenchmarkRulesStates;
   disabledDetectionRules: string[];