External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-01-17 20:51:21 -03:30
Code Issues Packages Projects Releases Wiki Activity

Add tooltips to Instance form; change name field to host name. (#12912)

Browse Source
This commit is contained in:
kialam 2022-09-28 06:22:49 -07:00 committed by GitHub
parent 6b86c450b1
commit ceea0a0a39
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 20 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
awx/ui/src/screens/Instances/Shared/InstanceForm.js
View File

@ -1,25 +1,21 @@
import React from 'react';
import { t } from '@lingui/macro';
import { Formik, useField } from 'formik';
import {
Form,
FormGroup,
CardBody,
Switch,
Popover,
} from '@patternfly/react-core';
import { Formik } from 'formik';
import { Form, FormGroup, CardBody } from '@patternfly/react-core';
import { FormColumnLayout } from 'components/FormLayout';
import FormField, { FormSubmitError } from 'components/FormField';
import FormField, {
FormSubmitError,
CheckboxField,
} from 'components/FormField';
import FormActionGroup from 'components/FormActionGroup';
import { required } from 'util/validators';
function InstanceFormFields() {
const [enabled, , enabledHelpers] = useField('enabled');
return (
<>
<FormField
id="name"
label={t`Name`}
id="hostname"
label={t`Host Name`}
name="hostname"
type="text"
validate={required(null)}
@ -36,6 +32,7 @@ function InstanceFormFields() {
label={t`Instance State`}
name="node_state"
type="text"
tooltip={t`Sets the current life cycle stage of this instance. Default is "installed."`}
isDisabled
/>
<FormField
@ -43,6 +40,7 @@ function InstanceFormFields() {
label={t`Listener Port`}
name="listener_port"
type="number"
tooltip={t`Select the port that Receptor will listen on for incoming connections. Default is 27199.`}
isRequired
/>
<FormField
@ -50,27 +48,15 @@ function InstanceFormFields() {
label={t`Instance Type`}
name="node_type"
type="text"
tooltip={t`Sets the role that this instance will play within mesh topology. Default is "execution."`}
isDisabled
/>
<FormGroup
label={t`Enable Instance`}
aria-label={t`Enable Instance`}
labelIcon={
<Popover
content={t`If enabled, the instance will be ready to accept work.`}
/>
}
>
<Switch
css="display: inline-flex;"
<FormGroup fieldId="instance-option-checkboxes" label={t`Options`}>
<CheckboxField
id="enabled"
label={t`Enabled`}
labelOff={t`Disabled`}
isChecked={enabled.value}
onChange={() => {
enabledHelpers.setValue(!enabled.value);
}}
ouiaId="enable-instance-switch"
name="enabled"
label={t`Enable Instance`}
tooltip={t`Set the instance enabled or disabled. If disabled, jobs will not be assigned to this instance.`}
/>
</FormGroup>
</>

8
awx/ui/src/screens/Instances/Shared/InstanceForm.test.js
View File

@ -40,7 +40,7 @@ describe('<InstanceForm />', () => {
test('should display form fields properly', async () => {
await waitForElement(wrapper, 'InstanceForm', (el) => el.length > 0);
expect(wrapper.find('FormGroup[label="Name"]').length).toBe(1);
expect(wrapper.find('FormGroup[label="Host Name"]').length).toBe(1);
expect(wrapper.find('FormGroup[label="Description"]').length).toBe(1);
expect(wrapper.find('FormGroup[label="Instance State"]').length).toBe(1);
expect(wrapper.find('FormGroup[label="Listener Port"]').length).toBe(1);
@ -49,13 +49,13 @@ describe('<InstanceForm />', () => {
test('should update form values', async () => {
await act(async () => {
wrapper.find('input#name').simulate('change', {
wrapper.find('input#hostname').simulate('change', {
target: { value: 'new Foo', name: 'hostname' },
});
});
wrapper.update();
expect(wrapper.find('input#name').prop('value')).toEqual('new Foo');
expect(wrapper.find('input#hostname').prop('value')).toEqual('new Foo');
});
test('should call handleCancel when Cancel button is clicked', async () => {
@ -68,7 +68,7 @@ describe('<InstanceForm />', () => {
test('should call handleSubmit when Cancel button is clicked', async () => {
expect(handleSubmit).not.toHaveBeenCalled();
await act(async () => {
wrapper.find('input#name').simulate('change', {
wrapper.find('input#hostname').simulate('change', {
target: { value: 'new Foo', name: 'hostname' },
});
wrapper.find('input#instance-description').simulate('change', {