mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 09:48:58 -04:00
[Synthetics] Add Enabled toggle to monitor add/edit form (#140125)
* Add enabled feature to add/edit page. * Update tests for new logic. * Move enabled form field to bottom of group. * Change copy to correspond to updated description. * Fix punctuation. Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
parent
49d49b67a1
commit
e838bb6dc8
4 changed files with 102 additions and 71 deletions
|
@ -411,6 +411,28 @@ export const FIELD: Record<string, FieldMeta> = {
|
|||
};
|
||||
},
|
||||
},
|
||||
[ConfigKey.ENABLED]: {
|
||||
fieldKey: ConfigKey.ENABLED,
|
||||
component: EuiSwitch,
|
||||
label: i18n.translate('xpack.synthetics.monitorConfig.enabled.label', {
|
||||
defaultMessage: 'Enable Monitor',
|
||||
}),
|
||||
controlled: true,
|
||||
props: ({ isEdit, setValue }) => ({
|
||||
id: 'syntheticsMontiorConfigIsEnabled',
|
||||
label: isEdit
|
||||
? i18n.translate('xpack.synthetics.monitorConfig.edit.enabled.label', {
|
||||
defaultMessage: 'Disabled monitors do not run tests.',
|
||||
})
|
||||
: i18n.translate('xpack.synthetics.monitorConfig.create.enabled.label', {
|
||||
defaultMessage:
|
||||
'Disabled monitors do not run tests. You can create a disabled monitor and enable it later.',
|
||||
}),
|
||||
onChange: (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||
setValue(ConfigKey.ENABLED, !!event.target.checked);
|
||||
},
|
||||
}),
|
||||
},
|
||||
[ConfigKey.TAGS]: {
|
||||
fieldKey: ConfigKey.TAGS,
|
||||
component: ComboBox,
|
||||
|
|
|
@ -149,6 +149,7 @@ export const FORM_CONFIG: FieldConfig = {
|
|||
FIELD[ConfigKey.SCHEDULE],
|
||||
FIELD[ConfigKey.MAX_REDIRECTS],
|
||||
FIELD[ConfigKey.TIMEOUT],
|
||||
FIELD[ConfigKey.ENABLED],
|
||||
],
|
||||
advanced: [
|
||||
DEFAULT_DATA_OPTIONS,
|
||||
|
@ -166,6 +167,7 @@ export const FORM_CONFIG: FieldConfig = {
|
|||
FIELD[ConfigKey.LOCATIONS],
|
||||
FIELD[ConfigKey.SCHEDULE],
|
||||
FIELD[ConfigKey.TIMEOUT],
|
||||
FIELD[ConfigKey.ENABLED],
|
||||
],
|
||||
advanced: [
|
||||
DEFAULT_DATA_OPTIONS,
|
||||
|
@ -181,6 +183,7 @@ export const FORM_CONFIG: FieldConfig = {
|
|||
FIELD[ConfigKey.LOCATIONS],
|
||||
FIELD[ConfigKey.SCHEDULE],
|
||||
FIELD[ConfigKey.THROTTLING_CONFIG],
|
||||
FIELD[ConfigKey.ENABLED],
|
||||
],
|
||||
step3: [FIELD[ConfigKey.SOURCE_INLINE]],
|
||||
scriptEdit: [FIELD[ConfigKey.SOURCE_INLINE]],
|
||||
|
@ -205,6 +208,7 @@ export const FORM_CONFIG: FieldConfig = {
|
|||
FIELD[ConfigKey.LOCATIONS],
|
||||
FIELD[ConfigKey.SCHEDULE],
|
||||
FIELD[ConfigKey.THROTTLING_CONFIG],
|
||||
FIELD[ConfigKey.ENABLED],
|
||||
],
|
||||
advanced: [
|
||||
{
|
||||
|
@ -227,6 +231,7 @@ export const FORM_CONFIG: FieldConfig = {
|
|||
FIELD[ConfigKey.SCHEDULE],
|
||||
FIELD[ConfigKey.WAIT],
|
||||
FIELD[ConfigKey.TIMEOUT],
|
||||
FIELD[ConfigKey.ENABLED],
|
||||
],
|
||||
advanced: [DEFAULT_DATA_OPTIONS],
|
||||
},
|
||||
|
|
|
@ -8,81 +8,85 @@
|
|||
import { format } from './formatter';
|
||||
|
||||
describe('format', () => {
|
||||
const formValues = {
|
||||
type: 'http',
|
||||
form_monitor_type: 'http',
|
||||
enabled: true,
|
||||
schedule: {
|
||||
number: '3',
|
||||
unit: 'm',
|
||||
},
|
||||
'service.name': '',
|
||||
tags: [],
|
||||
timeout: '16',
|
||||
name: 'Sample name',
|
||||
locations: [
|
||||
{
|
||||
id: 'us_central',
|
||||
isServiceManaged: true,
|
||||
let formValues: Record<string, unknown>;
|
||||
beforeEach(() => {
|
||||
formValues = {
|
||||
type: 'http',
|
||||
form_monitor_type: 'http',
|
||||
enabled: true,
|
||||
schedule: {
|
||||
number: '3',
|
||||
unit: 'm',
|
||||
},
|
||||
],
|
||||
namespace: 'default',
|
||||
origin: 'ui',
|
||||
__ui: {
|
||||
is_tls_enabled: false,
|
||||
},
|
||||
urls: 'sample url',
|
||||
max_redirects: '0',
|
||||
password: '',
|
||||
proxy_url: '',
|
||||
'check.response.body.negative': [],
|
||||
'check.response.body.positive': [],
|
||||
'response.include_body': 'on_error',
|
||||
'check.response.headers': {},
|
||||
'response.include_headers': true,
|
||||
'check.response.status': [],
|
||||
'check.request.body': {
|
||||
value: '',
|
||||
type: 'text',
|
||||
},
|
||||
'check.request.headers': {},
|
||||
'check.request.method': 'GET',
|
||||
username: '',
|
||||
'ssl.certificate_authorities': '',
|
||||
'ssl.certificate': '',
|
||||
'ssl.key': '',
|
||||
'ssl.key_passphrase': '',
|
||||
'ssl.verification_mode': 'full',
|
||||
'ssl.supported_protocols': ['TLSv1.1', 'TLSv1.2', 'TLSv1.3'],
|
||||
isTLSEnabled: false,
|
||||
service: {
|
||||
name: '',
|
||||
},
|
||||
check: {
|
||||
request: {
|
||||
method: 'GET',
|
||||
headers: {},
|
||||
body: {
|
||||
type: 'text',
|
||||
value: '',
|
||||
'service.name': '',
|
||||
tags: [],
|
||||
timeout: '16',
|
||||
name: 'Sample name',
|
||||
locations: [
|
||||
{
|
||||
id: 'us_central',
|
||||
isServiceManaged: true,
|
||||
},
|
||||
],
|
||||
namespace: 'default',
|
||||
origin: 'ui',
|
||||
__ui: {
|
||||
is_tls_enabled: false,
|
||||
},
|
||||
urls: 'sample url',
|
||||
max_redirects: '0',
|
||||
password: '',
|
||||
proxy_url: '',
|
||||
'check.response.body.negative': [],
|
||||
'check.response.body.positive': [],
|
||||
'response.include_body': 'on_error',
|
||||
'check.response.headers': {},
|
||||
'response.include_headers': true,
|
||||
'check.response.status': [],
|
||||
'check.request.body': {
|
||||
value: '',
|
||||
type: 'text',
|
||||
},
|
||||
'check.request.headers': {},
|
||||
'check.request.method': 'GET',
|
||||
username: '',
|
||||
'ssl.certificate_authorities': '',
|
||||
'ssl.certificate': '',
|
||||
'ssl.key': '',
|
||||
'ssl.key_passphrase': '',
|
||||
'ssl.verification_mode': 'full',
|
||||
'ssl.supported_protocols': ['TLSv1.1', 'TLSv1.2', 'TLSv1.3'],
|
||||
isTLSEnabled: false,
|
||||
service: {
|
||||
name: '',
|
||||
},
|
||||
check: {
|
||||
request: {
|
||||
method: 'GET',
|
||||
headers: {},
|
||||
body: {
|
||||
type: 'text',
|
||||
value: '',
|
||||
},
|
||||
},
|
||||
response: {
|
||||
status: [],
|
||||
headers: {},
|
||||
body: {
|
||||
positive: [],
|
||||
negative: [],
|
||||
},
|
||||
},
|
||||
},
|
||||
response: {
|
||||
status: [],
|
||||
headers: {},
|
||||
body: {
|
||||
positive: [],
|
||||
negative: [],
|
||||
},
|
||||
include_headers: true,
|
||||
include_body: 'on_error',
|
||||
},
|
||||
},
|
||||
response: {
|
||||
include_headers: true,
|
||||
include_body: 'on_error',
|
||||
},
|
||||
};
|
||||
};
|
||||
});
|
||||
|
||||
it('correctly formats form fields to monitor type', () => {
|
||||
it.each([[true], [false]])('correctly formats form fields to monitor type', (enabled) => {
|
||||
formValues.enabled = enabled;
|
||||
expect(format(formValues)).toEqual({
|
||||
__ui: {
|
||||
is_tls_enabled: false,
|
||||
|
@ -98,7 +102,7 @@ describe('format', () => {
|
|||
'check.response.body.positive': [],
|
||||
'check.response.headers': {},
|
||||
'check.response.status': [],
|
||||
enabled: true,
|
||||
enabled,
|
||||
form_monitor_type: 'http',
|
||||
locations: [
|
||||
{
|
||||
|
|
|
@ -15,7 +15,7 @@ export const formatter = (fields: Record<string, any>) => {
|
|||
Object.keys(defaults).map((key) => {
|
||||
/* split key names on dot to handle dot notation fields,
|
||||
* which are changed to nested fields by react-hook-form */
|
||||
monitorFields[key] = get(fields, key.split('.')) || defaults[key as ConfigKey];
|
||||
monitorFields[key] = get(fields, key.split('.')) ?? defaults[key as ConfigKey];
|
||||
});
|
||||
return monitorFields as MonitorFields;
|
||||
};
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue