From 2456a1a63df6757d77d6dfedf7fa198cc98f564a Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Tue, 20 Apr 2021 17:44:18 -0700 Subject: [PATCH 01/14] [triggersActionsUi] Reduce page load bundle to under 100kB --- packages/kbn-optimizer/limits.yml | 2 +- .../public/application/home.tsx | 19 ++++++++++++++----- .../components/actions_connectors_list.tsx | 5 ++++- .../alerts_list/components/alerts_list.tsx | 5 ++++- 4 files changed, 23 insertions(+), 8 deletions(-) diff --git a/packages/kbn-optimizer/limits.yml b/packages/kbn-optimizer/limits.yml index 1d193874941368..a68c86c3c22cb2 100644 --- a/packages/kbn-optimizer/limits.yml +++ b/packages/kbn-optimizer/limits.yml @@ -78,7 +78,7 @@ pageLoadAssetSize: tileMap: 65337 timelion: 29920 transform: 41007 - triggersActionsUi: 186732 + triggersActionsUi: 100000 uiActions: 97717 uiActionsEnhanced: 313011 upgradeAssistant: 81241 diff --git a/x-pack/plugins/triggers_actions_ui/public/application/home.tsx b/x-pack/plugins/triggers_actions_ui/public/application/home.tsx index b77593c9905509..9f2fcc6320af30 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/home.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/home.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useEffect } from 'react'; +import React, { lazy, Suspense, useEffect } from 'react'; import { Route, RouteComponentProps, Switch } from 'react-router-dom'; import { FormattedMessage } from '@kbn/i18n/react'; import { @@ -26,11 +26,16 @@ import { getAlertingSectionBreadcrumb } from './lib/breadcrumb'; import { getCurrentDocTitle } from './lib/doc_title'; import { hasShowActionsCapability } from './lib/capabilities'; -import { ActionsConnectorsList } from './sections/actions_connectors_list/components/actions_connectors_list'; -import { AlertsList } from './sections/alerts_list/components/alerts_list'; import { HealthCheck } from './components/health_check'; import { HealthContextProvider } from './context/health_context'; import { useKibana } from '../common/lib/kibana'; +import { suspendedComponentWithProps } from './lib/suspended_component_with_props'; +import { CenterJustifiedSpinner } from './components/center_justified_spinner'; + +const ActionsConnectorsList = lazy( + async () => import('./sections/actions_connectors_list/components/actions_connectors_list') +); +const AlertsList = lazy(() => import('./sections/alerts_list/components/alerts_list')); export interface MatchParams { section: Section; @@ -145,7 +150,9 @@ export const TriggersActionsUIHome: React.FunctionComponent ( - + }> + + )} @@ -157,7 +164,9 @@ export const TriggersActionsUIHome: React.FunctionComponent ( - + }> + + )} diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx index d80041312d7909..092d5997df4891 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx @@ -42,7 +42,7 @@ import { useKibana } from '../../../../common/lib/kibana'; import { DEFAULT_HIDDEN_ACTION_TYPES } from '../../../../'; import { CenterJustifiedSpinner } from '../../../components/center_justified_spinner'; -export const ActionsConnectorsList: React.FunctionComponent = () => { +const ActionsConnectorsList: React.FunctionComponent = () => { const { http, notifications: { toasts }, @@ -393,6 +393,9 @@ export const ActionsConnectorsList: React.FunctionComponent = () => { ); }; +// eslint-disable-next-line import/no-default-export +export { ActionsConnectorsList as default }; + function getActionsCountByActionType(actions: ActionConnector[], actionTypeId: string) { return actions.filter((action) => action.actionTypeId === actionTypeId).length; } diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx index d43dd9f05344fe..9cc230d5b6b728 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx @@ -77,7 +77,7 @@ interface AlertState { totalItemCount: number; } -export const AlertsList: React.FunctionComponent = () => { +const AlertsList: React.FunctionComponent = () => { const history = useHistory(); const { http, @@ -782,6 +782,9 @@ export const AlertsList: React.FunctionComponent = () => { ); }; +// eslint-disable-next-line import/no-default-export +export { AlertsList as default }; + const noPermissionPrompt = ( Date: Thu, 22 Apr 2021 15:32:32 -0700 Subject: [PATCH 02/14] removed old code --- packages/kbn-optimizer/limits.yml | 2 +- .../public/application/app.tsx | 2 +- .../public/application/home.tsx | 51 +++++++------------ .../action_connector_form/action_form.tsx | 2 +- .../connector_add_inline.tsx | 3 ++ .../connector_add_modal.tsx | 10 ++-- .../sections/action_connector_form/index.ts | 8 +++ .../components/actions_connectors_list.tsx | 8 ++- .../alerts_list/components/alerts_list.tsx | 2 +- .../public/common/get_add_alert_flyout.tsx | 10 ++-- .../common/get_add_connector_flyout.tsx | 12 ++--- .../public/common/get_edit_alert_flyout.tsx | 10 ++-- .../common/get_edit_connector_flyout.tsx | 12 ++--- 13 files changed, 56 insertions(+), 76 deletions(-) diff --git a/packages/kbn-optimizer/limits.yml b/packages/kbn-optimizer/limits.yml index a68c86c3c22cb2..f6571ed0a05350 100644 --- a/packages/kbn-optimizer/limits.yml +++ b/packages/kbn-optimizer/limits.yml @@ -78,7 +78,7 @@ pageLoadAssetSize: tileMap: 65337 timelion: 29920 transform: 41007 - triggersActionsUi: 100000 + triggersActionsUi: 122871 uiActions: 97717 uiActionsEnhanced: 313011 upgradeAssistant: 81241 diff --git a/x-pack/plugins/triggers_actions_ui/public/application/app.tsx b/x-pack/plugins/triggers_actions_ui/public/application/app.tsx index 2e0614e7ea9637..5acb99c684a961 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/app.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/app.tsx @@ -26,7 +26,7 @@ import { EuiThemeProvider } from '../../../../../src/plugins/kibana_react/common import { setSavedObjectsClient } from '../common/lib/data_apis'; import { KibanaContextProvider } from '../common/lib/kibana'; -const TriggersActionsUIHome = lazy(async () => import('./home')); +const TriggersActionsUIHome = lazy(() => import('./home')); const AlertDetailsRoute = lazy( () => import('./sections/alert_details/components/alert_details_route') ); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/home.tsx b/x-pack/plugins/triggers_actions_ui/public/application/home.tsx index 9f2fcc6320af30..20aec6974d395b 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/home.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/home.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { lazy, Suspense, useEffect } from 'react'; +import React, { lazy, useEffect } from 'react'; import { Route, RouteComponentProps, Switch } from 'react-router-dom'; import { FormattedMessage } from '@kbn/i18n/react'; import { @@ -30,10 +30,9 @@ import { HealthCheck } from './components/health_check'; import { HealthContextProvider } from './context/health_context'; import { useKibana } from '../common/lib/kibana'; import { suspendedComponentWithProps } from './lib/suspended_component_with_props'; -import { CenterJustifiedSpinner } from './components/center_justified_spinner'; const ActionsConnectorsList = lazy( - async () => import('./sections/actions_connectors_list/components/actions_connectors_list') + () => import('./sections/actions_connectors_list/components/actions_connectors_list') ); const AlertsList = lazy(() => import('./sections/alerts_list/components/alerts_list')); @@ -142,36 +141,24 @@ export const TriggersActionsUIHome: React.FunctionComponent - - {canShowActions && ( - ( - - - }> - - - - + + + + {canShowActions && ( + )} - /> - )} - ( - - - }> - - - - - )} - /> - + + + + ); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx index 02e96b5fd05c5c..02b6e705c002d0 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx @@ -30,7 +30,6 @@ import { ActionTypeRegistryContract, } from '../../../types'; import { SectionLoading } from '../../components/section_loading'; -import { ConnectorAddModal } from './connector_add_modal'; import { ActionTypeForm, ActionTypeFormProps } from './action_type_form'; import { AddConnectorInline } from './connector_add_inline'; import { actionTypeCompare } from '../../lib/action_type_compare'; @@ -43,6 +42,7 @@ import { import { ActionGroup, AlertActionParam } from '../../../../../alerting/common'; import { useKibana } from '../../../common/lib/kibana'; import { DefaultActionParamsGetter } from '../../lib/get_defaults_for_action_params'; +import { ConnectorAddModal } from '.'; export interface ActionGroupWithMessageVariables extends ActionGroup { omitOptionalMessageVariables?: boolean; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx index aeb8eb21fd45ef..fefaec6c457a14 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx @@ -258,3 +258,6 @@ export const AddConnectorInline = ({ ); }; + +// eslint-disable-next-line import/no-default-export +export { AddConnectorInline as default }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_modal.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_modal.tsx index 8732727b9a77a8..d01ee08df23946 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_modal.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_modal.tsx @@ -35,15 +35,16 @@ import { import { useKibana } from '../../../common/lib/kibana'; import { getConnectorWithInvalidatedFields } from '../../lib/value_validators'; -interface ConnectorAddModalProps { +// eslint-disable-next-line @typescript-eslint/consistent-type-definitions +type ConnectorAddModalProps = { actionType: ActionType; onClose: () => void; postSaveEventHandler?: (savedAction: ActionConnector) => void; consumer?: string; actionTypeRegistry: ActionTypeRegistryContract; -} +}; -export const ConnectorAddModal = ({ +const ConnectorAddModal = ({ actionType, onClose, postSaveEventHandler, @@ -216,3 +217,6 @@ export const ConnectorAddModal = ({ ); }; + +// eslint-disable-next-line import/no-default-export +export { ConnectorAddModal as default }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/index.ts b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/index.ts index 6ff8b5ae1d5002..75d29fd4b0c094 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/index.ts +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/index.ts @@ -15,3 +15,11 @@ export const ConnectorEditFlyout = suspendedComponentWithProps( lazy(() => import('./connector_edit_flyout')) ); export const ActionForm = suspendedComponentWithProps(lazy(() => import('./action_form'))); + +export const ConnectorAddModal = suspendedComponentWithProps( + lazy(() => import('./connector_add_modal')) +); + +export const AddConnectorInline = suspendedComponentWithProps( + lazy(() => import('./connector_add_inline')) +); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx index 092d5997df4891..67cc4060b8d10d 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx @@ -24,10 +24,8 @@ import { i18n } from '@kbn/i18n'; import { omit } from 'lodash'; import { FormattedMessage } from '@kbn/i18n/react'; import { loadAllActions, loadActionTypes, deleteActions } from '../../../lib/action_connector_api'; -import ConnectorAddFlyout from '../../action_connector_form/connector_add_flyout'; -import ConnectorEditFlyout, { - EditConectorTabs, -} from '../../action_connector_form/connector_edit_flyout'; +import { ConnectorAddFlyout, ConnectorEditFlyout } from '../../action_connector_form'; +import { EditConectorTabs } from '../../action_connector_form/connector_edit_flyout'; import { hasDeleteActionsCapability, hasSaveActionsCapability, @@ -42,7 +40,7 @@ import { useKibana } from '../../../../common/lib/kibana'; import { DEFAULT_HIDDEN_ACTION_TYPES } from '../../../../'; import { CenterJustifiedSpinner } from '../../../components/center_justified_spinner'; -const ActionsConnectorsList: React.FunctionComponent = () => { +export const ActionsConnectorsList: React.FunctionComponent = () => { const { http, notifications: { toasts }, diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx index 9cc230d5b6b728..13a0a92e184d3c 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx @@ -77,7 +77,7 @@ interface AlertState { totalItemCount: number; } -const AlertsList: React.FunctionComponent = () => { +export const AlertsList: React.FunctionComponent = () => { const history = useHistory(); const { http, diff --git a/x-pack/plugins/triggers_actions_ui/public/common/get_add_alert_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/common/get_add_alert_flyout.tsx index 42444f4b54e866..a07a20626fafc8 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/get_add_alert_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/get_add_alert_flyout.tsx @@ -5,14 +5,10 @@ * 2.0. */ -import React, { lazy, Suspense } from 'react'; +import React from 'react'; import type { AlertAddProps } from '../application/sections/alert_form/alert_add'; +import { AlertAdd } from '../application/sections/alert_form'; export const getAddAlertFlyoutLazy = (props: AlertAddProps) => { - const AlertAddFlyoutLazy = lazy(() => import('../application/sections/alert_form/alert_add')); - return ( - - - - ); + return ; }; diff --git a/x-pack/plugins/triggers_actions_ui/public/common/get_add_connector_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/common/get_add_connector_flyout.tsx index 2c211572f28509..d5381e2844569d 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/get_add_connector_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/get_add_connector_flyout.tsx @@ -5,16 +5,10 @@ * 2.0. */ -import React, { lazy, Suspense } from 'react'; +import React from 'react'; import type { ConnectorAddFlyoutProps } from '../application/sections/action_connector_form/connector_add_flyout'; +import { ConnectorAddFlyout } from '../application/sections/action_connector_form'; export const getAddConnectorFlyoutLazy = (props: ConnectorAddFlyoutProps) => { - const ConnectorAddFlyoutLazy = lazy( - () => import('../application/sections/action_connector_form/connector_add_flyout') - ); - return ( - - - - ); + return ; }; diff --git a/x-pack/plugins/triggers_actions_ui/public/common/get_edit_alert_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/common/get_edit_alert_flyout.tsx index 89b17f5bb15960..acba4164ded8e1 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/get_edit_alert_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/get_edit_alert_flyout.tsx @@ -5,14 +5,10 @@ * 2.0. */ -import React, { lazy, Suspense } from 'react'; +import React from 'react'; import type { AlertEditProps } from '../application/sections/alert_form/alert_edit'; +import { AlertEdit } from '../application/sections/alert_form'; export const getEditAlertFlyoutLazy = (props: AlertEditProps) => { - const AlertEditFlyoutLazy = lazy(() => import('../application/sections/alert_form/alert_edit')); - return ( - - - - ); + return ; }; diff --git a/x-pack/plugins/triggers_actions_ui/public/common/get_edit_connector_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/common/get_edit_connector_flyout.tsx index 38002cfe14a150..26162ccaa785bd 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/get_edit_connector_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/get_edit_connector_flyout.tsx @@ -5,16 +5,10 @@ * 2.0. */ -import React, { lazy, Suspense } from 'react'; +import React from 'react'; import type { ConnectorEditFlyoutProps } from '../application/sections/action_connector_form/connector_edit_flyout'; +import { ConnectorEditFlyout } from '../application/sections/action_connector_form'; export const getEditConnectorFlyoutLazy = (props: ConnectorEditFlyoutProps) => { - const ConnectorEditFlyoutLazy = lazy( - () => import('../application/sections/action_connector_form/connector_edit_flyout') - ); - return ( - - - - ); + return ; }; From acff73d44ba92c75eb4aecbc43a88729a89b89c1 Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Wed, 5 May 2021 17:24:40 -0700 Subject: [PATCH 03/14] removed fragment --- packages/kbn-optimizer/limits.yml | 2 +- x-pack/plugins/triggers_actions_ui/README.md | 30 +++++++++---------- .../application/action_type_registry.mock.ts | 4 +-- .../components/add_message_variables.tsx | 4 +-- .../email/email_connector.tsx | 14 ++++----- .../email/email_params.tsx | 10 +++---- .../builtin_action_types/jira/jira_params.tsx | 6 ++-- .../pagerduty/pagerduty_connectors.tsx | 18 +++++------ .../pagerduty/pagerduty_params.tsx | 6 ++-- .../resilient/resilient_params.tsx | 6 ++-- .../server_log/server_log_params.tsx | 6 ++-- .../servicenow/servicenow_itsm_params.tsx | 6 ++-- .../servicenow/servicenow_sir_params.tsx | 6 ++-- .../slack/slack_connectors.tsx | 18 +++++------ .../teams/teams_connectors.tsx | 18 +++++------ .../webhook/webhook_connectors.tsx | 18 +++++------ .../application/components/health_check.tsx | 10 +++---- .../prompts/empty_connectors_prompt.tsx | 6 ++-- .../action_connector_form.tsx | 6 ++-- .../action_form.test.tsx | 6 ++-- .../action_connector_form/action_form.tsx | 10 +++---- .../action_type_form.tsx | 19 ++++++------ .../connector_add_flyout.tsx | 12 ++++---- .../connector_add_inline.tsx | 7 +++-- .../connector_add_modal.test.tsx | 2 +- .../connector_edit_flyout.tsx | 14 ++++----- .../test_connector_form.tsx | 10 +++---- .../actions_connectors_list.test.tsx | 2 +- .../components/actions_connectors_list.tsx | 6 ++-- .../components/alert_details.tsx | 14 ++++----- .../components/alert_instances.tsx | 10 +++---- .../alert_form/alert_conditions_group.tsx | 4 +-- .../sections/alert_form/alert_edit.test.tsx | 2 +- .../sections/alert_form/alert_edit.tsx | 6 ++-- .../sections/alert_form/alert_form.test.tsx | 12 ++++---- .../sections/alert_form/alert_form.tsx | 30 ++++++++++--------- .../sections/alert_form/alert_notify_when.tsx | 22 +++++++------- .../alerts_list/components/alerts_list.tsx | 6 ++-- .../alerts_list/components/type_filter.tsx | 12 +++++--- .../components/bulk_operation_popover.tsx | 4 +-- .../common/expression_items/group_by_over.tsx | 6 ++-- .../common/expression_items/threshold.tsx | 8 ++--- 42 files changed, 213 insertions(+), 205 deletions(-) diff --git a/packages/kbn-optimizer/limits.yml b/packages/kbn-optimizer/limits.yml index b92e0f0b8cfbae..300c19df0620f7 100644 --- a/packages/kbn-optimizer/limits.yml +++ b/packages/kbn-optimizer/limits.yml @@ -78,7 +78,7 @@ pageLoadAssetSize: tileMap: 65337 timelion: 29920 transform: 41007 - triggersActionsUi: 122871 + triggersActionsUi: 100000 uiActions: 97717 uiActionsEnhanced: 313011 upgradeAssistant: 81241 diff --git a/x-pack/plugins/triggers_actions_ui/README.md b/x-pack/plugins/triggers_actions_ui/README.md index dc1da533af374b..3748fc4509f9d9 100644 --- a/x-pack/plugins/triggers_actions_ui/README.md +++ b/x-pack/plugins/triggers_actions_ui/README.md @@ -206,13 +206,13 @@ export const IndexThresholdAlertTypeExpression: React.FunctionComponent + <> {hasExpressionErrors ? ( - + <> - + ) : null} @@ -221,7 +221,7 @@ export const IndexThresholdAlertTypeExpression: React.FunctionComponent .... - + ); }; @@ -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 = ({ }) => { const [aggType, setAggType] = useState('count'); return ( - + <> = ({ ) : null} - + ); }; @@ -653,7 +653,7 @@ const ThresholdSpecifier = ( }) => { if (!actionGroup) { // render empty if no condition action group is specified - return ; + 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> = ({ action, editActionConfig, errors }) => { const { someConnectorField } = action.config; return ( - + <> 0 && someConnectorField !== undefined} @@ -1267,7 +1267,7 @@ const ExampleConnectorFields: React.FunctionComponent - + ); }; @@ -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 { const { message } = actionParams; return ( - + <> 0 && message !== undefined} @@ -1315,7 +1315,7 @@ const ExampleParamsFields: React.FunctionComponent - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/action_type_registry.mock.ts b/x-pack/plugins/triggers_actions_ui/public/application/action_type_registry.mock.ts index c1d7a3281b410e..3c5c1b551028ea 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/action_type_registry.mock.ts +++ b/x-pack/plugins/triggers_actions_ui/public/application/action_type_registry.mock.ts @@ -5,7 +5,7 @@ * 2.0. */ -import React, { lazy, Fragment } from 'react'; +import React, { lazy } from 'react'; import uuid from 'uuid'; import { ActionTypeModel, ActionTypeRegistryContract } from '../types'; @@ -21,7 +21,7 @@ const createActionTypeRegistryMock = () => { const mockedActionParamsFields = lazy(async () => ({ default() { - return React.createElement(Fragment); + return React.createElement(React.Fragment); }, })); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/add_message_variables.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/add_message_variables.tsx index 57b251fba0d454..2f220855f94743 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/add_message_variables.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/add_message_variables.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useState, Fragment } from 'react'; +import React, { useState } from 'react'; import { i18n } from '@kbn/i18n'; import { EuiPopover, @@ -62,7 +62,7 @@ export const AddMessageVariables: React.FunctionComponent = ({ ); if ((messageVariables?.length ?? 0) === 0) { - return ; + return <>; } return ( diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/email/email_connector.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/email/email_connector.tsx index df6822c85340a7..5e9fbb671bc48e 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/email/email_connector.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/email/email_connector.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useEffect } from 'react'; +import React, { useEffect } from 'react'; import { EuiFieldText, EuiFlexItem, @@ -40,7 +40,7 @@ export const EmailActionConnectorFields: React.FunctionComponent< }, []); return ( - + <> ) : null} - + ); }; @@ -284,7 +284,7 @@ function nullableString(str: string | null | undefined) { function getEncryptedFieldNotifyLabel(isCreate: boolean) { if (isCreate) { return ( - + <> - + ); } return ( - + <> - + ); } diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/email/email_params.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/email/email_params.tsx index 2c25220598b03e..e2d6237af85da2 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/email/email_params.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/email/email_params.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useState, useEffect } from 'react'; +import React, { useState, useEffect } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { EuiComboBox, EuiButtonEmpty, EuiFormRow } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; @@ -46,7 +46,7 @@ export const EmailParamsFields = ({ }, [defaultMessage]); return ( - + <> + <> {!addCC ? ( setAddCC(true)}> @@ -77,7 +77,7 @@ export const EmailParamsFields = ({ ) : null} - + } > - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira_params.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira_params.tsx index cb2d637972cb82..11123a81440bba 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira_params.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira_params.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useCallback, useEffect, useMemo, useRef } from 'react'; +import React, { useCallback, useEffect, useMemo, useRef } from 'react'; import { i18n } from '@kbn/i18n'; import { @@ -190,7 +190,7 @@ const JiraParamsFields: React.FunctionComponent + <> <> - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty_connectors.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty_connectors.tsx index 60935684527e53..4dd0e063536df4 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty_connectors.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty_connectors.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment } from 'react'; +import React from 'react'; import { EuiCallOut, EuiFieldText, EuiFormRow, EuiLink, EuiSpacer, EuiText } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; @@ -20,7 +20,7 @@ const PagerDutyActionConnectorFields: React.FunctionComponent< const { apiUrl } = action.config; const { routingKey } = action.secrets; return ( - + <> - + <> {getEncryptedFieldNotifyLabel(!action.id)} - + - + ); }; function getEncryptedFieldNotifyLabel(isCreate: boolean) { if (isCreate) { return ( - + <> - + ); } return ( - + <> - + ); } diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty_params.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty_params.tsx index 98dd9c6bf84315..4961a27fd0ac15 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty_params.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty_params.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment } from 'react'; +import React from 'react'; import { EuiFlexGroup, EuiFlexItem, EuiFormRow, EuiSelect, EuiSpacer } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { isUndefined } from 'lodash'; @@ -102,7 +102,7 @@ const PagerDutyParamsFields: React.FunctionComponent + <> ) : null} - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/resilient_params.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/resilient_params.tsx index 8444f5a2c5ca91..4642226d402221 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/resilient_params.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/resilient_params.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useCallback, useEffect, useMemo, useRef } from 'react'; +import React, { useCallback, useEffect, useMemo, useRef } from 'react'; import { EuiFormRow, EuiComboBox, @@ -165,7 +165,7 @@ const ResilientParamsFields: React.FunctionComponent + <>

Incident

 @@ -251,7 +251,7 @@ const ResilientParamsFields: React.FunctionComponent - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/server_log/server_log_params.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/server_log/server_log_params.tsx index 2a6d21f31973b9..6397ce7bc184ea 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/server_log/server_log_params.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/server_log/server_log_params.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useEffect, useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { i18n } from '@kbn/i18n'; import { EuiSelect, EuiFormRow } from '@elastic/eui'; import { ActionParamsProps } from '../../../../types'; @@ -48,7 +48,7 @@ export const ServerLogParamsFields: React.FunctionComponent< }, [defaultMessage]); return ( - + <> - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow_itsm_params.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow_itsm_params.tsx index 84326a7ae9be8b..dbd6fec3dad190 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow_itsm_params.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow_itsm_params.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useCallback, useEffect, useMemo, useRef, useState } from 'react'; +import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { EuiFormRow, EuiSelect, @@ -146,7 +146,7 @@ const ServiceNowParamsFields: React.FunctionComponent< }, [actionParams]); return ( - + <>

{i18n.INCIDENT}

 @@ -270,7 +270,7 @@ const ServiceNowParamsFields: React.FunctionComponent< inputTargetValue={comments && comments.length > 0 ? comments[0].comment : undefined} label={i18n.COMMENTS_LABEL} /> - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow_sir_params.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow_sir_params.tsx index 95a17c205801c4..be6756b1c1049d 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow_sir_params.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow_sir_params.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useCallback, useEffect, useMemo, useRef, useState } from 'react'; +import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { EuiFormRow, EuiSelect, @@ -142,7 +142,7 @@ const ServiceNowSIRParamsFields: React.FunctionComponent< }, [actionParams]); return ( - + <>

{i18n.INCIDENT}

 @@ -276,7 +276,7 @@ const ServiceNowSIRParamsFields: React.FunctionComponent< inputTargetValue={comments && comments.length > 0 ? comments[0].comment : undefined} label={i18n.COMMENTS_LABEL} /> - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/slack/slack_connectors.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/slack/slack_connectors.tsx index fb0275b92bad89..f810ddf6c955e4 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/slack/slack_connectors.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/slack/slack_connectors.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment } from 'react'; +import React from 'react'; import { EuiCallOut, EuiFieldText, EuiFormRow, EuiLink, EuiSpacer, EuiText } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; @@ -20,7 +20,7 @@ const SlackActionFields: React.FunctionComponent< const { webhookUrl } = action.secrets; return ( - + <> - + <> {getEncryptedFieldNotifyLabel(!action.id)} - + - + ); }; function getEncryptedFieldNotifyLabel(isCreate: boolean) { if (isCreate) { return ( - + <> - + ); } return ( - + <> - + ); } diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/teams_connectors.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/teams_connectors.tsx index 3797d784131d74..154a7d292c9e5c 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/teams_connectors.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/teams_connectors.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment } from 'react'; +import React from 'react'; import { EuiCallOut, EuiFieldText, EuiFormRow, EuiLink, EuiSpacer, EuiText } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; @@ -20,7 +20,7 @@ const TeamsActionFields: React.FunctionComponent< const { docLinks } = useKibana().services; return ( - + <> - + <> {getEncryptedFieldNotifyLabel(!action.id)} - + - + ); }; function getEncryptedFieldNotifyLabel(isCreate: boolean) { if (isCreate) { return ( - + <> - + ); } return ( - + <> - + ); } diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/webhook/webhook_connectors.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/webhook/webhook_connectors.tsx index 94020a574be2da..eb7a0dee944331 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/webhook/webhook_connectors.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/webhook/webhook_connectors.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useEffect, useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { @@ -111,7 +111,7 @@ const WebhookActionConnectorFields: React.FunctionComponent< let headerControl; if (hasHeaders) { headerControl = ( - + <>
- + ); } @@ -221,7 +221,7 @@ const WebhookActionConnectorFields: React.FunctionComponent< }); return ( - + <> - + ); }; function getEncryptedFieldNotifyLabel(isCreate: boolean) { if (isCreate) { return ( - + <> - + ); } return ( - + <> - + ); } diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/health_check.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/health_check.tsx index d75ab102a8e0ca..762526dfd7fa78 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/health_check.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/health_check.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment } from 'react'; +import React from 'react'; import { Option, none, some, fold } from 'fp-ts/lib/Option'; import { pipe } from 'fp-ts/lib/pipeable'; import { FormattedMessage } from '@kbn/i18n/react'; @@ -69,16 +69,16 @@ export const HealthCheck: React.FunctionComponent = ({ fold( () => waitForCheck ? ( - + <> - + ) : ( - {children} + <>{children} ), (healthCheck) => { return healthCheck?.isSufficientlySecure && healthCheck?.hasPermanentEncryptionKey ? ( - {children} + <>{children} ) : !healthCheck.isAlertsAvailable ? ( ) : !healthCheck.isSufficientlySecure && !healthCheck.hasPermanentEncryptionKey ? ( diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/prompts/empty_connectors_prompt.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/prompts/empty_connectors_prompt.tsx index e56fad409d98f4..84ac46605905e5 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/prompts/empty_connectors_prompt.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/prompts/empty_connectors_prompt.tsx @@ -6,7 +6,7 @@ */ import { FormattedMessage } from '@kbn/i18n/react'; -import React, { Fragment } from 'react'; +import React from 'react'; import { EuiButton, EuiEmptyPrompt, EuiIcon, EuiSpacer, EuiTitle } from '@elastic/eui'; import './empty_connectors_prompt.scss'; @@ -14,7 +14,7 @@ export const EmptyConnectorsPrompt = ({ onCTAClicked }: { onCTAClicked: () => vo + <> @@ -27,7 +27,7 @@ export const EmptyConnectorsPrompt = ({ onCTAClicked }: { onCTAClicked: () => vo />
- + } body={

diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_connector_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_connector_form.tsx index e8176d752555cb..0790dce9ca3d4d 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_connector_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_connector_form.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, Suspense } from 'react'; +import React, { Suspense } from 'react'; import { EuiForm, EuiCallOut, @@ -137,7 +137,7 @@ export const ActionConnectorForm = ({ const actionTypeRegistered = actionTypeRegistry.get(connector.actionTypeId); if (!actionTypeRegistered) return ( - + <> - + ); const FieldsComponent = actionTypeRegistered.actionConnectorFields; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.test.tsx index 174407e7edec50..ad727be58280f4 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.test.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, lazy } from 'react'; +import React, { lazy } from 'react'; import { mountWithIntl, nextTick } from '@kbn/test/jest'; import { EuiAccordion } from '@elastic/eui'; import { coreMock } from '../../../../../../../src/core/public/mocks'; @@ -34,7 +34,7 @@ const setHasActionsWithBrokenConnector = jest.fn(); describe('action_form', () => { const mockedActionParamsFields = lazy(async () => ({ default() { - return ; + return <>; }, })); @@ -45,7 +45,7 @@ describe('action_form', () => { validate: (): ValidationResult => { return { errors: {} }; }, - alertParamsExpression: () => , + alertParamsExpression: () => <>, requiresAppContext: false, }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx index 5a310e997c0bfb..61ec8679b5d49a 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useState, useEffect, useCallback } from 'react'; +import React, { useState, useEffect, useCallback } from 'react'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; import { @@ -296,7 +296,7 @@ export const ActionForm = ({ /> ) : ( - + <>

{isAddActionPanelOpen ? ( - + <> @@ -439,7 +439,7 @@ export const ActionForm = ({ actionTypeNodes )} - + ) : ( @@ -468,7 +468,7 @@ export const ActionForm = ({ actionTypeRegistry={actionTypeRegistry} /> ) : null} - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx index 48c6c1b42d7af7..51b230ecaeb10d 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, Suspense, useEffect, useState } from 'react'; +import React, { Suspense, useEffect, useState } from 'react'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; import { @@ -202,9 +202,9 @@ export const ActionTypeForm = ({ ); const accordionContent = checkEnabledResult.isEnabled ? ( - + <> {actionGroups && selectedActionGroup && setActionGroupIdByIndex && ( - + <> - + )} @@ -305,15 +305,16 @@ export const ActionTypeForm = ({ ) : null} - + ) : ( checkEnabledResult.messageCard ); return ( - + <> {checkEnabledResult.isEnabled === false && ( - + <> - + )} @@ -386,7 +387,7 @@ export const ActionTypeForm = ({ {accordionContent} - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_flyout.tsx index 6dc75b318a8f07..7e6066e70c8ebc 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_flyout.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useCallback, useState, Fragment, useReducer } from 'react'; +import React, { useCallback, useState, useReducer } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { EuiTitle, @@ -199,7 +199,7 @@ const ConnectorAddFlyout: React.FunctionComponent = ({ }; saveButton = ( - + <> {onTestConnector && ( = ({ /> - + ); } @@ -251,7 +251,7 @@ const ConnectorAddFlyout: React.FunctionComponent = ({ ) : null} {actionTypeModel && actionType ? ( - + <>

= ({ {actionTypeModel.selectMessage} - + ) : (

@@ -285,7 +285,7 @@ const ConnectorAddFlyout: React.FunctionComponent = ({ !actionType && hasActionsUpgradeableByTrial ? ( ) : ( - + <> ) } > diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx index fefaec6c457a14..80cab25e35379d 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useEffect, useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; import { @@ -162,8 +162,9 @@ export const AddConnectorInline = ({ ); return ( - + <> - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_modal.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_modal.test.tsx index ccff4f5853b1b6..c18f6955d12177 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_modal.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_modal.test.tsx @@ -7,7 +7,7 @@ import * as React from 'react'; import { mountWithIntl } from '@kbn/test/jest'; -import { ConnectorAddModal } from './connector_add_modal'; +import ConnectorAddModal from './connector_add_modal'; import { actionTypeRegistryMock } from '../../action_type_registry.mock'; import { ActionType, ConnectorValidationResult, GenericValidationResult } from '../../../types'; import { useKibana } from '../../../common/lib/kibana'; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx index 21a90fb1ae17f6..35b98e23afb9a6 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useCallback, useReducer, useState, Fragment } from 'react'; +import React, { useCallback, useReducer, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { EuiTitle, @@ -173,7 +173,7 @@ export const ConnectorEditFlyout = ({ }); const flyoutTitle = connector.isPreconfigured ? ( - + <>

- + ) : (

@@ -310,7 +310,7 @@ export const ConnectorEditFlyout = ({ consumer={consumer} /> ) : ( - + <> {i18n.translate( 'xpack.triggersActionsUI.sections.editConnectorForm.descriptionText', @@ -325,7 +325,7 @@ export const ConnectorEditFlyout = ({ defaultMessage="Learn more about preconfigured connectors." /> - + ) ) : ( {canSave && actionTypeModel && !connector.isPreconfigured ? ( - + <> - + ) : null} diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/test_connector_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/test_connector_form.tsx index 8afa2d2b575299..92a17a2e4cfae8 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/test_connector_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/test_connector_form.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, Suspense } from 'react'; +import React, { Suspense } from 'react'; import { EuiFlexGroup, EuiFlexItem, @@ -102,9 +102,9 @@ export const TestConnectorForm = ({ defaultMessage: 'Run the test', }), children: ( - + <> {executeEnabled ? null : ( - + <>

- + )} - + ), }, { diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx index cc516fa5a32b9b..e537269ba1d183 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx @@ -153,7 +153,7 @@ describe('actions_connectors_list component with items', () => { const mockedActionParamsFields = React.lazy(async () => ({ default() { - return ; + return <>; }, })); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx index 67cc4060b8d10d..f54faf6a018922 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useState, useEffect } from 'react'; +import React, { useState, useEffect } from 'react'; import { EuiInMemoryTable, EuiSpacer, @@ -172,14 +172,14 @@ export const ActionsConnectorsList: React.FunctionComponent = () => { return checkEnabledResult.isEnabled ? ( link ) : ( - + <> {link} - + ); }, }, diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_details.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_details.tsx index 0796f09b134606..0d49ce206b6c24 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_details.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_details.tsx @@ -6,7 +6,7 @@ */ import { i18n } from '@kbn/i18n'; -import React, { useState, Fragment, useEffect, useReducer } from 'react'; +import React, { useState, useEffect, useReducer } from 'react'; import { keyBy } from 'lodash'; import { useHistory } from 'react-router-dom'; import { @@ -136,7 +136,7 @@ export const AlertDetails: React.FunctionComponent = ({ {hasEditButton ? ( - + <> {' '} = ({ onSave={setAlert} /> )} - + ) : null} @@ -201,7 +201,7 @@ export const AlertDetails: React.FunctionComponent = ({ {uniqueActions && uniqueActions.length ? ( - + <>

= ({ ))} - + ) : null} @@ -330,7 +330,7 @@ export const AlertDetails: React.FunctionComponent = ({ readOnly={!canSaveAlert} /> ) : ( - + <> = ({ />

- + )} diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_instances.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_instances.tsx index d2919194125f83..16240b72666cbd 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_instances.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_details/components/alert_instances.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useState } from 'react'; +import React, { useState } from 'react'; import moment, { Duration } from 'moment'; import { i18n } from '@kbn/i18n'; import { EuiBasicTable, EuiHealth, EuiSpacer, EuiSwitch, EuiToolTip } from '@elastic/eui'; @@ -112,7 +112,7 @@ export const alertInstancesTableColumns = ( ), render: (alertInstance: AlertInstanceListItem) => { return ( - + <> onMuteAction(alertInstance)} /> - + ); }, sortable: false, @@ -167,7 +167,7 @@ export function AlertInstances({ }; return ( - + <> - + ); } export const AlertInstancesWithApi = withBulkAlertOperations(AlertInstances); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_conditions_group.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_conditions_group.tsx index 6c2f5aecfcb7c7..dd0a7df38eb629 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_conditions_group.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_conditions_group.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, PropsWithChildren } from 'react'; +import React, { PropsWithChildren } from 'react'; import { i18n } from '@kbn/i18n'; import { EuiFormRow, EuiButtonIcon, EuiTitle } from '@elastic/eui'; import { AlertConditionsProps, ActionGroupWithCondition } from './alert_conditions'; @@ -55,7 +55,7 @@ export const AlertConditionsGroup = ({ ...otherProps, }) ) : ( - + <> )} ); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.test.tsx index 0736e28f193b81..49dd92b67ee41c 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.test.tsx @@ -98,7 +98,7 @@ describe('alert_edit', () => { validate: (): ValidationResult => { return { errors: {} }; }, - alertParamsExpression: () => , + alertParamsExpression: () => <>, requiresAppContext: false, }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.tsx index d704111858e4fd..8b39395f4d68e8 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useReducer, useState } from 'react'; +import React, { useReducer, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { EuiTitle, @@ -149,7 +149,7 @@ export const AlertEdit = ({ {hasActionsDisabled && ( - + <> - + )} { validate: (): ValidationResult => { return { errors: {} }; }, - alertParamsExpression: () => , + alertParamsExpression: () => <>, requiresAppContext: false, }; @@ -72,7 +72,7 @@ describe('alert_form', () => { validate: (): ValidationResult => { return { errors: {} }; }, - alertParamsExpression: () => , + alertParamsExpression: () => <>, requiresAppContext: true, }; @@ -84,7 +84,7 @@ describe('alert_form', () => { validate: (): ValidationResult => { return { errors: {} }; }, - alertParamsExpression: () => , + alertParamsExpression: () => <>, requiresAppContext: false, }; @@ -322,7 +322,7 @@ describe('alert_form', () => { validate: (): ValidationResult => { return { errors: {} }; }, - alertParamsExpression: () => , + alertParamsExpression: () => <>, requiresAppContext: true, }, { @@ -333,7 +333,7 @@ describe('alert_form', () => { validate: (): ValidationResult => { return { errors: {} }; }, - alertParamsExpression: () => , + alertParamsExpression: () => <>, requiresAppContext: false, }, ]); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.tsx index 6bb485bc7fbb84..56da8f90896fa1 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_form.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useState, useEffect, useCallback, Suspense } from 'react'; +import React, { useState, useEffect, useCallback, Suspense } from 'react'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; import { @@ -433,8 +433,9 @@ export const AlertForm = ({ const alertTypeNodes = Object.entries(alertTypesByProducer) .sort((a, b) => alertTypeGroupCompare(a, b, solutions)) .map(([solution, items], groupIndex) => ( - + <> ); return ( - + <> - + ); })} - + )); const alertTypeDetails = ( - + <> @@ -605,11 +607,11 @@ export const AlertForm = ({ selectedAlertType ? ( <> {errors.actionConnectors.length >= 1 ? ( - + <> - + ) : null} ) : null} - + ); const labelForAlertChecked = ( @@ -793,9 +795,9 @@ export const AlertForm = ({ {alertTypeModel ? ( - {alertTypeDetails} + <>{alertTypeDetails} ) : availableAlertTypes.length ? ( - + <> {errors.alertTypeId.length >= 1 && alert.alertTypeId !== undefined ? ( - + <> - + ) : null} {alertTypeNodes} - + ) : alertTypesIndex ? ( ) : ( diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_notify_when.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_notify_when.tsx index b774fd702fadc4..15b228467cf2d5 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_notify_when.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_notify_when.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useState, useEffect, useCallback } from 'react'; +import React, { useState, useEffect, useCallback } from 'react'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; import { @@ -39,7 +39,7 @@ const NOTIFY_WHEN_OPTIONS: Array> = [ ), 'data-test-subj': 'onActionGroupChange', dropdownDisplay: ( - + <> > = [ />

- + ), }, { @@ -67,7 +67,7 @@ const NOTIFY_WHEN_OPTIONS: Array> = [ ), 'data-test-subj': 'onActiveAlert', dropdownDisplay: ( - + <> > = [ />

- + ), }, { @@ -95,7 +95,7 @@ const NOTIFY_WHEN_OPTIONS: Array> = [ ), 'data-test-subj': 'onThrottleInterval', dropdownDisplay: ( - + <> > = [ />

- + ), }, ]; @@ -173,7 +173,7 @@ export const AlertNotifyWhen = ({ ); return ( - + <> @@ -184,7 +184,7 @@ export const AlertNotifyWhen = ({ onChange={onNotifyWhenValueChange} /> {showCustomThrottleOpts && ( - + <> @@ -227,11 +227,11 @@ export const AlertNotifyWhen = ({ - + )} - + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx index 13a0a92e184d3c..1fb688c4dd6bf4 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/alerts_list.tsx @@ -10,7 +10,7 @@ import { i18n } from '@kbn/i18n'; import { capitalize, sortBy } from 'lodash'; import { FormattedMessage } from '@kbn/i18n/react'; -import React, { useEffect, useState, Fragment } from 'react'; +import React, { useEffect, useState } from 'react'; import { EuiBasicTable, EuiBadge, @@ -479,7 +479,7 @@ export const AlertsList: React.FunctionComponent = () => { : false; const table = ( - + <> {selectedIds.length > 0 && authorizedToModifySelectedAlerts && ( @@ -713,7 +713,7 @@ export const AlertsList: React.FunctionComponent = () => { onCancel={() => setManageLicenseModalOpts(null)} /> )} - + ); const loadedItems = convertAlertsToTableItems( diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/type_filter.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/type_filter.tsx index cadfbece849b8f..0aa38486952ca4 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/type_filter.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/type_filter.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Fragment, useEffect, useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { EuiFilterGroup, @@ -63,8 +63,12 @@ export const TypeFilter: React.FunctionComponent = ({ >
{options.map((groupItem, groupIndex) => ( - - + <> +

{groupItem.groupName}

 {groupItem.subOptions.map((item, index) => ( @@ -84,7 +88,7 @@ export const TypeFilter: React.FunctionComponent = ({ {item.name} ))} - + ))}
diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/bulk_operation_popover.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/bulk_operation_popover.tsx index 56cf856763c94f..764ae9ded90769 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/bulk_operation_popover.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/common/components/bulk_operation_popover.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useState, Fragment } from 'react'; +import React, { useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { EuiButton, EuiPopover } from '@elastic/eui'; @@ -33,7 +33,7 @@ export const BulkOperationPopover: React.FunctionComponent = ({ children }) => { > {children && React.Children.map(children, (child) => - React.isValidElement(child) ? {React.cloneElement(child, {})} : child + React.isValidElement(child) ? <>{React.cloneElement(child, {})} : child )} ); diff --git a/x-pack/plugins/triggers_actions_ui/public/common/expression_items/group_by_over.tsx b/x-pack/plugins/triggers_actions_ui/public/common/expression_items/group_by_over.tsx index a6ec9d1b39665e..1430c403407719 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/expression_items/group_by_over.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/expression_items/group_by_over.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useState, Fragment } from 'react'; +import React, { useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { i18n } from '@kbn/i18n'; import { @@ -151,7 +151,7 @@ export const GroupByExpression = ({ {groupByTypes[groupBy].sizeRequired ? ( - + <> 0} error={errors.termSize}> - + ) : null} diff --git a/x-pack/plugins/triggers_actions_ui/public/common/expression_items/threshold.tsx b/x-pack/plugins/triggers_actions_ui/public/common/expression_items/threshold.tsx index d650162816f2bb..e70fc8dcef4491 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/expression_items/threshold.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/expression_items/threshold.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useEffect, useState, Fragment } from 'react'; +import React, { useEffect, useState } from 'react'; import { i18n } from '@kbn/i18n'; import { EuiExpression, @@ -134,7 +134,7 @@ export const ThresholdExpression = ({ {Array.from(Array(numRequiredThresholds)).map((_notUsed, i) => { return ( - + <> {i > 0 ? ( {andThresholdText} ) : null} - + 0 || !threshold[i]} error={errors[`threshold${i}`]} @@ -167,7 +167,7 @@ export const ThresholdExpression = ({ /> - + ); })} From 96529755b8b5b8aad8c0f7c473ad36f63855fbbe Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Fri, 21 May 2021 16:41:10 -0700 Subject: [PATCH 04/14] changed svg logo to lazy react components --- .../builtin_action_types/jira/jira.tsx | 3 +- .../builtin_action_types/jira/logo.svg | 9 ---- .../builtin_action_types/jira/logo.tsx | 35 +++++++++++++ .../builtin_action_types/pagerduty/logo.tsx | 37 ++++++++++++++ .../pagerduty/pagerduty.svg | 13 ----- .../pagerduty/pagerduty.tsx | 3 +- .../resilient/{logo.svg => logo.tsx} | 23 +++++++-- .../resilient/resilient.tsx | 3 +- .../builtin_action_types/servicenow/logo.svg | 5 -- .../builtin_action_types/servicenow/logo.tsx | 31 ++++++++++++ .../servicenow/servicenow.tsx | 5 +- .../teams/{teams.svg => logo.tsx} | 44 +++++++++++++--- .../builtin_action_types/teams/teams.tsx | 3 +- .../lib/check_action_type_enabled.test.tsx | 2 +- .../lib/check_action_type_enabled.tsx | 8 +-- .../action_connector_form/action_form.tsx | 16 +++--- .../action_type_form.tsx | 14 +++--- .../connector_add_flyout.tsx | 11 +--- .../connector_add_inline.tsx | 18 +++---- .../connector_edit_flyout.tsx | 17 +------ .../components/actions_connectors_list.tsx | 10 ++-- .../sections/alert_form/alert_add.tsx | 17 +------ .../sections/alert_form/alert_edit.tsx | 18 +------ .../public/common/constants/index.ts | 4 +- .../public/common/get_add_alert_flyout.tsx | 2 +- .../common/get_add_connector_flyout.tsx | 2 +- .../public/common/get_edit_alert_flyout.tsx | 2 +- .../common/get_edit_connector_flyout.tsx | 2 +- .../triggers_actions_ui/public/index.ts | 17 +------ .../triggers_actions_ui/public/plugin.ts | 13 +++-- .../triggers_actions_ui/public/types.ts | 50 ++++++++++++++++++- 31 files changed, 273 insertions(+), 164 deletions(-) delete mode 100644 x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.svg create mode 100644 x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx create mode 100644 x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/logo.tsx delete mode 100644 x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.svg rename x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/{logo.svg => logo.tsx} (77%) delete mode 100644 x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.svg create mode 100644 x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.tsx rename x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/{teams.svg => logo.tsx} (91%) diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira.tsx index ba6a5fa2079dca..ff7fd026f8e31b 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira.tsx @@ -11,7 +11,6 @@ import { ActionTypeModel, ConnectorValidationResult, } from '../../../../types'; -import logo from './logo.svg'; import { JiraActionConnector, JiraConfig, JiraSecrets, JiraActionParams } from './types'; import * as i18n from './translations'; import { isValidUrl } from '../../../lib/value_validators'; @@ -63,7 +62,7 @@ const validateConnector = ( export function getActionType(): ActionTypeModel { return { id: '.jira', - iconClass: logo, + iconClass: lazy(() => import('./logo')), selectMessage: i18n.JIRA_DESC, actionTypeTitle: i18n.JIRA_TITLE, validateConnector, diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.svg b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.svg deleted file mode 100644 index 8560cf7e270c89..00000000000000 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.svg +++ /dev/null @@ -1,9 +0,0 @@ - - - - - - - - - diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx new file mode 100644 index 00000000000000..2e8f1d5ef3bd70 --- /dev/null +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx @@ -0,0 +1,35 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +import React from 'react'; + +const Logo = () => ( + + + + + + + + + +); + +// eslint-disable-next-line import/no-default-export +export { Logo as default }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/logo.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/logo.tsx new file mode 100644 index 00000000000000..d3a92e538217b4 --- /dev/null +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/logo.tsx @@ -0,0 +1,37 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +import React from 'react'; + +const Logo = () => ( + + + + + + +); + +// eslint-disable-next-line import/no-default-export +export { Logo as default }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.svg b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.svg deleted file mode 100644 index b11dcb3570c266..00000000000000 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.svg +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - - - diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.tsx index cae4221e5d7ce9..310c5cae24566c 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.tsx @@ -20,7 +20,6 @@ import { PagerDutyActionParams, EventActionOptions, } from '.././types'; -import pagerDutySvg from './pagerduty.svg'; import { hasMustacheTokens } from '../../../lib/has_mustache_tokens'; export function getActionType(): ActionTypeModel< @@ -30,7 +29,7 @@ export function getActionType(): ActionTypeModel< > { return { id: '.pagerduty', - iconClass: pagerDutySvg, + iconClass: lazy(() => import('./logo')), selectMessage: i18n.translate( 'xpack.triggersActionsUI.components.builtinActionTypes.pagerDutyAction.selectMessageText', { diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/logo.svg b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/logo.tsx similarity index 77% rename from x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/logo.svg rename to x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/logo.tsx index 553c2c62b7191c..325893756e2f42 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/logo.svg +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/logo.tsx @@ -1,3 +1,20 @@ - - - +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +import React from 'react'; + +const Logo = () => ( + + + +); + +// eslint-disable-next-line import/no-default-export +export { Logo as default }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/resilient.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/resilient.tsx index a8fe5e8ae4b6ae..e7074b7506e7a6 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/resilient.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/resilient/resilient.tsx @@ -11,7 +11,6 @@ import { ActionTypeModel, ConnectorValidationResult, } from '../../../../types'; -import logo from './logo.svg'; import { ResilientActionConnector, ResilientConfig, @@ -72,7 +71,7 @@ export function getActionType(): ActionTypeModel< > { return { id: '.resilient', - iconClass: logo, + iconClass: lazy(() => import('./logo')), selectMessage: i18n.DESC, actionTypeTitle: i18n.TITLE, validateConnector, diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.svg b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.svg deleted file mode 100644 index dcd022a8dca18d..00000000000000 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.tsx new file mode 100644 index 00000000000000..723ea598ec2623 --- /dev/null +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.tsx @@ -0,0 +1,31 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +import React from 'react'; + +const Logo = () => ( + + + + + +); + +// eslint-disable-next-line import/no-default-export +export { Logo as default }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow.tsx index b1664656c0d14d..a6cc116d3d7b4b 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/servicenow.tsx @@ -11,7 +11,6 @@ import { ActionTypeModel, ConnectorValidationResult, } from '../../../../types'; -import logo from './logo.svg'; import { ServiceNowActionConnector, ServiceNowConfig, @@ -68,7 +67,7 @@ export function getServiceNowITSMActionType(): ActionTypeModel< > { return { id: '.servicenow', - iconClass: logo, + iconClass: lazy(() => import('./logo')), selectMessage: i18n.SERVICENOW_ITSM_DESC, actionTypeTitle: i18n.SERVICENOW_ITSM_TITLE, validateConnector, @@ -103,7 +102,7 @@ export function getServiceNowSIRActionType(): ActionTypeModel< > { return { id: '.servicenow-sir', - iconClass: logo, + iconClass: lazy(() => import('./logo')), selectMessage: i18n.SERVICENOW_SIR_DESC, actionTypeTitle: i18n.SERVICENOW_SIR_TITLE, validateConnector, diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/teams.svg b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/logo.tsx similarity index 91% rename from x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/teams.svg rename to x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/logo.tsx index ab07be8f1ef0a8..935a0a26eaa138 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/teams.svg +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/logo.tsx @@ -1,7 +1,34 @@ - - - + {' '} + - +MS0xMlQxOTo1Nzo0NSswMzowMIKUWWYAAAAASUVORK5CYII=" + /> + +); + +// eslint-disable-next-line import/no-default-export +export { Logo as default }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/teams.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/teams.tsx index 00d860fc54110b..e8c7be7311c1ce 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/teams.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/teams.tsx @@ -7,7 +7,6 @@ import { lazy } from 'react'; import { i18n } from '@kbn/i18n'; -import teamsSvg from './teams.svg'; import { ActionTypeModel, GenericValidationResult, @@ -19,7 +18,7 @@ import { isValidUrl } from '../../../lib/value_validators'; export function getActionType(): ActionTypeModel { return { id: '.teams', - iconClass: teamsSvg, + iconClass: lazy(() => import('./logo')), selectMessage: i18n.translate( 'xpack.triggersActionsUI.components.builtinActionTypes.teamsAction.selectMessageText', { diff --git a/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.test.tsx index f9855cc9d71308..6b115abc590ccc 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.test.tsx @@ -61,7 +61,7 @@ describe('checkActionTypeEnabled', () => { > diff --git a/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.tsx b/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.tsx index e4e67002298ee7..1c2a56f4cccaad 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/lib/check_action_type_enabled.tsx @@ -39,7 +39,7 @@ const getLicenseCheckResult = (actionType: ActionType) => { { // The "re-enable" terminology is used here because this message is used when an alert // action was previously enabled and needs action to be re-enabled. description={i18n.translate( - 'xpack.triggersActionsUI.sections.alertForm.actionTypeDisabledByLicenseMessageDescription', + 'xpack.triggersActionsUI.licenseCheck.actionTypeDisabledByLicenseMessageDescription', { defaultMessage: 'To re-enable this action, please upgrade your license.' } )} className="actCheckActionTypeEnabled__disabledActionWarningCard" @@ -58,7 +58,7 @@ const getLicenseCheckResult = (actionType: ActionType) => { } @@ -76,7 +76,7 @@ const configurationCheckResult = { messageCard: ( @@ -301,7 +301,7 @@ export const ActionForm = ({

@@ -401,7 +401,7 @@ export const ActionForm = ({
@@ -431,7 +431,7 @@ export const ActionForm = ({ {isLoadingActionTypes ? ( @@ -449,7 +449,7 @@ export const ActionForm = ({ onClick={() => setIsAddActionPanelOpen(true)} > diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx index 51b230ecaeb10d..ac9d989db03f6c 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx @@ -166,7 +166,7 @@ export const ActionTypeForm = ({ isActionGroupDisabledForActionType ? isActionGroupDisabledForActionType(actionGroupId, actionTypeId) ? i18n.translate( - 'xpack.triggersActionsUI.sections.alertForm.addNewActionConnectorActionGroup.display', + 'xpack.triggersActionsUI.sections.actionTypeForm.addNewActionConnectorActionGroup.display', { defaultMessage: '{actionGroupName} (Not Currently Supported)', values: { actionGroupName }, @@ -214,7 +214,7 @@ export const ActionTypeForm = ({ htmlFor={`addNewActionConnectorActionGroup-${actionItem.actionTypeId}`} > @@ -248,7 +248,7 @@ export const ActionTypeForm = ({ fullWidth label={ ) : null @@ -333,7 +333,7 @@ export const ActionTypeForm = ({ void; - actionTypes?: ActionType[]; - onTestConnector?: (connector: ActionConnector) => void; - reloadConnectors?: () => Promise; - consumer?: string; - actionTypeRegistry: ActionTypeRegistryContract; -} - const ConnectorAddFlyout: React.FunctionComponent = ({ onClose, actionTypes, diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx index 58de1e75970a15..0cdcf8bd44413b 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_add_inline.tsx @@ -68,7 +68,7 @@ export const AddConnectorInline = ({ const noConnectorsLabel = ( @@ -117,7 +117,7 @@ export const AddConnectorInline = ({ fullWidth label={ } @@ -180,7 +180,7 @@ export const AddConnectorInline = ({
} /> @@ -212,7 +212,7 @@ export const AddConnectorInline = ({ color="danger" className="actAccordionActionForm__extraAction" aria-label={i18n.translate( - 'xpack.triggersActionsUI.sections.alertForm.accordion.deleteIconAriaLabel', + 'xpack.triggersActionsUI.sections.connectorAddInline.accordion.deleteIconAriaLabel', { defaultMessage: 'Delete', } @@ -237,7 +237,7 @@ export const AddConnectorInline = ({ onClick={onAddConnector} > @@ -248,7 +248,7 @@ export const AddConnectorInline = ({

diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx index 2fe9ad396788ba..d74af24c83dcdc 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx @@ -30,7 +30,8 @@ import { ActionConnectorForm, getConnectorErrors } from './action_connector_form import { TestConnectorForm } from './test_connector_form'; import { ActionConnector, - ActionTypeRegistryContract, + ConnectorEditFlyoutProps, + EditConectorTabs, UserConfiguredActionConnector, } from '../../../types'; import { ConnectorReducer, createConnectorReducer } from './connector_reducer'; @@ -44,20 +45,6 @@ import './connector_edit_flyout.scss'; import { useKibana } from '../../../common/lib/kibana'; import { getConnectorWithInvalidatedFields } from '../../lib/value_validators'; -export interface ConnectorEditFlyoutProps { - initialConnector: ActionConnector; - onClose: () => void; - tab?: EditConectorTabs; - reloadConnectors?: () => Promise; - consumer?: string; - actionTypeRegistry: ActionTypeRegistryContract; -} - -export enum EditConectorTabs { - Configuration = 'configuration', - Test = 'test', -} - export const ConnectorEditFlyout = ({ initialConnector, onClose, diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx index 6b0bf8672dca9a..317cabd2129a59 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx @@ -26,7 +26,6 @@ import { omit } from 'lodash'; import { FormattedMessage } from '@kbn/i18n/react'; import { loadAllActions, loadActionTypes, deleteActions } from '../../../lib/action_connector_api'; import { ConnectorAddFlyout, ConnectorEditFlyout } from '../../action_connector_form'; -import { EditConectorTabs } from '../../action_connector_form/connector_edit_flyout'; import { hasDeleteActionsCapability, hasSaveActionsCapability, @@ -35,7 +34,12 @@ import { import { DeleteModalConfirmation } from '../../../components/delete_modal_confirmation'; import { checkActionTypeEnabled } from '../../../lib/check_action_type_enabled'; import './actions_connectors_list.scss'; -import { ActionConnector, ActionConnectorTableItem, ActionTypeIndex } from '../../../../types'; +import { + ActionConnector, + ActionConnectorTableItem, + ActionTypeIndex, + EditConectorTabs, +} from '../../../../types'; import { EmptyConnectorsPrompt } from '../../../components/prompts/empty_connectors_prompt'; import { useKibana } from '../../../../common/lib/kibana'; import { DEFAULT_HIDDEN_ACTION_TYPES } from '../../../../'; @@ -456,7 +460,7 @@ const DeleteOperation: React.FunctionComponent<{ > { - consumer: string; - alertTypeRegistry: AlertTypeRegistryContract; - actionTypeRegistry: ActionTypeRegistryContract; - onClose: (reason: AlertFlyoutCloseReason) => void; - alertTypeId?: string; - canChangeTrigger?: boolean; - initialValues?: Partial; - /** @deprecated use `onSave` as a callback after an alert is saved*/ - reloadAlerts?: () => Promise; - onSave?: () => Promise; - metadata?: MetaData; -} - const AlertAdd = ({ consumer, alertTypeRegistry, diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.tsx index 8b39395f4d68e8..f6569f32088eec 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_edit.tsx @@ -23,12 +23,7 @@ import { } from '@elastic/eui'; import { cloneDeep } from 'lodash'; import { i18n } from '@kbn/i18n'; -import { - ActionTypeRegistryContract, - Alert, - AlertFlyoutCloseReason, - AlertTypeRegistryContract, -} from '../../../types'; +import { Alert, AlertEditProps, AlertFlyoutCloseReason } from '../../../types'; import { AlertForm, getAlertErrors, isValidAlert } from './alert_form'; import { alertReducer, ConcreteAlertReducer } from './alert_reducer'; import { updateAlert } from '../../lib/alert_api'; @@ -39,17 +34,6 @@ import { ConfirmAlertClose } from './confirm_alert_close'; import { hasAlertChanged } from './has_alert_changed'; import { getAlertWithInvalidatedFields } from '../../lib/value_validators'; -export interface AlertEditProps> { - initialAlert: Alert; - alertTypeRegistry: AlertTypeRegistryContract; - actionTypeRegistry: ActionTypeRegistryContract; - onClose: (reason: AlertFlyoutCloseReason) => void; - /** @deprecated use `onSave` as a callback after an alert is saved*/ - reloadAlerts?: () => Promise; - onSave?: () => Promise; - metadata?: MetaData; -} - export const AlertEdit = ({ initialAlert, onClose, diff --git a/x-pack/plugins/triggers_actions_ui/public/common/constants/index.ts b/x-pack/plugins/triggers_actions_ui/public/common/constants/index.ts index c2523dd59821d9..b3281589a0f3c7 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/constants/index.ts +++ b/x-pack/plugins/triggers_actions_ui/public/common/constants/index.ts @@ -5,8 +5,8 @@ * 2.0. */ -export { COMPARATORS, builtInComparators } from './comparators'; -export { AGGREGATION_TYPES, builtInAggregationTypes } from './aggregation_types'; +export type { COMPARATORS, builtInComparators } from './comparators'; +export type { AGGREGATION_TYPES, builtInAggregationTypes } from './aggregation_types'; export { builtInGroupByTypes } from './group_by_types'; export const VIEW_LICENSE_OPTIONS_LINK = 'https://www.elastic.co/subscriptions'; diff --git a/x-pack/plugins/triggers_actions_ui/public/common/get_add_alert_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/common/get_add_alert_flyout.tsx index a07a20626fafc8..2698f4ee2e428e 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/get_add_alert_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/get_add_alert_flyout.tsx @@ -6,8 +6,8 @@ */ import React from 'react'; -import type { AlertAddProps } from '../application/sections/alert_form/alert_add'; import { AlertAdd } from '../application/sections/alert_form'; +import type { AlertAddProps } from '../types'; export const getAddAlertFlyoutLazy = (props: AlertAddProps) => { return ; diff --git a/x-pack/plugins/triggers_actions_ui/public/common/get_add_connector_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/common/get_add_connector_flyout.tsx index d5381e2844569d..09261714cf8cf2 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/get_add_connector_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/get_add_connector_flyout.tsx @@ -6,8 +6,8 @@ */ import React from 'react'; -import type { ConnectorAddFlyoutProps } from '../application/sections/action_connector_form/connector_add_flyout'; import { ConnectorAddFlyout } from '../application/sections/action_connector_form'; +import type { ConnectorAddFlyoutProps } from '../types'; export const getAddConnectorFlyoutLazy = (props: ConnectorAddFlyoutProps) => { return ; diff --git a/x-pack/plugins/triggers_actions_ui/public/common/get_edit_alert_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/common/get_edit_alert_flyout.tsx index acba4164ded8e1..26cc1159e5afdd 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/get_edit_alert_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/get_edit_alert_flyout.tsx @@ -6,8 +6,8 @@ */ import React from 'react'; -import type { AlertEditProps } from '../application/sections/alert_form/alert_edit'; import { AlertEdit } from '../application/sections/alert_form'; +import type { AlertEditProps } from '../types'; export const getEditAlertFlyoutLazy = (props: AlertEditProps) => { return ; diff --git a/x-pack/plugins/triggers_actions_ui/public/common/get_edit_connector_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/common/get_edit_connector_flyout.tsx index 26162ccaa785bd..90ecea56856f57 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/get_edit_connector_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/get_edit_connector_flyout.tsx @@ -6,8 +6,8 @@ */ import React from 'react'; -import type { ConnectorEditFlyoutProps } from '../application/sections/action_connector_form/connector_edit_flyout'; import { ConnectorEditFlyout } from '../application/sections/action_connector_form'; +import type { ConnectorEditFlyoutProps } from '../types'; export const getEditConnectorFlyoutLazy = (props: ConnectorEditFlyoutProps) => { return ; diff --git a/x-pack/plugins/triggers_actions_ui/public/index.ts b/x-pack/plugins/triggers_actions_ui/public/index.ts index b65086cd6f3e7d..f2805b7f6fefa4 100644 --- a/x-pack/plugins/triggers_actions_ui/public/index.ts +++ b/x-pack/plugins/triggers_actions_ui/public/index.ts @@ -7,14 +7,6 @@ import { Plugin } from './plugin'; -export { AlertAdd } from './application/sections/alert_form'; -export { - AlertEdit, - AlertConditions, - AlertConditionsGroup, - ActionGroupWithCondition, -} from './application/sections'; - export type { AlertAction, Alert, @@ -31,13 +23,8 @@ export type { AlertTypeParams, } from './types'; -export { - ActionForm, - ConnectorAddFlyout, - ConnectorEditFlyout, -} from './application/sections/action_connector_form'; +export { ActionForm } from './application/sections/action_connector_form'; -export { loadActionTypes } from './application/lib/action_connector_api'; export * from './common'; export function plugin() { @@ -47,6 +34,6 @@ export function plugin() { export { Plugin }; export * from './plugin'; -export { TIME_UNITS } from './application/constants'; +export type { TIME_UNITS } from './application/constants'; export { getTimeUnitLabel } from './common/lib/get_time_unit_label'; export type { TriggersAndActionsUiServices } from '../public/application/app'; diff --git a/x-pack/plugins/triggers_actions_ui/public/plugin.ts b/x-pack/plugins/triggers_actions_ui/public/plugin.ts index a027f25d15eb7b..62daf2ad198f36 100644 --- a/x-pack/plugins/triggers_actions_ui/public/plugin.ts +++ b/x-pack/plugins/triggers_actions_ui/public/plugin.ts @@ -32,11 +32,14 @@ import { getEditConnectorFlyoutLazy } from './common/get_edit_connector_flyout'; import { getAddAlertFlyoutLazy } from './common/get_add_alert_flyout'; import { getEditAlertFlyoutLazy } from './common/get_edit_alert_flyout'; -import type { ActionTypeModel, AlertTypeModel } from './types'; -import type { ConnectorAddFlyoutProps } from './application/sections/action_connector_form/connector_add_flyout'; -import type { ConnectorEditFlyoutProps } from './application/sections/action_connector_form/connector_edit_flyout'; -import type { AlertAddProps } from './application/sections/alert_form/alert_add'; -import type { AlertEditProps } from './application/sections/alert_form/alert_edit'; +import type { + ActionTypeModel, + AlertAddProps, + AlertEditProps, + AlertTypeModel, + ConnectorAddFlyoutProps, + ConnectorEditFlyoutProps, +} from './types'; export interface TriggersAndActionsUIPublicPluginSetup { actionTypeRegistry: TypeRegistry; diff --git a/x-pack/plugins/triggers_actions_ui/public/types.ts b/x-pack/plugins/triggers_actions_ui/public/types.ts index 6db5634be2221a..0f2b961b1f2da8 100644 --- a/x-pack/plugins/triggers_actions_ui/public/types.ts +++ b/x-pack/plugins/triggers_actions_ui/public/types.ts @@ -10,6 +10,7 @@ import type { DocLinksStart } from 'kibana/public'; import { ComponentType } from 'react'; import { ChartsPluginSetup } from 'src/plugins/charts/public'; import { DataPublicPluginStart } from 'src/plugins/data/public'; +import { IconType } from '@elastic/eui'; import { ActionType, AlertHistoryEsIndexConnectorId, @@ -103,7 +104,7 @@ export interface Sorting { export interface ActionTypeModel { id: string; - iconClass: string; + iconClass: IconType; selectMessage: string; actionTypeTitle?: string; validateConnector: ( @@ -247,3 +248,50 @@ export interface AlertTypeModel void; + actionTypes?: ActionType[]; + onTestConnector?: (connector: ActionConnector) => void; + reloadConnectors?: () => Promise; + consumer?: string; + actionTypeRegistry: ActionTypeRegistryContract; +} +export enum EditConectorTabs { + Configuration = 'configuration', + Test = 'test', +} + +export interface ConnectorEditFlyoutProps { + initialConnector: ActionConnector; + onClose: () => void; + tab?: EditConectorTabs; + reloadConnectors?: () => Promise; + consumer?: string; + actionTypeRegistry: ActionTypeRegistryContract; +} + +export interface AlertEditProps> { + initialAlert: Alert; + alertTypeRegistry: AlertTypeRegistryContract; + actionTypeRegistry: ActionTypeRegistryContract; + onClose: (reason: AlertFlyoutCloseReason) => void; + /** @deprecated use `onSave` as a callback after an alert is saved*/ + reloadAlerts?: () => Promise; + onSave?: () => Promise; + metadata?: MetaData; +} + +export interface AlertAddProps> { + consumer: string; + alertTypeRegistry: AlertTypeRegistryContract; + actionTypeRegistry: ActionTypeRegistryContract; + onClose: (reason: AlertFlyoutCloseReason) => void; + alertTypeId?: string; + canChangeTrigger?: boolean; + initialValues?: Partial; + /** @deprecated use `onSave` as a callback after an alert is saved*/ + reloadAlerts?: () => Promise; + onSave?: () => Promise; + metadata?: MetaData; +} From 3abd58b947a4d6249aea6842eb2720290a585909 Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Sat, 22 May 2021 09:15:17 -0700 Subject: [PATCH 05/14] fixed type checks and translations --- .../translations/translations/ja-JP.json | 28 ------------------- .../translations/translations/zh-CN.json | 28 ------------------- .../sections/alert_form/alert_add.test.tsx | 3 +- .../public/common/constants/index.ts | 4 +-- .../triggers_actions_ui/public/mocks.ts | 13 +++++---- 5 files changed, 12 insertions(+), 64 deletions(-) diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json index 795a61e8626018..58ba2a8d0c8f8c 100644 --- a/x-pack/plugins/translations/translations/ja-JP.json +++ b/x-pack/plugins/translations/translations/ja-JP.json @@ -23670,19 +23670,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": "アラートステータスが変更されるときにアクションを実行します。", @@ -23700,37 +23687,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 index 3272e0ecfa8cf7..9ccab5cbc3271c 100644 --- a/x-pack/plugins/translations/translations/zh-CN.json +++ b/x-pack/plugins/translations/translations/zh-CN.json @@ -24035,19 +24035,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": "操作在告警状态更改时运行。", @@ -24065,37 +24052,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/triggers_actions_ui/public/application/sections/alert_form/alert_add.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_add.test.tsx index a2463d785a3ebf..cb43c168aa999d 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_add.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alert_form/alert_add.test.tsx @@ -12,11 +12,12 @@ import { act } from 'react-dom/test-utils'; import { FormattedMessage } from '@kbn/i18n/react'; import { EuiFormLabel } from '@elastic/eui'; import { coreMock } from '../../../../../../../src/core/public/mocks'; -import AlertAdd, { AlertAddProps } from './alert_add'; +import AlertAdd from './alert_add'; import { createAlert } from '../../lib/alert_api'; import { actionTypeRegistryMock } from '../../action_type_registry.mock'; import { Alert, + AlertAddProps, AlertFlyoutCloseReason, ConnectorValidationResult, GenericValidationResult, diff --git a/x-pack/plugins/triggers_actions_ui/public/common/constants/index.ts b/x-pack/plugins/triggers_actions_ui/public/common/constants/index.ts index b3281589a0f3c7..c2523dd59821d9 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/constants/index.ts +++ b/x-pack/plugins/triggers_actions_ui/public/common/constants/index.ts @@ -5,8 +5,8 @@ * 2.0. */ -export type { COMPARATORS, builtInComparators } from './comparators'; -export type { AGGREGATION_TYPES, builtInAggregationTypes } from './aggregation_types'; +export { COMPARATORS, builtInComparators } from './comparators'; +export { AGGREGATION_TYPES, builtInAggregationTypes } from './aggregation_types'; export { builtInGroupByTypes } from './group_by_types'; export const VIEW_LICENSE_OPTIONS_LINK = 'https://www.elastic.co/subscriptions'; diff --git a/x-pack/plugins/triggers_actions_ui/public/mocks.ts b/x-pack/plugins/triggers_actions_ui/public/mocks.ts index 9666f8ab1b16b5..dfc1cc88e15bcf 100644 --- a/x-pack/plugins/triggers_actions_ui/public/mocks.ts +++ b/x-pack/plugins/triggers_actions_ui/public/mocks.ts @@ -5,10 +5,6 @@ * 2.0. */ -import type { ConnectorAddFlyoutProps } from './application/sections/action_connector_form/connector_add_flyout'; -import type { ConnectorEditFlyoutProps } from './application/sections/action_connector_form/connector_edit_flyout'; -import type { AlertAddProps } from './application/sections/alert_form/alert_add'; -import type { AlertEditProps } from './application/sections/alert_form/alert_edit'; import type { TriggersAndActionsUIPublicPluginStart } from './plugin'; import { getAddConnectorFlyoutLazy } from './common/get_add_connector_flyout'; @@ -17,7 +13,14 @@ import { getAddAlertFlyoutLazy } from './common/get_add_alert_flyout'; import { getEditAlertFlyoutLazy } from './common/get_edit_alert_flyout'; import { TypeRegistry } from './application/type_registry'; -import { ActionTypeModel, AlertTypeModel } from './types'; +import { + ActionTypeModel, + AlertAddProps, + AlertEditProps, + AlertTypeModel, + ConnectorAddFlyoutProps, + ConnectorEditFlyoutProps, +} from './types'; function createStartMock(): TriggersAndActionsUIPublicPluginStart { const actionTypeRegistry = new TypeRegistry(); From 92f71bebd9e1c318158fc7f4007e656d0928864a Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Sat, 22 May 2021 16:53:04 -0700 Subject: [PATCH 06/14] fixed type checks --- x-pack/plugins/triggers_actions_ui/public/index.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/x-pack/plugins/triggers_actions_ui/public/index.ts b/x-pack/plugins/triggers_actions_ui/public/index.ts index f2805b7f6fefa4..c5516e4be3bb6a 100644 --- a/x-pack/plugins/triggers_actions_ui/public/index.ts +++ b/x-pack/plugins/triggers_actions_ui/public/index.ts @@ -23,7 +23,11 @@ export type { AlertTypeParams, } from './types'; -export { ActionForm } from './application/sections/action_connector_form'; +export { + ActionForm, + ConnectorAddFlyout, + ConnectorEditFlyout, +} from './application/sections/action_connector_form'; export * from './common'; From 41c25e8cf4fb44b37fdff3aa4288f19b495e9fec Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Sat, 22 May 2021 21:39:54 -0700 Subject: [PATCH 07/14] fixed type checks --- x-pack/plugins/cases/public/components/connectors/types.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/x-pack/plugins/cases/public/components/connectors/types.ts b/x-pack/plugins/cases/public/components/connectors/types.ts index fc2f66d331700c..1657153ab645bd 100644 --- 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 { From 552e923d2715a198a0a406c0b023e06307986725 Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Sun, 23 May 2021 14:24:23 -0700 Subject: [PATCH 08/14] fixed type checks --- x-pack/plugins/triggers_actions_ui/public/index.ts | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/x-pack/plugins/triggers_actions_ui/public/index.ts b/x-pack/plugins/triggers_actions_ui/public/index.ts index c5516e4be3bb6a..134627929e4a02 100644 --- a/x-pack/plugins/triggers_actions_ui/public/index.ts +++ b/x-pack/plugins/triggers_actions_ui/public/index.ts @@ -29,6 +29,10 @@ export { ConnectorEditFlyout, } from './application/sections/action_connector_form'; +export type { ActionGroupWithCondition } from './application/sections'; + +export { AlertConditions, AlertConditionsGroup } from './application/sections'; + export * from './common'; export function plugin() { @@ -38,6 +42,8 @@ export function plugin() { export { Plugin }; export * from './plugin'; +export { loadActionTypes } from './application/lib/action_connector_api/connector_types'; + export type { TIME_UNITS } from './application/constants'; export { getTimeUnitLabel } from './common/lib/get_time_unit_label'; export type { TriggersAndActionsUiServices } from '../public/application/app'; From 08e19488f76dad97ffb521585aaa1550da539d80 Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Sun, 23 May 2021 17:37:02 -0700 Subject: [PATCH 09/14] fixed tests --- .../connectors_dropdown.test.tsx | 40 ++++++++++++++++--- .../pagerduty/pagerduty.test.tsx | 2 +- .../actions_connectors_list.test.tsx | 3 +- 3 files changed, 38 insertions(+), 7 deletions(-) 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 index 0070bc18dfe121..86f80f772944aa 100644 --- 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', () => { > @@ -96,7 +103,14 @@ describe('ConnectorsDropdown', () => { > @@ -119,7 +133,14 @@ describe('ConnectorsDropdown', () => { > @@ -142,7 +163,14 @@ describe('ConnectorsDropdown', () => { > @@ -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/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.test.tsx index 7a60d79d331379..eae8690dbdd988 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty.test.tsx @@ -25,7 +25,7 @@ beforeAll(() => { describe('actionTypeRegistry.get() works', () => { test('action type static data is as expected', () => { expect(actionTypeModel.id).toEqual(ACTION_TYPE_ID); - expect(actionTypeModel.iconClass).toEqual('test-file-stub'); + expect(actionTypeModel.actionTypeTitle).toEqual('Send to PagerDuty'); }); }); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx index 14ccfd64a06e84..6c061084c96e70 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx @@ -260,7 +260,8 @@ describe('actions_connectors_list component with items', () => { await setup(); await wrapper.find('[data-test-subj="edit1"]').first().simulate('click'); - expect(wrapper.find('ConnectorEditFlyout')).toHaveLength(1); + const edit = await wrapper.find('ConnectorEditFlyout'); + expect(edit).toHaveLength(1); }); }); From e2b9a5511e83425db0d847c7f646b532ea37caa9 Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Mon, 24 May 2021 09:45:00 -0700 Subject: [PATCH 10/14] fixed tests --- .../builtin_action_types/jira/logo.tsx | 4 +- .../builtin_action_types/pagerduty/logo.tsx | 6 +-- .../builtin_action_types/servicenow/logo.tsx | 42 ++++++++++--------- .../builtin_action_types/teams/logo.tsx | 6 +-- .../action_connector_form/action_form.tsx | 10 ++++- .../connector_edit_flyout.tsx | 2 +- .../actions_connectors_list.test.tsx | 2 +- .../components/actions_connectors_list.tsx | 5 ++- 8 files changed, 42 insertions(+), 35 deletions(-) diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx index 2e8f1d5ef3bd70..da474ebf0fc2ad 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx @@ -16,10 +16,10 @@ const Logo = () => ( xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" > - + - + ( id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" - x="0px" - y="0px" + x="0" + y="0" viewBox="0 0 120.6 175" - enableBackground="new 0 0 120.6 175" + enableBackground="0 0 120.6 175" xmlSpace="preserve" width="32" height="32" diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.tsx index 723ea598ec2623..f7f79d387c62c4 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/servicenow/logo.tsx @@ -7,25 +7,27 @@ import React from 'react'; -const Logo = () => ( - - - - - -); +function Logo() { + return ( + + + + + + ); +} // eslint-disable-next-line import/no-default-export -export { Logo as default }; +export default Logo; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/logo.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/logo.tsx index 935a0a26eaa138..42b1fa2c2a0da3 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/logo.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/teams/logo.tsx @@ -13,17 +13,15 @@ const Logo = () => ( id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" - x="0px" - y="0px" + x="0" + y="0" width="32px" height="32px" viewBox="0 0 32 32" enableBackground="new 0 0 32 32" xmlSpace="preserve" > - {' '} addActionType(item)} > - + {item.iconClass}) as unknown) as IconType + } + /> ); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx index d74af24c83dcdc..66a4dcc452c518 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/connector_edit_flyout.tsx @@ -45,7 +45,7 @@ import './connector_edit_flyout.scss'; import { useKibana } from '../../../common/lib/kibana'; import { getConnectorWithInvalidatedFields } from '../../lib/value_validators'; -export const ConnectorEditFlyout = ({ +const ConnectorEditFlyout = ({ initialConnector, onClose, tab = EditConectorTabs.Configuration, diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx index 6c061084c96e70..7b6453e705ec38 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.test.tsx @@ -8,7 +8,7 @@ import * as React from 'react'; import { mountWithIntl, nextTick } from '@kbn/test/jest'; -import { ActionsConnectorsList } from './actions_connectors_list'; +import ActionsConnectorsList from './actions_connectors_list'; import { coreMock } from '../../../../../../../../src/core/public/mocks'; import { ReactWrapper } from 'enzyme'; import { act } from 'react-dom/test-utils'; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx index 317cabd2129a59..c237bbda486584 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/actions_connectors_list/components/actions_connectors_list.tsx @@ -25,7 +25,6 @@ import { i18n } from '@kbn/i18n'; import { omit } from 'lodash'; import { FormattedMessage } from '@kbn/i18n/react'; import { loadAllActions, loadActionTypes, deleteActions } from '../../../lib/action_connector_api'; -import { ConnectorAddFlyout, ConnectorEditFlyout } from '../../action_connector_form'; import { hasDeleteActionsCapability, hasSaveActionsCapability, @@ -44,8 +43,10 @@ import { EmptyConnectorsPrompt } from '../../../components/prompts/empty_connect import { useKibana } from '../../../../common/lib/kibana'; import { DEFAULT_HIDDEN_ACTION_TYPES } from '../../../../'; import { CenterJustifiedSpinner } from '../../../components/center_justified_spinner'; +import ConnectorEditFlyout from '../../action_connector_form/connector_edit_flyout'; +import ConnectorAddFlyout from '../../action_connector_form/connector_add_flyout'; -export const ActionsConnectorsList: React.FunctionComponent = () => { +const ActionsConnectorsList: React.FunctionComponent = () => { const { http, notifications: { toasts }, From 3c3202484ca5f4cbc713b990b662f684f856fc6d Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Mon, 24 May 2021 10:12:02 -0700 Subject: [PATCH 11/14] fixed iconClass --- .../sections/action_connector_form/action_form.tsx | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx index 6ece847306a6ff..e45e3fbf1a1095 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { Suspense, useState, useEffect, useCallback } from 'react'; +import React, { useState, useEffect, useCallback } from 'react'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; import { @@ -19,7 +19,6 @@ import { EuiToolTip, EuiLink, } from '@elastic/eui'; -import { IconType } from '@elastic/eui/src/components/icon/icon'; import { loadActionTypes, loadAllActions as loadConnectors } from '../../lib/action_connector_api'; import { ActionTypeModel, @@ -44,6 +43,7 @@ import { ActionGroup, AlertActionParam } from '../../../../../alerting/common'; import { useKibana } from '../../../common/lib/kibana'; import { DefaultActionParamsGetter } from '../../lib/get_defaults_for_action_params'; import { ConnectorAddModal } from '.'; +import { suspendedComponentWithProps } from '../../lib/suspended_component_with_props'; export interface ActionGroupWithMessageVariables extends ActionGroup { omitOptionalMessageVariables?: boolean; @@ -275,7 +275,9 @@ export const ActionForm = ({ {item.iconClass}) as unknown) as IconType + typeof item.iconClass === 'string' + ? item.iconClass + : suspendedComponentWithProps(item.iconClass as React.ComponentType) } /> From 3cfe9b214b32460e89086cb6802b1018e13e365b Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Mon, 24 May 2021 14:00:50 -0700 Subject: [PATCH 12/14] fixed due to comments --- .../builtin_action_types/jira/logo.tsx | 4 +- .../sections/alert_form/alert_form.tsx | 63 +++++++++---------- 2 files changed, 32 insertions(+), 35 deletions(-) diff --git a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx index da474ebf0fc2ad..2e8f1d5ef3bd70 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/logo.tsx @@ -16,10 +16,10 @@ const Logo = () => ( xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" > - + - + alertTypeGroupCompare(a, b, solutions)) .map(([solution, items], groupIndex) => ( - <> + ); return ( - <> - - {alertTypeListItemHtml} - - ) + + {alertTypeListItemHtml} + + ) + } + isDisabled={!item.checkEnabledResult.isEnabled} + onClick={() => { + setAlertProperty('alertTypeId', item.id); + setActions([]); + setAlertTypeModel(item.alertTypeItem); + setAlertProperty('params', {}); + if (alertTypesIndex && alertTypesIndex.has(item.id)) { + setDefaultActionGroupId(alertTypesIndex.get(item.id)!.defaultActionGroupId); } - isDisabled={!item.checkEnabledResult.isEnabled} - onClick={() => { - setAlertProperty('alertTypeId', item.id); - setActions([]); - setAlertTypeModel(item.alertTypeItem); - setAlertProperty('params', {}); - if (alertTypesIndex && alertTypesIndex.has(item.id)) { - setDefaultActionGroupId(alertTypesIndex.get(item.id)!.defaultActionGroupId); - } - }} - /> - + }} + /> ); })} - + )); const alertTypeDetails = ( From a80b8da6bd58127f691ddd3f0e9d771bca8b6271 Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Mon, 24 May 2021 14:27:40 -0700 Subject: [PATCH 13/14] added info about new IconType to readme file --- x-pack/plugins/triggers_actions_ui/README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/x-pack/plugins/triggers_actions_ui/README.md b/x-pack/plugins/triggers_actions_ui/README.md index 3748fc4509f9d9..7d736218af2d99 100644 --- a/x-pack/plugins/triggers_actions_ui/README.md +++ b/x-pack/plugins/triggers_actions_ui/README.md @@ -1073,7 +1073,7 @@ Action type model definition: export function getActionType(): ActionTypeModel { return { id: '.pagerduty', - iconClass: 'apps', + iconClass: lazy(() => import('./logo')), selectMessage: i18n.translate( 'xpack.triggersActionsUI.components.builtinActionTypes.pagerDutyAction.selectMessageText', { @@ -1110,7 +1110,7 @@ and action params form available in Create Alert form: Each action type should be defined as an `ActionTypeModel` object with the following properties: ``` id: string; - iconClass: string; + iconClass: IconType; selectMessage: string; actionTypeTitle?: string; validateConnector: (connector: any) => ValidationResult; @@ -1121,7 +1121,7 @@ Each action type should be defined as an `ActionTypeModel` object with the follo |Property|Description| |---|---| |id|Action type id. Should be the same as on server side.| -|iconClass|Icon of action type, that will be displayed on the select card in UI.| +|iconClass|Setting for icon to be displayed to the user. EUI supports any known EUI icon, SVG URL, or a lazy loaded React component, ReactElement.| |selectMessage|Short description of action type responsibility, that will be displayed on the select card in UI.| |validateConnector|Validation function for action connector.| |validateParams|Validation function for action params.| From 9b85dfcd602dc8c0de348b52c0128a7e110f4fcc Mon Sep 17 00:00:00 2001 From: Yuliia Naumenko Date: Tue, 25 May 2021 13:59:12 -0700 Subject: [PATCH 14/14] fixed key errors --- .../action_connector_form/action_form.tsx | 76 ++++----- .../action_type_form.tsx | 145 +++++++++--------- .../alerts_list/components/type_filter.tsx | 12 +- .../common/expression_items/threshold.tsx | 8 +- 4 files changed, 118 insertions(+), 123 deletions(-) diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx index e45e3fbf1a1095..e9f79633ef5207 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useState, useEffect, useCallback } from 'react'; +import React, { Fragment, useState, useEffect, useCallback } from 'react'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; import { @@ -362,42 +362,44 @@ export const ActionForm = ({ ?.validateParams(actionItem.params); return ( - { - setActiveActionItem({ actionTypeId: actionItem.actionTypeId, indices: [index] }); - setAddModalVisibility(true); - }} - onConnectorSelected={(id: string) => { - setActionIdByIndex(id, index); - }} - actionTypeRegistry={actionTypeRegistry} - onDeleteAction={() => { - const updatedActions = actions.filter( - (_item: AlertAction, i: number) => i !== index - ); - setActions(updatedActions); - setIsAddActionPanelOpen( - updatedActions.filter((item: AlertAction) => item.id !== actionItem.id).length === - 0 - ); - setActiveActionItem(undefined); - }} - /> + + { + setActiveActionItem({ actionTypeId: actionItem.actionTypeId, indices: [index] }); + setAddModalVisibility(true); + }} + onConnectorSelected={(id: string) => { + setActionIdByIndex(id, index); + }} + actionTypeRegistry={actionTypeRegistry} + onDeleteAction={() => { + const updatedActions = actions.filter( + (_item: AlertAction, i: number) => i !== index + ); + setActions(updatedActions); + setIsAddActionPanelOpen( + updatedActions.filter((item: AlertAction) => item.id !== actionItem.id) + .length === 0 + ); + setActiveActionItem(undefined); + }} + /> + + ); })} diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx index ac9d989db03f6c..2690aeaffad324 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_type_form.tsx @@ -311,83 +311,80 @@ export const ActionTypeForm = ({ ); return ( - <> - - - - - - -
- + + + + + + +
+ + + + + {selectedActionGroup && !isOpen && ( - + {selectedActionGroup.name} - {selectedActionGroup && !isOpen && ( - - {selectedActionGroup.name} - + )} + + {checkEnabledResult.isEnabled === false && ( + <> + + )} - - {checkEnabledResult.isEnabled === false && ( - <> - - - )} - - -
- - - - } - extraAction={ - - } - > - {accordionContent} - - - + + +
+ + + + } + extraAction={ + + } + > + {accordionContent} + ); }; diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/type_filter.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/type_filter.tsx index 0aa38486952ca4..cadfbece849b8f 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/type_filter.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_list/components/type_filter.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useEffect, useState } from 'react'; +import React, { Fragment, useEffect, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { EuiFilterGroup, @@ -63,12 +63,8 @@ export const TypeFilter: React.FunctionComponent = ({ >
{options.map((groupItem, groupIndex) => ( - <> - + +

{groupItem.groupName}

 {groupItem.subOptions.map((item, index) => ( @@ -88,7 +84,7 @@ export const TypeFilter: React.FunctionComponent = ({ {item.name} ))} - + ))}
diff --git a/x-pack/plugins/triggers_actions_ui/public/common/expression_items/threshold.tsx b/x-pack/plugins/triggers_actions_ui/public/common/expression_items/threshold.tsx index e70fc8dcef4491..5c44b6f29178b3 100644 --- a/x-pack/plugins/triggers_actions_ui/public/common/expression_items/threshold.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/common/expression_items/threshold.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useEffect, useState } from 'react'; +import React, { Fragment, useEffect, useState } from 'react'; import { i18n } from '@kbn/i18n'; import { EuiExpression, @@ -134,7 +134,7 @@ export const ThresholdExpression = ({ {Array.from(Array(numRequiredThresholds)).map((_notUsed, i) => { return ( - <> + {i > 0 ? ( {andThresholdText} ) : null} - + 0 || !threshold[i]} error={errors[`threshold${i}`]} @@ -167,7 +167,7 @@ export const ThresholdExpression = ({ /> - + ); })}