[Uptime] Use React.lazy for alert type registration (#66829)

* Use React.lazy for alert type registration.

* Add typing to TLS alert component.

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
Justin Kambic 2020-05-19 14:58:01 -04:00 committed by GitHub
parent a8b1a6b924
commit b15578cbdf
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 16 additions and 6 deletions

View file

@ -21,13 +21,13 @@ interface Props {
};
}
export const AlertMonitorStatus = ({
export const AlertMonitorStatus: React.FC<Props> = ({
autocomplete,
enabled,
numTimes,
setAlertParams,
timerange,
}: Props) => {
}) => {
const { filters, locations } = useSelector(selectMonitorStatusAlert);
return (
<AlertMonitorStatusComponent
@ -41,3 +41,6 @@ export const AlertMonitorStatus = ({
/>
);
};
// eslint-disable-next-line import/no-default-export
export { AlertMonitorStatus as default };

View file

@ -10,7 +10,7 @@ import { AlertTlsComponent } from '../alert_tls';
import { setAlertFlyoutVisible } from '../../../../state/actions';
import { selectDynamicSettings } from '../../../../state/selectors';
export const AlertTls = () => {
export const AlertTls: React.FC<{}> = () => {
const dispatch = useDispatch();
const setFlyoutVisible = useCallback((value: boolean) => dispatch(setAlertFlyoutVisible(value)), [
dispatch,
@ -24,3 +24,6 @@ export const AlertTls = () => {
/>
);
};
// eslint-disable-next-line import/no-default-export
export { AlertTls as default };

View file

@ -11,7 +11,6 @@ import { isRight } from 'fp-ts/lib/Either';
import { AlertTypeModel } from '../../../../triggers_actions_ui/public';
import { AlertTypeInitializer } from '.';
import { StatusCheckExecutorParamsType } from '../../../common/runtime_types';
import { AlertMonitorStatus } from '../../components/overview/alerts/alerts_containers';
import { MonitorStatusTitle } from './monitor_status_title';
import { CLIENT_ALERT_TYPES } from '../../../common/constants';
import { MonitorStatusTranslations } from './translations';
@ -57,6 +56,10 @@ export const validate = (alertParams: any) => {
const { defaultActionMessage } = MonitorStatusTranslations;
const AlertMonitorStatus = React.lazy(() =>
import('../../components/overview/alerts/alerts_containers/alert_monitor_status')
);
export const initMonitorStatusAlertType: AlertTypeInitializer = ({
autocomplete,
}): AlertTypeModel => ({

View file

@ -9,14 +9,15 @@ import { AlertTypeModel } from '../../../../triggers_actions_ui/public';
import { CLIENT_ALERT_TYPES } from '../../../common/constants';
import { TlsTranslations } from './translations';
import { AlertTypeInitializer } from '.';
import { AlertTls } from '../../components/overview/alerts/alerts_containers/alert_tls';
const { name, defaultActionMessage } = TlsTranslations;
export const initTlsAlertType: AlertTypeInitializer = (): AlertTypeModel => ({
id: CLIENT_ALERT_TYPES.TLS,
iconClass: 'uptimeApp',
alertParamsExpression: () => <AlertTls />,
alertParamsExpression: React.lazy(() =>
import('../../components/overview/alerts/alerts_containers/alert_tls')
),
name,
validate: () => ({ errors: {} }),
defaultActionMessage,