From e296d0adad323d28939bf8fdaf392bc8129144d9 Mon Sep 17 00:00:00 2001 From: vedaperi <52008241+vedaperi@users.noreply.github.com> Date: Fri, 8 Jul 2022 12:06:50 -0700 Subject: [PATCH] Add Help Text with documentation link to Schedules page (#12448) * Added help text to schedule form and detail with link to documentation * Added test cases for help text in schedule form and detail * Add help text to schedule form and detail with link to documentation Co-authored-by: Veda Periwal --- .../Schedule/ScheduleDetail/ScheduleDetail.js | 10 ++++++++-- .../Schedule/ScheduleDetail/ScheduleDetail.test.js | 3 +++ .../src/components/Schedule/shared/ScheduleForm.js | 8 +++++++- .../Schedule/shared/ScheduleForm.test.js | 3 +++ .../screens/Template/Survey/SurveyQuestionForm.js | 4 ++-- .../Template/shared/JobTemplate.helptext.js | 14 ++++++++++++++ 6 files changed, 37 insertions(+), 5 deletions(-) diff --git a/awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.js b/awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.js index 6c774ed646..45a1471dde 100644 --- a/awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.js +++ b/awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.js @@ -11,6 +11,7 @@ import { formatDateString } from 'util/dates'; import useRequest, { useDismissableError } from 'hooks/useRequest'; import { JobTemplatesAPI, SchedulesAPI, WorkflowJobTemplatesAPI } from 'api'; import { parseVariableField, jsonToYaml } from 'util/yaml'; +import { useConfig } from 'contexts/Config'; import AlertModal from '../../AlertModal'; import { CardBody, CardActionsRow } from '../../Card'; import ContentError from '../../ContentError'; @@ -24,6 +25,7 @@ import ErrorDetail from '../../ErrorDetail'; import ChipGroup from '../../ChipGroup'; import { VariablesDetail } from '../../CodeEditor'; import { VERBOSITY } from '../../VerbositySelectField'; +import helpText from '../../../screens/Template/shared/JobTemplate.helptext'; const PromptDivider = styled(Divider)` margin-top: var(--pf-global--spacer--lg); @@ -39,7 +41,6 @@ const PromptTitle = styled(Title)` const PromptDetailList = styled(DetailList)` padding: 0px 20px; `; - function ScheduleDetail({ hasDaysToKeepField, schedule, surveyConfig }) { const { id, @@ -67,6 +68,7 @@ function ScheduleDetail({ hasDaysToKeepField, schedule, surveyConfig }) { const history = useHistory(); const { pathname } = useLocation(); const pathRoot = pathname.substr(0, pathname.indexOf('schedules')); + const config = useConfig(); const { request: deleteSchedule, @@ -260,7 +262,11 @@ function ScheduleDetail({ hasDaysToKeepField, schedule, surveyConfig }) { value={formatDateString(next_run, timezone)} /> - + {hasDaysToKeepField ? ( diff --git a/awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.test.js b/awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.test.js index 6ff6d33682..786767895e 100644 --- a/awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.test.js +++ b/awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.test.js @@ -164,6 +164,9 @@ describe('', () => { expect( wrapper.find('Detail[label="Local Time Zone"]').find('dd').text() ).toBe('America/New_York'); + expect( + wrapper.find('Detail[label="Local Time Zone"]').prop('helpText') + ).toBeDefined(); expect(wrapper.find('Detail[label="Repeat Frequency"]').length).toBe(1); expect(wrapper.find('Detail[label="Created"]').length).toBe(1); expect(wrapper.find('Detail[label="Last Modified"]').length).toBe(1); diff --git a/awx/ui/src/components/Schedule/shared/ScheduleForm.js b/awx/ui/src/components/Schedule/shared/ScheduleForm.js index 86ad24f08f..ee2b66c813 100644 --- a/awx/ui/src/components/Schedule/shared/ScheduleForm.js +++ b/awx/ui/src/components/Schedule/shared/ScheduleForm.js @@ -14,12 +14,13 @@ import { // To be removed once UI completes complex schedules Alert, } from '@patternfly/react-core'; -import { Config } from 'contexts/Config'; +import { Config, useConfig } from 'contexts/Config'; import { SchedulesAPI } from 'api'; import { dateToInputDateTime } from 'util/dates'; import useRequest from 'hooks/useRequest'; import { required } from 'util/validators'; import { parseVariableField } from 'util/yaml'; +import Popover from '../../Popover'; import AnsibleSelect from '../../AnsibleSelect'; import ContentError from '../../ContentError'; import ContentLoading from '../../ContentLoading'; @@ -33,6 +34,7 @@ import FrequencyDetailSubform from './FrequencyDetailSubform'; import SchedulePromptableFields from './SchedulePromptableFields'; import DateTimePicker from './DateTimePicker'; import buildRuleObj from './buildRuleObj'; +import helpText from '../../../screens/Template/shared/JobTemplate.helptext'; const NUM_DAYS_PER_FREQUENCY = { week: 7, @@ -118,6 +120,9 @@ function ScheduleFormFields({ hasDaysToKeepField, zoneOptions, zoneLinks }) { } else if (timezoneMessage) { timezoneValidatedStatus = 'warning'; } + + const config = useConfig(); + return ( <> } > { expect(wrapper.find('FormGroup[label="Description"]').length).toBe(1); expect(wrapper.find('FormGroup[label="Start date/time"]').length).toBe(1); expect(wrapper.find('FormGroup[label="Local time zone"]').length).toBe(1); + expect( + wrapper.find('FormGroup[label="Local time zone"]').find('HelpIcon').length + ).toBe(1); expect(wrapper.find('FormGroup[label="Run frequency"]').length).toBe(1); }; diff --git a/awx/ui/src/screens/Template/Survey/SurveyQuestionForm.js b/awx/ui/src/screens/Template/Survey/SurveyQuestionForm.js index a19e0c298b..1e37238baa 100644 --- a/awx/ui/src/screens/Template/Survey/SurveyQuestionForm.js +++ b/awx/ui/src/screens/Template/Survey/SurveyQuestionForm.js @@ -266,8 +266,8 @@ function SurveyQuestionForm({ target="_blank" rel="noreferrer" > - {t`documentation`}{' '} - + {t`documentation`} + {' '} {t`for more information.`} } diff --git a/awx/ui/src/screens/Template/shared/JobTemplate.helptext.js b/awx/ui/src/screens/Template/shared/JobTemplate.helptext.js index 4d6ecdec37..7d761d0fa1 100644 --- a/awx/ui/src/screens/Template/shared/JobTemplate.helptext.js +++ b/awx/ui/src/screens/Template/shared/JobTemplate.helptext.js @@ -1,5 +1,6 @@ import React from 'react'; import { t } from '@lingui/macro'; +import getDocsBaseUrl from 'util/getDocsBaseUrl'; const jtHelpTextStrings = { jobType: t`For job templates, select run to execute the playbook. Select check to only check playbook syntax, test environment setup, and report problems without executing the playbook.`, @@ -46,6 +47,19 @@ const jtHelpTextStrings = { {t`Refer to the Ansible documentation for details about the configuration file.`} ), + localTimeZone: (config = '') => ( + + {t`Refer to the`}{' '} + + {t`documentation`} + {' '} + {t`for more information.`} + + ), }; export default jtHelpTextStrings;