Creates a verbosity select dropdowns and moves options constant into same file

This commit is contained in:
Alex Corey 2022-06-22 11:28:17 -04:00 committed by John Westcott IV
parent 61f483ae32
commit ef8d4e73ae
29 changed files with 21480 additions and 17903 deletions

View File

@ -14,8 +14,6 @@ import ErrorDetail from '../ErrorDetail';
import AdHocCommandsWizard from './AdHocCommandsWizard';
import ContentError from '../ContentError';
import { VERBOSE_OPTIONS } from '../../constants';
function AdHocCommands({
adHocItems,
hasListItems,
@ -154,7 +152,6 @@ function AdHocCommands({
adHocItems={adHocItems}
organizationId={organizationId}
moduleOptions={moduleOptions}
verbosityOptions={VERBOSE_OPTIONS}
credentialTypeId={credentialTypeId}
onCloseWizard={() => setIsWizardOpen(false)}
onLaunch={handleSubmit}

View File

@ -3,13 +3,13 @@ import { t } from '@lingui/macro';
import { withFormik, useFormikContext } from 'formik';
import PropTypes from 'prop-types';
import { VERBOSITY } from 'components/VerbositySelectField';
import Wizard from '../Wizard';
import useAdHocLaunchSteps from './useAdHocLaunchSteps';
function AdHocCommandsWizard({
onLaunch,
moduleOptions,
verbosityOptions,
onCloseWizard,
credentialTypeId,
organizationId,
@ -18,7 +18,6 @@ function AdHocCommandsWizard({
const { steps, validateStep, visitStep, visitAllSteps } = useAdHocLaunchSteps(
moduleOptions,
verbosityOptions,
organizationId,
credentialTypeId
);
@ -57,13 +56,13 @@ function AdHocCommandsWizard({
}
const FormikApp = withFormik({
mapPropsToValues({ adHocItems, verbosityOptions }) {
mapPropsToValues({ adHocItems }) {
const adHocItemStrings = adHocItems.map((item) => item.name).join(', ');
return {
limit: adHocItemStrings || 'all',
credentials: [],
module_args: '',
verbosity: verbosityOptions[0].value,
verbosity: VERBOSITY()[0],
forks: 0,
diff_mode: false,
become_enabled: '',
@ -79,7 +78,7 @@ const FormikApp = withFormik({
FormikApp.propTypes = {
onLaunch: PropTypes.func.isRequired,
moduleOptions: PropTypes.arrayOf(PropTypes.array).isRequired,
verbosityOptions: PropTypes.arrayOf(PropTypes.object).isRequired,
// verbosityOptions: PropTypes.arrayOf(PropTypes.object).isRequired,
onCloseWizard: PropTypes.func.isRequired,
credentialTypeId: PropTypes.number.isRequired,
};

View File

@ -6,7 +6,6 @@ import {
waitForElement,
} from '../../../testUtils/enzymeHelpers';
import AdHocCommandsWizard from './AdHocCommandsWizard';
import { VERBOSE_OPTIONS } from '../../constants';
jest.mock('../../api/models/CredentialTypes');
jest.mock('../../api/models/Inventories');
@ -38,7 +37,6 @@ describe('<AdHocCommandsWizard/>', () => {
adHocItems={adHocItems}
onLaunch={onLaunch}
moduleOptions={moduleOptions}
verbosityOptions={VERBOSE_OPTIONS}
onCloseWizard={() => {}}
credentialTypeId={1}
organizationId={1}

View File

@ -7,6 +7,7 @@ import { Form, FormGroup, Switch, Checkbox } from '@patternfly/react-core';
import styled from 'styled-components';
import { required } from 'util/validators';
import useBrandName from 'hooks/useBrandName';
import { VerbositySelectField } from 'components/VerbositySelectField';
import AnsibleSelect from '../AnsibleSelect';
import FormField from '../FormField';
import { VariablesField } from '../CodeEditor';
@ -21,7 +22,7 @@ const TooltipWrapper = styled.div`
text-align: left;
`;
function AdHocDetailsStep({ verbosityOptions, moduleOptions }) {
function AdHocDetailsStep({ moduleOptions }) {
const brandName = useBrandName();
const [moduleNameField, moduleNameMeta, moduleNameHelpers] = useField({
name: 'module_name',
@ -32,7 +33,7 @@ function AdHocDetailsStep({ verbosityOptions, moduleOptions }) {
const [diffModeField, , diffModeHelpers] = useField('diff_mode');
const [becomeEnabledField, , becomeEnabledHelpers] =
useField('become_enabled');
const [verbosityField, verbosityMeta, verbosityHelpers] = useField({
const [, verbosityMeta] = useField({
name: 'verbosity',
validate: required(null),
});
@ -122,33 +123,16 @@ function AdHocDetailsStep({ verbosityOptions, moduleOptions }) {
)
}
/>
<FormGroup
<VerbositySelectField
fieldId="verbosity"
aria-label={t`select verbosity`}
label={t`Verbosity`}
isRequired
validated={
tooltip={t`These are the verbosity levels for standard out of the command run that are supported.`}
isValid={
!verbosityMeta.touched || !verbosityMeta.error
? 'default'
: 'error'
}
helperTextInvalid={verbosityMeta.error}
labelIcon={
<Popover
content={t`These are the verbosity levels for standard out of the command run that are supported.`}
/>
}
>
<AnsibleSelect
{...verbosityField}
isValid={!verbosityMeta.touched || !verbosityMeta.error}
id="verbosity"
data={verbosityOptions || []}
onChange={(event, value) => {
verbosityHelpers.setValue(parseInt(value, 10));
}}
/>
</FormGroup>
/>
<FormField
id="limit"
name="limit"
@ -296,7 +280,7 @@ function AdHocDetailsStep({ verbosityOptions, moduleOptions }) {
AdHocDetailsStep.propTypes = {
moduleOptions: PropTypes.arrayOf(PropTypes.array).isRequired,
verbosityOptions: PropTypes.arrayOf(PropTypes.object).isRequired,
// verbosityOptions: PropTypes.arrayOf(PropTypes.object).isRequired,
};
export default AdHocDetailsStep;

View File

@ -3,6 +3,7 @@ import { t } from '@lingui/macro';
import { Tooltip } from '@patternfly/react-core';
import { ExclamationCircleIcon as PFExclamationCircleIcon } from '@patternfly/react-icons';
import styled from 'styled-components';
import { VERBOSITY } from '../VerbositySelectField';
import { toTitleCase } from '../../util/strings';
import { VariablesDetail } from '../CodeEditor';
import { jsonToYaml } from '../../util/yaml';
@ -21,7 +22,7 @@ const ErrorMessageWrapper = styled.div`
margin-bottom: 10px;
`;
function AdHocPreviewStep({ hasErrors, values }) {
const { credential, execution_environment, extra_vars } = values;
const { credential, execution_environment, extra_vars, verbosity } = values;
const items = Object.entries(values);
return (
@ -44,6 +45,7 @@ function AdHocPreviewStep({ hasErrors, values }) {
key !== 'extra_vars' &&
key !== 'execution_environment' &&
key !== 'credentials' &&
key !== 'verbosity' &&
!key.startsWith('credential_passwords') && (
<Detail key={key} label={toTitleCase(key)} value={value} />
)
@ -57,6 +59,9 @@ function AdHocPreviewStep({ hasErrors, values }) {
value={execution_environment[0]?.name}
/>
)}
{verbosity && (
<Detail label={t`Verbosity`} value={VERBOSITY()[values.verbosity]} />
)}
{extra_vars && (
<VariablesDetail
value={jsonToYaml(JSON.stringify(extra_vars))}

View File

@ -5,11 +5,7 @@ import StepName from '../LaunchPrompt/steps/StepName';
import AdHocDetailsStep from './AdHocDetailsStep';
const STEP_ID = 'details';
export default function useAdHocDetailsStep(
visited,
moduleOptions,
verbosityOptions
) {
export default function useAdHocDetailsStep(visited, moduleOptions) {
const { values, touched, setFieldError } = useFormikContext();
const hasError = () => {
@ -39,12 +35,7 @@ export default function useAdHocDetailsStep(
{t`Details`}
</StepName>
),
component: (
<AdHocDetailsStep
moduleOptions={moduleOptions}
verbosityOptions={verbosityOptions}
/>
),
component: <AdHocDetailsStep moduleOptions={moduleOptions} />,
enableNext: true,
nextButtonText: t`Next`,
},

View File

@ -24,7 +24,6 @@ function showCredentialPasswordsStep(credential) {
export default function useAdHocLaunchSteps(
moduleOptions,
verbosityOptions,
organizationId,
credentialTypeId
) {
@ -32,7 +31,7 @@ export default function useAdHocLaunchSteps(
const [visited, setVisited] = useState({});
const steps = [
useAdHocDetailsStep(visited, moduleOptions, verbosityOptions),
useAdHocDetailsStep(visited, moduleOptions),
useAdHocExecutionEnvironmentStep(organizationId),
useAdHocCredentialStep(visited, credentialTypeId),
useCredentialPasswordsStep(

View File

@ -46,7 +46,9 @@ function AnsibleSelect({
value={option.value}
label={option.label}
isDisabled={option.isDisabled}
/>
>
{option.label}
</FormSelectOption>
))}
</FormSelect>
);

View File

@ -9,7 +9,7 @@ import { TagMultiSelect } from '../../MultiSelect';
import AnsibleSelect from '../../AnsibleSelect';
import { VariablesField } from '../../CodeEditor';
import Popover from '../../Popover';
import { VERBOSE_OPTIONS } from '../../../constants';
import { VerbositySelectField } from '../../VerbositySelectField';
const FieldHeader = styled.div`
display: flex;
@ -130,28 +130,16 @@ function JobTypeField() {
}
function VerbosityField() {
const [field, meta, helpers] = useField('verbosity');
const [, meta] = useField('verbosity');
const isValid = !(meta.touched && meta.error);
return (
<FormGroup
<VerbositySelectField
fieldId="prompt-verbosity"
validated={isValid ? 'default' : 'error'}
label={t`Verbosity`}
labelIcon={
<Popover
content={t`Control the level of output ansible
tooltip={t`Control the level of output ansible
will produce as the playbook executes.`}
/>
}
>
<AnsibleSelect
id="prompt-verbosity"
data={VERBOSE_OPTIONS}
{...field}
onChange={(event, value) => helpers.setValue(value)}
/>
</FormGroup>
isValid={isValid ? 'default' : 'error'}
/>
);
}

View File

@ -14,7 +14,7 @@ import PromptProjectDetail from './PromptProjectDetail';
import PromptInventorySourceDetail from './PromptInventorySourceDetail';
import PromptJobTemplateDetail from './PromptJobTemplateDetail';
import PromptWFJobTemplateDetail from './PromptWFJobTemplateDetail';
import { VERBOSITY } from '../../constants';
import { VERBOSITY } from '../VerbositySelectField';
const PromptTitle = styled(Title)`
margin-top: var(--pf-global--spacer--xl);
@ -219,7 +219,7 @@ function PromptDetail({
launchConfig.ask_verbosity_on_launch ? (
<Detail
label={t`Verbosity`}
value={VERBOSITY[overrides.verbosity]}
value={VERBOSITY()[overrides.verbosity]}
/>
) : null}
{launchConfig.ask_tags_on_launch && (

View File

@ -13,7 +13,7 @@ import { VariablesDetail } from '../CodeEditor';
import CredentialChip from '../CredentialChip';
import ChipGroup from '../ChipGroup';
import ExecutionEnvironmentDetail from '../ExecutionEnvironmentDetail';
import { VERBOSITY } from '../../constants';
import { VERBOSITY } from '../VerbositySelectField';
function PromptInventorySourceDetail({ resource }) {
const {
@ -108,7 +108,7 @@ function PromptInventorySourceDetail({ resource }) {
executionEnvironment={summary_fields?.execution_environment}
/>
<Detail label={t`Inventory File`} value={source_path} />
<Detail label={t`Verbosity`} value={VERBOSITY[verbosity]} />
<Detail label={t`Verbosity`} value={VERBOSITY()[verbosity]} />
<Detail
label={t`Cache Timeout`}
value={`${update_cache_timeout} ${t`Seconds`}`}

View File

@ -15,7 +15,7 @@ import Sparkline from '../Sparkline';
import { Detail, DeletedDetail } from '../DetailList';
import { VariablesDetail } from '../CodeEditor';
import ExecutionEnvironmentDetail from '../ExecutionEnvironmentDetail';
import { VERBOSITY } from '../../constants';
import { VERBOSITY } from '../VerbositySelectField';
function PromptJobTemplateDetail({ resource }) {
const {
@ -146,7 +146,7 @@ function PromptJobTemplateDetail({ resource }) {
<Detail label={t`Playbook`} value={playbook} />
<Detail label={t`Forks`} value={forks || '0'} />
<Detail label={t`Limit`} value={limit} />
<Detail label={t`Verbosity`} value={VERBOSITY[verbosity]} />
<Detail label={t`Verbosity`} value={VERBOSITY()[verbosity]} />
{typeof diff_mode === 'boolean' && (
<Detail label={t`Show Changes`} value={diff_mode ? t`On` : t`Off`} />
)}

View File

@ -23,7 +23,7 @@ import DeleteButton from '../../DeleteButton';
import ErrorDetail from '../../ErrorDetail';
import ChipGroup from '../../ChipGroup';
import { VariablesDetail } from '../../CodeEditor';
import { VERBOSITY } from '../../../constants';
import { VERBOSITY } from '../../VerbositySelectField';
const PromptDivider = styled(Divider)`
margin-top: var(--pf-global--spacer--lg);
@ -209,7 +209,7 @@ function ScheduleDetail({ hasDaysToKeepField, schedule, surveyConfig }) {
const showLimitDetail = ask_limit_on_launch && limit;
const showJobTypeDetail = ask_job_type_on_launch && job_type;
const showSCMBranchDetail = ask_scm_branch_on_launch && scm_branch;
const showVerbosityDetail = ask_verbosity_on_launch && VERBOSITY[verbosity];
const showVerbosityDetail = ask_verbosity_on_launch && VERBOSITY()[verbosity];
const showPromptedFields =
showCredentialsDetail ||
@ -306,7 +306,7 @@ function ScheduleDetail({ hasDaysToKeepField, schedule, surveyConfig }) {
/>
)}
{ask_verbosity_on_launch && (
<Detail label={t`Verbosity`} value={VERBOSITY[verbosity]} />
<Detail label={t`Verbosity`} value={VERBOSITY()[verbosity]} />
)}
{ask_scm_branch_on_launch && (
<Detail label={t`Source Control Branch`} value={scm_branch} />

View File

@ -0,0 +1,58 @@
import React from 'react';
import { t } from '@lingui/macro';
import { useField } from 'formik';
import { FormGroup } from '@patternfly/react-core';
import Popover from 'components/Popover';
import AnsibleSelect from 'components/AnsibleSelect';
import FieldWithPrompt from 'components/FieldWithPrompt';
const VERBOSITY = () => ({
0: t`0 (Normal)`,
1: t`1 (Verbose)`,
2: t`2 (More Verbose)`,
3: t`3 (Debug)`,
4: t`4 (Connection Debug)`,
5: t`5 (WinRM Debug)`,
});
function VerbositySelectField({
fieldId,
promptId,
promptName,
tooltip,
isValid,
}) {
const VERBOSE_OPTIONS = Object.entries(VERBOSITY()).map(([k, v]) => ({
key: `${k}`,
value: `${k}`,
label: v,
}));
const [verbosityField, , verbosityHelpers] = useField('verbosity');
return promptId ? (
<FieldWithPrompt
fieldId={fieldId}
label={t`Verbosity`}
promptId={promptId}
promptName={promptName}
tooltip={tooltip}
>
<AnsibleSelect id={fieldId} data={VERBOSE_OPTIONS} {...verbosityField} />
</FieldWithPrompt>
) : (
<FormGroup
fieldId={fieldId}
validated={isValid ? 'default' : 'error'}
label={t`Verbosity`}
labelIcon={<Popover content={tooltip} />}
>
<AnsibleSelect
id={fieldId}
data={VERBOSE_OPTIONS}
{...verbosityField}
onChange={(event, value) => verbosityHelpers.setValue(value)}
/>
</FormGroup>
);
}
export { VerbositySelectField, VERBOSITY };

View File

@ -0,0 +1 @@
export { VERBOSITY, VerbositySelectField } from './VerbositySelectField';

View File

@ -1,5 +1,3 @@
import { t } from '@lingui/macro';
/* eslint-disable-next-line import/prefer-default-export */
export const JOB_TYPE_URL_SEGMENTS = {
job: 'playbook',
@ -14,18 +12,3 @@ export const SESSION_TIMEOUT_KEY = 'awx-session-timeout';
export const SESSION_REDIRECT_URL = 'awx-redirect-url';
export const PERSISTENT_FILTER_KEY = 'awx-persistent-filter';
export const SESSION_USER_ID = 'awx-session-user-id';
export const VERBOSITY = {
0: t`0 (Normal)`,
1: t`1 (Verbose)`,
2: t`2 (More Verbose)`,
3: t`3 (Debug)`,
4: t`4 (Connection Debug)`,
5: t`5 (WinRM Debug)`,
};
export const VERBOSE_OPTIONS = Object.entries(VERBOSITY).map(([k, v]) => ({
key: k,
value: k,
label: v,
}));

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -29,6 +29,7 @@ import { relatedResourceDeleteRequests } from 'util/getRelatedResourceDeleteDeta
import useIsMounted from 'hooks/useIsMounted';
import { formatDateString } from 'util/dates';
import Popover from 'components/Popover';
import { VERBOSITY } from 'components/VerbositySelectField';
import InventorySourceSyncButton from '../shared/InventorySourceSyncButton';
import useWsInventorySourcesDetails from '../InventorySources/useWsInventorySourcesDetails';
import helpText from '../shared/Inventory.helptext';
@ -111,12 +112,6 @@ function InventorySourceDetail({ inventorySource }) {
inventorySource.id
);
const VERBOSITY = {
0: t`0 (Warning)`,
1: t`1 (Info)`,
2: t`2 (Debug)`,
};
let optionsList = '';
if (
overwrite ||
@ -251,7 +246,7 @@ function InventorySourceDetail({ inventorySource }) {
<Detail
label={t`Verbosity`}
helpText={helpText.subFormVerbosityFields}
value={VERBOSITY[verbosity]}
value={VERBOSITY()[verbosity]}
/>
<Detail
label={t`Cache timeout`}

View File

@ -93,7 +93,7 @@ describe('InventorySourceDetail', () => {
assertDetail(wrapper, 'Organization', 'Mock Org');
assertDetail(wrapper, 'Project', 'Mock Project');
assertDetail(wrapper, 'Inventory file', 'foo');
assertDetail(wrapper, 'Verbosity', '2 (Debug)');
assertDetail(wrapper, 'Verbosity', '2 (More Verbose)');
assertDetail(wrapper, 'Cache timeout', '2 seconds');
const executionEnvironment = wrapper.find('ExecutionEnvironmentDetail');
expect(executionEnvironment).toHaveLength(1);

View File

@ -25,10 +25,10 @@ import { LaunchButton, ReLaunchDropDown } from 'components/LaunchButton';
import StatusLabel from 'components/StatusLabel';
import JobCancelButton from 'components/JobCancelButton';
import ExecutionEnvironmentDetail from 'components/ExecutionEnvironmentDetail';
import { VERBOSITY } from 'components/VerbositySelectField';
import { getJobModel, isJobRunning } from 'util/jobs';
import { formatDateString } from 'util/dates';
import { Job } from 'types';
import { VERBOSITY } from '../../../constants';
import jobHelpText from '../Job.helptext';
const StatusDetailValue = styled.div`
@ -325,7 +325,7 @@ function JobDetail({ job, inventorySourceLabels }) {
dataCy="job-verbosity"
label={t`Verbosity`}
helpText={jobHelpText.verbosity}
value={VERBOSITY[job.verbosity]}
value={VERBOSITY()[job.verbosity]}
/>
{job.type !== 'workflow_job' && !isJobRunning(job.status) && (
<ExecutionEnvironmentDetail

View File

@ -28,12 +28,12 @@ import DeleteButton from 'components/DeleteButton';
import ErrorDetail from 'components/ErrorDetail';
import { LaunchButton } from 'components/LaunchButton';
import { VariablesDetail } from 'components/CodeEditor';
import { VERBOSITY } from 'components/VerbositySelectField';
import { JobTemplatesAPI } from 'api';
import useRequest, { useDismissableError } from 'hooks/useRequest';
import useBrandName from 'hooks/useBrandName';
import ExecutionEnvironmentDetail from 'components/ExecutionEnvironmentDetail';
import { relatedResourceDeleteRequests } from 'util/getRelatedResourceDeleteDetails';
import { VERBOSITY } from '../../../constants';
import helpText from '../shared/JobTemplate.helptext';
function JobTemplateDetail({ template }) {
@ -262,7 +262,7 @@ function JobTemplateDetail({ template }) {
/>
<Detail
label={t`Verbosity`}
value={VERBOSITY[verbosity]}
value={VERBOSITY()[verbosity]}
dataCy="jt-detail-verbosity"
helpText={helpText.verbosity}
/>

View File

@ -43,10 +43,10 @@ import Popover from 'components/Popover';
import { JobTemplatesAPI } from 'api';
import useIsMounted from 'hooks/useIsMounted';
import LabelSelect from 'components/LabelSelect';
import { VerbositySelectField } from 'components/VerbositySelectField';
import PlaybookSelect from './PlaybookSelect';
import WebhookSubForm from './WebhookSubForm';
import helpText from './JobTemplate.helptext';
import { VERBOSE_OPTIONS } from '../../../constants';
const { origin } = document.location;
@ -86,7 +86,6 @@ function JobTemplateForm({
const [credentialField, , credentialHelpers] = useField('credentials');
const [labelsField, , labelsHelpers] = useField('labels');
const [limitField, limitMeta, limitHelpers] = useField('limit');
const [verbosityField] = useField('verbosity');
const [diffModeField, , diffModeHelpers] = useField('diff_mode');
const [instanceGroupsField, , instanceGroupsHelpers] =
useField('instanceGroups');
@ -422,19 +421,12 @@ function JobTemplateForm({
}}
/>
</FieldWithPrompt>
<FieldWithPrompt
<VerbositySelectField
fieldId="template-verbosity"
label={t`Verbosity`}
promptId="template-ask-verbosity-on-launch"
promptName="ask_verbosity_on_launch"
tooltip={helpText.verbosity}
>
<AnsibleSelect
id="template-verbosity"
data={VERBOSE_OPTIONS}
{...verbosityField}
/>
</FieldWithPrompt>
/>
<FormField
id="template-job-slicing"
name="job_slice_count"