[triggersActionsUi] Reduce page load bundle to under 100kB

packages/kbn-optimizer/limits.yml

@@ -77,7 +77,7 @@ pageLoadAssetSize:
   tileMap: 65337
   timelion: 29920
   transform: 41007
-  triggersActionsUi: 186732
+  triggersActionsUi: 100000
   uiActions: 97717
   uiActionsEnhanced: 313011
   upgradeAssistant: 81241

x-pack/plugins/cases/public/components/configure_cases/connectors_dropdown.test.tsx

@@ -73,7 +73,14 @@ describe('ConnectorsDropdown', () => {
             >
               <Styled(EuiIcon)
                 size="m"
-                type="test-file-stub"
+                type={
+                  Object {
+                    "$$typeof": Symbol(react.lazy),
+                    "_ctor": [Function],
+                    "_result": null,
+                    "_status": -1,
+                  }
+                }
               />
             </EuiFlexItem>
             <EuiFlexItem>
@@ -96,7 +103,14 @@ describe('ConnectorsDropdown', () => {
             >
               <Styled(EuiIcon)
                 size="m"
-                type="test-file-stub"
+                type={
+                  Object {
+                    "$$typeof": Symbol(react.lazy),
+                    "_ctor": [Function],
+                    "_result": null,
+                    "_status": -1,
+                  }
+                }
               />
             </EuiFlexItem>
             <EuiFlexItem>
@@ -119,7 +133,14 @@ describe('ConnectorsDropdown', () => {
             >
               <Styled(EuiIcon)
                 size="m"
-                type="test-file-stub"
+                type={
+                  Object {
+                    "$$typeof": Symbol(react.lazy),
+                    "_ctor": [Function],
+                    "_result": null,
+                    "_status": -1,
+                  }
+                }
               />
             </EuiFlexItem>
             <EuiFlexItem>
@@ -142,7 +163,14 @@ describe('ConnectorsDropdown', () => {
             >
               <Styled(EuiIcon)
                 size="m"
-                type="test-file-stub"
+                type={
+                  Object {
+                    "$$typeof": Symbol(react.lazy),
+                    "_ctor": [Function],
+                    "_result": null,
+                    "_status": -1,
+                  }
+                }
               />
             </EuiFlexItem>
             <EuiFlexItem>
@@ -182,7 +210,9 @@ describe('ConnectorsDropdown', () => {
       wrappingComponent: TestProviders,
     });
 
-    expect(newWrapper.find('button span:not([data-euiicon-type])').text()).toEqual('My Connector');
+    expect(newWrapper.find('button span:not([data-euiicon-type])').at(1).text()).toBe(
+      'My Connector'
+    );
   });
 
   test('if the props hideConnectorServiceNowSir is true, the connector should not be part of the list of options  ', () => {

x-pack/plugins/cases/public/components/connectors/types.ts

@@ -5,6 +5,7 @@
  * 2.0.
  */
 
+import { IconType } from '@elastic/eui/src/components/icon/icon';
 import React from 'react';
 
 import {
@@ -26,7 +27,7 @@ export interface ThirdPartyField {
 
 export interface ConnectorConfiguration {
   name: string;
-  logo: string;
+  logo: IconType;
 }
 
 export interface CaseConnector<UIProps = unknown> {

x-pack/plugins/translations/translations/ja-JP.json

@@ -23653,19 +23653,6 @@
     "xpack.triggersActionsUI.sections.alertEdit.saveButtonLabel": "保存",
     "xpack.triggersActionsUI.sections.alertEdit.saveErrorNotificationText": "ルールを更新できません",
     "xpack.triggersActionsUI.sections.alertEdit.saveSuccessNotificationText": "'{ruleName}'を更新しました",
-    "xpack.triggersActionsUI.sections.alertForm.accordion.deleteIconAriaLabel": "削除",
-    "xpack.triggersActionsUI.sections.alertForm.actionDisabledTitle": "このアクションは無効です",
-    "xpack.triggersActionsUI.sections.alertForm.actionIdLabel": "{connectorInstance} コネクター",
-    "xpack.triggersActionsUI.sections.alertForm.actionRunWhenInActionGroup": "次のときに実行",
-    "xpack.triggersActionsUI.sections.alertForm.actionSectionsTitle": "アクション",
-    "xpack.triggersActionsUI.sections.alertForm.actionTypeDisabledByConfigMessageTitle": "この機能は Kibana の構成で無効になっています。",
-    "xpack.triggersActionsUI.sections.alertForm.actionTypeDisabledByLicenseLinkTitle": "ライセンスオプションを表示",
-    "xpack.triggersActionsUI.sections.alertForm.actionTypeDisabledByLicenseMessageDescription": "このアクションを再び有効にするには、ライセンスをアップグレードしてください。",
-    "xpack.triggersActionsUI.sections.alertForm.actionTypeDisabledByLicenseMessageTitle": "この機能には {minimumLicenseRequired} ライセンスが必要です。",
-    "xpack.triggersActionsUI.sections.alertForm.addActionButtonLabel": "アクションの追加",
-    "xpack.triggersActionsUI.sections.alertForm.addConnectorButtonLabel": "コネクターを作成する",
-    "xpack.triggersActionsUI.sections.alertForm.addNewActionConnectorActionGroup.display": "{actionGroupName} (現在サポートされていません) ",
-    "xpack.triggersActionsUI.sections.alertForm.addNewConnectorEmptyButton": "コネクターの追加",
     "xpack.triggersActionsUI.sections.alertForm.alertNameLabel": "名前",
     "xpack.triggersActionsUI.sections.alertForm.alertNotifyWhen.label": "毎",
     "xpack.triggersActionsUI.sections.alertForm.alertNotifyWhen.onActionGroupChange.description": "アラートステータスが変更されるときにアクションを実行します。",
@@ -23683,37 +23670,22 @@
     "xpack.triggersActionsUI.sections.alertForm.conditions.addConditionLabel": "追加：",
     "xpack.triggersActionsUI.sections.alertForm.conditions.removeConditionLabel": "削除",
     "xpack.triggersActionsUI.sections.alertForm.conditions.title": "条件：",
-    "xpack.triggersActionsUI.sections.alertForm.connectorAddInline.actionIdLabel": "別の{connectorInstance}コネクターを使用",
-    "xpack.triggersActionsUI.sections.alertForm.connectorAddInline.addNewConnectorEmptyButton": "コネクターの追加",
     "xpack.triggersActionsUI.sections.alertForm.documentationLabel": "ドキュメント",
-    "xpack.triggersActionsUI.sections.alertForm.emptyConnectorsLabel": "{actionTypeName}コネクターがありません",
     "xpack.triggersActionsUI.sections.alertForm.error.noAuthorizedRuleTypes": "ルールを{operation}するには、適切な権限が付与されている必要があります。",
     "xpack.triggersActionsUI.sections.alertForm.error.noAuthorizedRuleTypesTitle": "ルールタイプを{operation}する権限がありません。",
     "xpack.triggersActionsUI.sections.alertForm.error.requiredActionConnector": "{actionTypeId}コネクターのアクションが必要です。",
     "xpack.triggersActionsUI.sections.alertForm.error.requiredIntervalText": "確認間隔が必要です。",
     "xpack.triggersActionsUI.sections.alertForm.error.requiredNameText": "名前が必要です。",
     "xpack.triggersActionsUI.sections.alertForm.error.requiredRuleTypeIdText": "ルールタイプは必須です。",
-    "xpack.triggersActionsUI.sections.alertForm.existingAlertActionTypeEditTitle": "{actionConnectorName}",
-    "xpack.triggersActionsUI.sections.alertForm.loadingConnectorsDescription": "コネクターを読み込んでいます…",
-    "xpack.triggersActionsUI.sections.alertForm.loadingConnectorTypesDescription": "コネクタータイプを読み込んでいます...",
     "xpack.triggersActionsUI.sections.alertForm.loadingRuleTypeParamsDescription": "ルールタイプパラメーターを読み込んでいます…",
     "xpack.triggersActionsUI.sections.alertForm.loadingRuleTypesDescription": "ルールタイプを読み込んでいます…",
-    "xpack.triggersActionsUI.sections.alertForm.newAlertActionTypeEditTitle": "{actionConnectorName}",
-    "xpack.triggersActionsUI.sections.alertForm.preconfiguredTitleMessage": "構成済み",
     "xpack.triggersActionsUI.sections.alertForm.renotifyFieldLabel": "通知",
     "xpack.triggersActionsUI.sections.alertForm.renotifyWithTooltip": "ルールがアクティブな間にアクションを繰り返す頻度を定義します。",
     "xpack.triggersActionsUI.sections.alertForm.ruleTypeSelectLabel": "ルールタイプを選択",
     "xpack.triggersActionsUI.sections.alertForm.searchPlaceholderTitle": "検索",
-    "xpack.triggersActionsUI.sections.alertForm.selectConnectorTypeTitle": "コネクタータイプを選択",
     "xpack.triggersActionsUI.sections.alertForm.solutionFilterLabel": "ユースケースでフィルタリング",
     "xpack.triggersActionsUI.sections.alertForm.tagsFieldLabel": "タグ (任意) ",
-    "xpack.triggersActionsUI.sections.alertForm.unableToAddAction": "デフォルトアクショングループの定義がないのでアクションを追加できません",
-    "xpack.triggersActionsUI.sections.alertForm.unableToLoadActionsMessage": "コネクターを読み込めません",
-    "xpack.triggersActionsUI.sections.alertForm.unableToLoadConnectorTitle": "コネクターを読み込めません。",
-    "xpack.triggersActionsUI.sections.alertForm.unableToLoadConnectorTitle'": "コネクターを読み込めません。",
-    "xpack.triggersActionsUI.sections.alertForm.unableToLoadConnectorTypesMessage": "コネクタータイプを読み込めません",
     "xpack.triggersActionsUI.sections.alertForm.unableToLoadRuleTypesMessage": "ルールタイプを読み込めません",
-    "xpack.triggersActionsUI.sections.alertForm.unauthorizedToCreateForEmptyConnectors": "許可されたユーザーのみがコネクターを構成できます。管理者にお問い合わせください。",
     "xpack.triggersActionsUI.sections.alertsList.actionTypeFilterLabel": "アクションタイプ",
     "xpack.triggersActionsUI.sections.alertsList.addRuleButtonLabel": "ルールを作成",
     "xpack.triggersActionsUI.sections.alertsList.alertErrorReasonDecrypting": "ルールの復号中にエラーが発生しました。",

x-pack/plugins/translations/translations/zh-CN.json

@@ -24018,19 +24018,6 @@
     "xpack.triggersActionsUI.sections.alertEdit.saveButtonLabel": "保存",
     "xpack.triggersActionsUI.sections.alertEdit.saveErrorNotificationText": "无法更新规则。",
     "xpack.triggersActionsUI.sections.alertEdit.saveSuccessNotificationText": "已更新“{ruleName}”",
-    "xpack.triggersActionsUI.sections.alertForm.accordion.deleteIconAriaLabel": "删除",
-    "xpack.triggersActionsUI.sections.alertForm.actionDisabledTitle": "此操作已禁用",
-    "xpack.triggersActionsUI.sections.alertForm.actionIdLabel": "{connectorInstance} 连接器",
-    "xpack.triggersActionsUI.sections.alertForm.actionRunWhenInActionGroup": "运行条件",
-    "xpack.triggersActionsUI.sections.alertForm.actionSectionsTitle": "操作",
-    "xpack.triggersActionsUI.sections.alertForm.actionTypeDisabledByConfigMessageTitle": "此功能已由 Kibana 配置禁用。",
-    "xpack.triggersActionsUI.sections.alertForm.actionTypeDisabledByLicenseLinkTitle": "查看许可证选项",
-    "xpack.triggersActionsUI.sections.alertForm.actionTypeDisabledByLicenseMessageDescription": "要重新启用此操作，请升级您的许可证。",
-    "xpack.triggersActionsUI.sections.alertForm.actionTypeDisabledByLicenseMessageTitle": "此功能需要{minimumLicenseRequired}许可证。",
-    "xpack.triggersActionsUI.sections.alertForm.addActionButtonLabel": "添加操作",
-    "xpack.triggersActionsUI.sections.alertForm.addConnectorButtonLabel": "创建连接器",
-    "xpack.triggersActionsUI.sections.alertForm.addNewActionConnectorActionGroup.display": "{actionGroupName} (当前不支持) ",
-    "xpack.triggersActionsUI.sections.alertForm.addNewConnectorEmptyButton": "添加连接器",
     "xpack.triggersActionsUI.sections.alertForm.alertNameLabel": "名称",
     "xpack.triggersActionsUI.sections.alertForm.alertNotifyWhen.label": "每",
     "xpack.triggersActionsUI.sections.alertForm.alertNotifyWhen.onActionGroupChange.description": "操作在告警状态更改时运行。",
@@ -24048,37 +24035,22 @@
     "xpack.triggersActionsUI.sections.alertForm.conditions.addConditionLabel": "添加：",
     "xpack.triggersActionsUI.sections.alertForm.conditions.removeConditionLabel": "移除",
     "xpack.triggersActionsUI.sections.alertForm.conditions.title": "条件：",
-    "xpack.triggersActionsUI.sections.alertForm.connectorAddInline.actionIdLabel": "使用其他 {connectorInstance} 连接器",
-    "xpack.triggersActionsUI.sections.alertForm.connectorAddInline.addNewConnectorEmptyButton": "添加连接器",
     "xpack.triggersActionsUI.sections.alertForm.documentationLabel": "文档",
-    "xpack.triggersActionsUI.sections.alertForm.emptyConnectorsLabel": "无 {actionTypeName} 连接器",
     "xpack.triggersActionsUI.sections.alertForm.error.noAuthorizedRuleTypes": "为了{operation}规则，您需要获得相应的权限。",
     "xpack.triggersActionsUI.sections.alertForm.error.noAuthorizedRuleTypesTitle": "您尚无权{operation}任何规则类型",
     "xpack.triggersActionsUI.sections.alertForm.error.requiredActionConnector": "“{actionTypeId} 连接器的操作”必填。",
     "xpack.triggersActionsUI.sections.alertForm.error.requiredIntervalText": "“检查时间间隔”必填。",
     "xpack.triggersActionsUI.sections.alertForm.error.requiredNameText": "“名称”必填。",
     "xpack.triggersActionsUI.sections.alertForm.error.requiredRuleTypeIdText": "“规则类型”必填。",
-    "xpack.triggersActionsUI.sections.alertForm.existingAlertActionTypeEditTitle": "{actionConnectorName}",
-    "xpack.triggersActionsUI.sections.alertForm.loadingConnectorsDescription": "正在加载连接器……",
-    "xpack.triggersActionsUI.sections.alertForm.loadingConnectorTypesDescription": "正在加载连接器类型……",
     "xpack.triggersActionsUI.sections.alertForm.loadingRuleTypeParamsDescription": "正在加载规则类型参数……",
     "xpack.triggersActionsUI.sections.alertForm.loadingRuleTypesDescription": "正在加载规则类型……",
-    "xpack.triggersActionsUI.sections.alertForm.newAlertActionTypeEditTitle": "{actionConnectorName}",
-    "xpack.triggersActionsUI.sections.alertForm.preconfiguredTitleMessage": "预配置",
     "xpack.triggersActionsUI.sections.alertForm.renotifyFieldLabel": "通知",
     "xpack.triggersActionsUI.sections.alertForm.renotifyWithTooltip": "定义规则处于活动状态时重复操作的频率。",
     "xpack.triggersActionsUI.sections.alertForm.ruleTypeSelectLabel": "选择规则类型",
     "xpack.triggersActionsUI.sections.alertForm.searchPlaceholderTitle": "搜索",
-    "xpack.triggersActionsUI.sections.alertForm.selectConnectorTypeTitle": "选择连接器类型",
     "xpack.triggersActionsUI.sections.alertForm.solutionFilterLabel": "按用例筛选",
     "xpack.triggersActionsUI.sections.alertForm.tagsFieldLabel": "标签 (可选) ",
-    "xpack.triggersActionsUI.sections.alertForm.unableToAddAction": "无法添加操作，因为未定义默认操作组",
-    "xpack.triggersActionsUI.sections.alertForm.unableToLoadActionsMessage": "无法加载连接器",
-    "xpack.triggersActionsUI.sections.alertForm.unableToLoadConnectorTitle": "无法加载连接器。",
-    "xpack.triggersActionsUI.sections.alertForm.unableToLoadConnectorTitle'": "无法加载连接器。",
-    "xpack.triggersActionsUI.sections.alertForm.unableToLoadConnectorTypesMessage": "无法加载连接器类型",
     "xpack.triggersActionsUI.sections.alertForm.unableToLoadRuleTypesMessage": "无法加载规则类型",
-    "xpack.triggersActionsUI.sections.alertForm.unauthorizedToCreateForEmptyConnectors": "只有获得授权的用户才能配置连接器。请联系您的管理员。",
     "xpack.triggersActionsUI.sections.alertsList.actionTypeFilterLabel": "操作类型",
     "xpack.triggersActionsUI.sections.alertsList.addRuleButtonLabel": "创建规则",
     "xpack.triggersActionsUI.sections.alertsList.alertErrorReasonDecrypting": "解密规则时发生错误。",

x-pack/plugins/triggers_actions_ui/README.md

@@ -206,13 +206,13 @@ export const IndexThresholdAlertTypeExpression: React.FunctionComponent<IndexThr
   ....
 
   return (
-    <Fragment>
+    <>
       {hasExpressionErrors ? (
-        <Fragment>
+        <>
           <EuiSpacer />
           <EuiCallOut color="danger" size="s" title={expressionErrorMessage} />
           <EuiSpacer />
-        </Fragment>
+        </>
       ) : null}
       <EuiSpacer size="l" />
       <EuiFormLabel>
@@ -221,7 +221,7 @@ export const IndexThresholdAlertTypeExpression: React.FunctionComponent<IndexThr
           id="xpack.stackAlerts.threshold.ui.selectIndex"
         />
   ....
-      </Fragment>
+      </>
   );
 };
 
@@ -322,7 +322,7 @@ Fields of this object `AlertTypeModel` will be mapped properly in the UI below.
 
 2. Define `alertParamsExpression` as `React.FunctionComponent` - this is the form for filling Alert params based on the current Alert type.
 ```
-import React, { Fragment, useState } from 'react';
+import React, { useState } from 'react';
 import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
 import { WhenExpression, OfExpression } from '../../../../common/expression_items';
 import { builtInAggregationTypes } from '../../../../common/constants';
@@ -340,7 +340,7 @@ export const ExampleExpression: React.FunctionComponent<ExampleProps> = ({
 }) => {
   const [aggType, setAggType] = useState<string>('count');
   return (
-    <Fragment>
+    <>
       <EuiFlexGroup gutterSize="s" wrap>
         <EuiFlexItem grow={false}>
           <WhenExpression
@@ -365,7 +365,7 @@ export const ExampleExpression: React.FunctionComponent<ExampleProps> = ({
           </EuiFlexItem>
         ) : null}
       </EuiFlexGroup>
-    </Fragment>
+    </>
   );
 };
 
@@ -653,7 +653,7 @@ const ThresholdSpecifier = (
 }) => {
   if (!actionGroup) {
     // render empty if no condition action group is specified
-    return <Fragment />;
+    return null;
   }
 
   return (
@@ -1157,7 +1157,7 @@ Below is a list of steps that should be done to build and register a new action
 
 1. At any suitable place in Kibana, create a file, which will expose an object implementing interface [ActionTypeModel]:
 ```
-import React, { Fragment, lazy } from 'react';
+import React, { lazy } from 'react';
 import { i18n } from '@kbn/i18n';
 import {
   ActionTypeModel,
@@ -1230,7 +1230,7 @@ export function getActionType(): ActionTypeModel {
 
 2. Define `actionConnectorFields` as `React.FunctionComponent` - this is the form for action connector.
 ```
-import React, { Fragment } from 'react';
+import React from 'react';
 import { i18n } from '@kbn/i18n';
 import { EuiFieldText } from '@elastic/eui';
 import { EuiTextArea } from '@elastic/eui';
@@ -1252,7 +1252,7 @@ const ExampleConnectorFields: React.FunctionComponent<ActionConnectorFieldsProps
 >> = ({ action, editActionConfig, errors }) => {
   const { someConnectorField } = action.config;
   return (
-    <Fragment>
+    <>
       <EuiFieldText
         fullWidth
         isInvalid={errors.someConnectorField.length > 0 && someConnectorField !== undefined}
@@ -1267,7 +1267,7 @@ const ExampleConnectorFields: React.FunctionComponent<ActionConnectorFieldsProps
           }
         }}
       />
-    </Fragment>
+    </>
   );
 };
 
@@ -1277,7 +1277,7 @@ export {ExampleConnectorFields as default};
 
 3. Define action type params fields using the property of `ActionTypeModel` `actionParamsFields`: 
 ```
-import React, { Fragment } from 'react';
+import React from 'react';
 import { i18n } from '@kbn/i18n';
 import { EuiFieldText } from '@elastic/eui';
 import { EuiTextArea } from '@elastic/eui';
@@ -1300,7 +1300,7 @@ const ExampleParamsFields: React.FunctionComponent<ActionParamsProps<ExampleActi
 }) => {
   const { message } = actionParams;
   return (
-    <Fragment>
+    <>
       <EuiTextArea
         fullWidth
         isInvalid={errors.message.length > 0 && message !== undefined}
@@ -1315,7 +1315,7 @@ const ExampleParamsFields: React.FunctionComponent<ActionParamsProps<ExampleActi
           }
         }}
       />
-    </Fragment>
+    </>
   );
 };