[triggersActionsUi] Reduce page load bundle to under 100kB (#97770)

* [triggersActionsUi] Reduce page load bundle to under 100kB * removed old code * removed fragment * changed svg logo to lazy react components * fixed type checks and translations * fixed type checks * fixed type checks * fixed type checks * fixed tests * fixed tests * fixed iconClass * fixed due to comments * added info about new IconType to readme file * fixed key errors
elastic · May 26, 2021 · 5ebded2 · 5ebded2
1 parent a591af2
commit 5ebded2
Show file tree

Hide file tree

Showing 73 changed files with 696 additions and 593 deletions.
diff --git a/packages/kbn-optimizer/limits.yml b/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

diff --git a/x-pack/plugins/cases/public/components/configure_cases/connectors_dropdown.test.tsx b/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  ', () => {

diff --git a/x-pack/plugins/cases/public/components/connectors/types.ts b/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> {

diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json
@@ -23651,19 +23651,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": "アラートステータスが変更されるときにアクションを実行します。",
@@ -23681,37 +23668,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": "ルールの復号中にエラーが発生しました。",

diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json
@@ -24016,19 +24016,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": "操作在告警状态更改时运行。",
@@ -24046,37 +24033,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": "解密规则时发生错误。",