Merge pull request #12788 from AlexSCorey/5941-Translations

Ensures that strings in helpText files do not miss being translated

awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.js

@@ -26,7 +26,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';
+import getHelpText from '../../../screens/Template/shared/JobTemplate.helptext';
 
 const PromptDivider = styled(Divider)`
   margin-top: var(--pf-global--spacer--lg);
@@ -85,7 +85,7 @@ function ScheduleDetail({ hasDaysToKeepField, schedule, surveyConfig }) {
     timezone,
     verbosity,
   } = schedule;
-
+  const helpText = getHelpText();
   const history = useHistory();
   const { pathname } = useLocation();
   const pathRoot = pathname.substr(0, pathname.indexOf('schedules'));

awx/ui/src/components/Schedule/shared/ScheduleFormFields.js

@@ -9,7 +9,7 @@ import { useConfig } from 'contexts/Config';
 import Popover from '../../Popover';
 import AnsibleSelect from '../../AnsibleSelect';
 import FrequencySelect, { SelectOption } from './FrequencySelect';
-import helpText from '../../../screens/Template/shared/JobTemplate.helptext';
+import getHelpText from '../../../screens/Template/shared/JobTemplate.helptext';
 import { SubFormLayout, FormColumnLayout } from '../../FormLayout';
 import FrequencyDetailSubform from './FrequencyDetailSubform';
 import DateTimePicker from './DateTimePicker';
@@ -26,6 +26,7 @@ export default function ScheduleFormFields({
   zoneOptions,
   zoneLinks,
 }) {
+  const helpText = getHelpText();
   const [timezone, timezoneMeta] = useField({
     name: 'timezone',
     validate: required(t`Select a value for this field`),

awx/ui/src/screens/Application/ApplicationDetails/ApplicationDetails.js

@@ -11,13 +11,14 @@ import { Detail, DetailList, UserDateDetail } from 'components/DetailList';
 import { ApplicationsAPI } from 'api';
 import DeleteButton from 'components/DeleteButton';
 import ErrorDetail from 'components/ErrorDetail';
-import applicationHelpTextStrings from '../shared/Application.helptext';
+import getApplicationHelpTextStrings from '../shared/Application.helptext';
 
 function ApplicationDetails({
   application,
   authorizationOptions,
   clientTypeOptions,
 }) {
+  const applicationHelpTextStrings = getApplicationHelpTextStrings();
   const history = useHistory();
   const {
     isLoading: deleteLoading,

awx/ui/src/screens/Application/shared/Application.helptext.js

@@ -1,9 +1,9 @@
 import { t } from '@lingui/macro';
 
-const applicationHelpTextStrings = {
+const applicationHelpTextStrings = () => ({
   authorizationGrantType: t`The Grant type the user must use to acquire tokens for this application`,
   clientType: t`Set to Public or Confidential depending on how secure the client device is.`,
   redirectURIS: t`Allowed URIs list, space separated`,
-};
+});
 
 export default applicationHelpTextStrings;

awx/ui/src/screens/Application/shared/ApplicationForm.js

@@ -13,13 +13,14 @@ import FormActionGroup from 'components/FormActionGroup/FormActionGroup';
 import OrganizationLookup from 'components/Lookup/OrganizationLookup';
 import AnsibleSelect from 'components/AnsibleSelect';
 import Popover from 'components/Popover';
-import applicationHelpTextStrings from './Application.helptext';
+import getApplicationHelpTextStrings from './Application.helptext';
 
 function ApplicationFormFields({
   application,
   authorizationOptions,
   clientTypeOptions,
 }) {
+  const applicationHelpTextStrings = getApplicationHelpTextStrings();
   const match = useRouteMatch();
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [organizationField, organizationMeta, organizationHelpers] =

awx/ui/src/screens/ExecutionEnvironment/ExecutionEnvironmentDetails/ExecutionEnvironmentDetails.js

@@ -12,9 +12,10 @@ import useRequest, { useDismissableError } from 'hooks/useRequest';
 import { toTitleCase } from 'util/strings';
 import { ExecutionEnvironmentsAPI } from 'api';
 import { relatedResourceDeleteRequests } from 'util/getRelatedResourceDeleteDetails';
-import helpText from '../shared/ExecutionEnvironment.helptext';
+import getHelpText from '../shared/ExecutionEnvironment.helptext';
 
 function ExecutionEnvironmentDetails({ executionEnvironment }) {
+  const helpText = getHelpText();
   const history = useHistory();
   const {
     id,

awx/ui/src/screens/ExecutionEnvironment/shared/ExecutionEnvironment.helptext.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { t } from '@lingui/macro';
 
-const executionEnvironmentHelpTextStrings = {
+const executionEnvironmentHelpTextStrings = () => ({
   image: (
     <span>
       {t`The full image location, including the container registry, image name, and version tag.`}
@@ -19,6 +19,6 @@ const executionEnvironmentHelpTextStrings = {
     </span>
   ),
   registryCredential: t`Credential to authenticate with a protected container registry.`,
-};
+});
 
 export default executionEnvironmentHelpTextStrings;

awx/ui/src/screens/ExecutionEnvironment/shared/ExecutionEnvironmentForm.js

@@ -14,7 +14,7 @@ import ContentError from 'components/ContentError';
 import ContentLoading from 'components/ContentLoading';
 import { required } from 'util/validators';
 import useRequest from 'hooks/useRequest';
-import helpText from './ExecutionEnvironment.helptext';
+import getHelpText from './ExecutionEnvironment.helptext';
 
 function ExecutionEnvironmentFormFields({
   me,
@@ -22,6 +22,7 @@ function ExecutionEnvironmentFormFields({
   executionEnvironment,
   isOrgLookupDisabled,
 }) {
+  const helpText = getHelpText();
   const [credentialField, credentialMeta, credentialHelpers] =
     useField('credential');
   const [organizationField, organizationMeta, organizationHelpers] =

awx/ui/src/screens/Inventory/InventoryDetail/InventoryDetail.js

@@ -16,10 +16,11 @@ import { InventoriesAPI } from 'api';
 import useRequest, { useDismissableError } from 'hooks/useRequest';
 import { Inventory } from 'types';
 import { relatedResourceDeleteRequests } from 'util/getRelatedResourceDeleteDetails';
-import helpText from '../shared/Inventory.helptext';
+import getHelpText from '../shared/Inventory.helptext';
 
 function InventoryDetail({ inventory }) {
   const history = useHistory();
+  const helpText = getHelpText();
   const {
     result: instanceGroups,
     isLoading,

awx/ui/src/screens/Inventory/InventorySourceDetail/InventorySourceDetail.js

@@ -32,9 +32,10 @@ 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';
+import getHelpText from '../shared/Inventory.helptext';
 
 function InventorySourceDetail({ inventorySource }) {
+  const helpText = getHelpText();
   const {
     created,
     custom_virtualenv,

awx/ui/src/screens/Inventory/shared/Inventory.helptext.js

@@ -21,7 +21,7 @@ const ansibleDocUrls = {
     'https://docs.ansible.com/ansible/latest/collections/community/vmware/vmware_vm_inventory_inventory.html',
 };
 
-const getInventoryHelpTextStrings = {
+const getInventoryHelpTextStrings = () => ({
   labels: t`Optional labels that describe this inventory,
           such as 'dev' or 'test'. Labels can be used to group and filter
           inventories and completed jobs.`,
@@ -191,6 +191,6 @@ const getInventoryHelpTextStrings = {
   sourcePath: t`The inventory file
           to be synced by this source. You can select from
           the dropdown or enter a file within the input.`,
-};
+});
 
 export default getInventoryHelpTextStrings;

awx/ui/src/screens/Inventory/shared/InventoryForm.js

@@ -13,9 +13,10 @@ import InstanceGroupsLookup from 'components/Lookup/InstanceGroupsLookup';
 import OrganizationLookup from 'components/Lookup/OrganizationLookup';
 import ContentError from 'components/ContentError';
 import { FormColumnLayout, FormFullWidthLayout } from 'components/FormLayout';
-import helpText from './Inventory.helptext';
+import getHelpText from './Inventory.helptext';
 
 function InventoryFormFields({ inventory }) {
+  const helpText = getHelpText();
   const [contentError, setContentError] = useState(false);
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [organizationField, organizationMeta, organizationHelpers] =

awx/ui/src/screens/Inventory/shared/InventorySourceSubForms/AzureSubForm.js

@@ -13,9 +13,10 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
-import helpText from '../Inventory.helptext';
+import getHelpText from '../Inventory.helptext';
 
 const AzureSubForm = ({ autoPopulateCredential }) => {
+  const helpText = getHelpText();
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [credentialField, credentialMeta, credentialHelpers] =
     useField('credential');

awx/ui/src/screens/Inventory/shared/InventorySourceSubForms/ControllerSubForm.js

@@ -14,9 +14,10 @@ import {
   HostFilterField,
   SourceVarsField,
 } from './SharedFields';
-import helpText from '../Inventory.helptext';
+import getHelpText from '../Inventory.helptext';
 
 const ControllerSubForm = ({ autoPopulateCredential }) => {
+  const helpText = getHelpText();
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [credentialField, credentialMeta, credentialHelpers] =
     useField('credential');

awx/ui/src/screens/Inventory/shared/InventorySourceSubForms/EC2SubForm.js

@@ -12,9 +12,10 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
-import helpText from '../Inventory.helptext';
+import getHelpText from '../Inventory.helptext';
 
 const EC2SubForm = () => {
+  const helpText = getHelpText();
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [credentialField, credentialMeta] = useField('credential');
   const config = useConfig();

awx/ui/src/screens/Inventory/shared/InventorySourceSubForms/GCESubForm.js

@@ -13,9 +13,10 @@ import {
   HostFilterField,
   SourceVarsField,
 } from './SharedFields';
-import helpText from '../Inventory.helptext';
+import getHelpText from '../Inventory.helptext';
 
 const GCESubForm = ({ autoPopulateCredential }) => {
+  const helpText = getHelpText();
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [credentialField, credentialMeta, credentialHelpers] =
     useField('credential');

awx/ui/src/screens/Inventory/shared/InventorySourceSubForms/InsightsSubForm.js

@@ -14,9 +14,10 @@ import {
   HostFilterField,
   SourceVarsField,
 } from './SharedFields';
-import helpText from '../Inventory.helptext';
+import getHelpText from '../Inventory.helptext';
 
 const InsightsSubForm = ({ autoPopulateCredential }) => {
+  const helpText = getHelpText();
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [credentialField, credentialMeta, credentialHelpers] =
     useField('credential');

awx/ui/src/screens/Inventory/shared/InventorySourceSubForms/OpenStackSubForm.js

@@ -13,9 +13,10 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
-import helpText from '../Inventory.helptext';
+import getHelpText from '../Inventory.helptext';
 
 const OpenStackSubForm = ({ autoPopulateCredential }) => {
+  const helpText = getHelpText();
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [credentialField, credentialMeta, credentialHelpers] =
     useField('credential');

awx/ui/src/screens/Inventory/shared/InventorySourceSubForms/SCMSubForm.js

@@ -21,9 +21,10 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
-import helpText from '../Inventory.helptext';
+import getHelpText from '../Inventory.helptext';
 
 const SCMSubForm = ({ autoPopulateProject }) => {
+  const helpText = getHelpText();
   const [isOpen, setIsOpen] = useState(false);
   const [sourcePath, setSourcePath] = useState([]);
   const { setFieldValue, setFieldTouched } = useFormikContext();

awx/ui/src/screens/Inventory/shared/InventorySourceSubForms/SatelliteSubForm.js

@@ -13,9 +13,10 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
-import helpText from '../Inventory.helptext';
+import getHelpText from '../Inventory.helptext';
 
 const SatelliteSubForm = ({ autoPopulateCredential }) => {
+  const helpText = getHelpText();
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [credentialField, credentialMeta, credentialHelpers] =
     useField('credential');

awx/ui/src/screens/Inventory/shared/InventorySourceSubForms/SharedFields.js

@@ -9,25 +9,29 @@ import { VariablesField } from 'components/CodeEditor';
 import FormField, { CheckboxField } from 'components/FormField';
 import { FormFullWidthLayout, FormCheckboxLayout } from 'components/FormLayout';
 import Popover from 'components/Popover';
-import helpText from '../Inventory.helptext';
+import getHelpText from '../Inventory.helptext';
 
-export const SourceVarsField = ({ popoverContent }) => (
+export const SourceVarsField = ({ popoverContent }) => {
-  <FormFullWidthLayout>
+  const helpText = getHelpText();
-    <VariablesField
+  return (
-      id="source_vars"
+    <FormFullWidthLayout>
-      name="source_vars"
+      <VariablesField
-      label={t`Source variables`}
+        id="source_vars"
-      tooltip={
+        name="source_vars"
-        <>
+        label={t`Source variables`}
-          {popoverContent}
+        tooltip={
-          {helpText.variables()}
+          <>
-        </>
+            {popoverContent}
-      }
+            {helpText.variables()}
-    />
+          </>
-  </FormFullWidthLayout>
+        }
-);
+      />
+    </FormFullWidthLayout>
+  );
+};
 
 export const VerbosityField = () => {
+  const helpText = getHelpText();
   const [field, meta, helpers] = useField('verbosity');
   const isValid = !(meta.touched && meta.error);
   const options = [
@@ -54,6 +58,7 @@ export const VerbosityField = () => {
 };
 
 export const OptionsField = () => {
+  const helpText = getHelpText();
   const [updateOnLaunchField] = useField('update_on_launch');
   const [, , updateCacheTimeoutHelper] = useField('update_cache_timeout');
   const [projectField] = useField('source_project');
@@ -106,33 +111,42 @@ export const OptionsField = () => {
   );
 };
 
-export const EnabledVarField = () => (
+export const EnabledVarField = () => {
-  <FormField
+  const helpText = getHelpText();
-    id="inventory-enabled-var"
+  return (
-    label={t`Enabled Variable`}
+    <FormField
-    tooltip={helpText.enabledVariableField}
+      id="inventory-enabled-var"
-    name="enabled_var"
+      label={t`Enabled Variable`}
-    type="text"
+      tooltip={helpText.enabledVariableField}
-  />
+      name="enabled_var"
-);
+      type="text"
+    />
+  );
+};
 
-export const EnabledValueField = () => (
+export const EnabledValueField = () => {
-  <FormField
+  const helpText = getHelpText();
-    id="inventory-enabled-value"
+  return (
-    label={t`Enabled Value`}
+    <FormField
-    tooltip={helpText.enabledValue}
+      id="inventory-enabled-value"
-    name="enabled_value"
+      label={t`Enabled Value`}
-    type="text"
+      tooltip={helpText.enabledValue}
-  />
+      name="enabled_value"
-);
+      type="text"
+    />
+  );
+};
 
-export const HostFilterField = () => (
+export const HostFilterField = () => {
-  <FormField
+  const helpText = getHelpText();
-    id="host-filter"
+  return (
-    label={t`Host Filter`}
+    <FormField
-    tooltip={helpText.hostFilter}
+      id="host-filter"
-    name="host_filter"
+      label={t`Host Filter`}
-    type="text"
+      tooltip={helpText.hostFilter}
-    validate={regExp()}
+      name="host_filter"
-  />
+      type="text"
-);
+      validate={regExp()}
+    />
+  );
+};

awx/ui/src/screens/Inventory/shared/InventorySourceSubForms/VMwareSubForm.js

@@ -13,9 +13,10 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
-import helpText from '../Inventory.helptext';
+import getHelpText from '../Inventory.helptext';
 
 const VMwareSubForm = ({ autoPopulateCredential }) => {
+  const helpText = getHelpText();
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [credentialField, credentialMeta, credentialHelpers] =
     useField('credential');

awx/ui/src/screens/Inventory/shared/InventorySourceSubForms/VirtualizationSubForm.js

@@ -13,9 +13,10 @@ import {
   HostFilterField,
   SourceVarsField,
 } from './SharedFields';
-import helpText from '../Inventory.helptext';
+import getHelpText from '../Inventory.helptext';
 
 const VirtualizationSubForm = ({ autoPopulateCredential }) => {
+  const helpText = getHelpText();
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [credentialField, credentialMeta, credentialHelpers] =
     useField('credential');

awx/ui/src/screens/Job/Job.helptext.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { t } from '@lingui/macro';
 
-const jobHelpText = {
+const jobHelpText = () => ({
   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.`,
   inventory: t`Select the inventory containing the hosts you want this job to manage.`,
   project: t`Select the project containing the playbook you want this job to execute.`,
@@ -41,6 +41,6 @@ const jobHelpText = {
     ) : (
       t`These arguments are used with the specified module.`
     ),
-};
+});
 
 export default jobHelpText;

awx/ui/src/screens/Job/JobDetail/JobDetail.js

@@ -29,7 +29,7 @@ import { VERBOSITY } from 'components/VerbositySelectField';
 import { getJobModel, isJobRunning } from 'util/jobs';
 import { formatDateString } from 'util/dates';
 import { Job } from 'types';
-import jobHelpText from '../Job.helptext';
+import getJobHelpText from '../Job.helptext';
 
 const StatusDetailValue = styled.div`
   align-items: center;
@@ -39,6 +39,7 @@ const StatusDetailValue = styled.div`
 `;
 
 function JobDetail({ job, inventorySourceLabels }) {
+  const jobHelpText = getJobHelpText();
   const { me } = useConfig();
   const {
     created_by,

awx/ui/src/screens/NotificationTemplate/NotificationTemplateDetail/NotificationTemplateDetail.js

@@ -25,12 +25,13 @@ import useRequest, { useDismissableError } from 'hooks/useRequest';
 import StatusLabel from 'components/StatusLabel';
 import hasCustomMessages from '../shared/hasCustomMessages';
 import { NOTIFICATION_TYPES } from '../constants';
-import helpText from '../shared/Notifications.helptext';
+import getHelpText from '../shared/Notifications.helptext';
 
 const NUM_RETRIES = 25;
 const RETRY_TIMEOUT = 5000;
 
 function NotificationTemplateDetail({ template, defaultMessages }) {
+  const helpText = getHelpText();
   const history = useHistory();
   const [testStatus, setTestStatus] = useState(
     template.summary_fields?.recent_notifications[0]?.status ?? undefined

awx/ui/src/screens/NotificationTemplate/shared/Notifications.helptext.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { t } from '@lingui/macro';
 
-const helpText = {
+const helpText = () => ({
   emailRecepients: t`Use one email address per line to create a recipient list for this type of notification.`,
   emailTimeout: t`The amount of time (in seconds) before the email
           notification stops trying to reach the host and times out. Ranges
@@ -40,6 +40,6 @@ const helpText = {
       <span>{t`for more information.`}</span>
     </>
   ),
-};
+});
 
 export default helpText;

awx/ui/src/screens/NotificationTemplate/shared/TypeInputsSubForm.js

@@ -26,7 +26,7 @@ import {
 } from 'util/validators';
 import { NotificationType } from 'types';
 import Popover from '../../../components/Popover/Popover';
-import helpText from './Notifications.helptext';
+import getHelpText from './Notifications.helptext';
 
 const TypeFields = {
   email: EmailFields,
@@ -59,6 +59,7 @@ TypeInputsSubForm.propTypes = {
 export default TypeInputsSubForm;
 
 function EmailFields() {
+  const helpText = getHelpText();
   return (
     <>
       <FormField
@@ -142,6 +143,7 @@ function EmailFields() {
 }
 
 function GrafanaFields() {
+  const helpText = getHelpText();
   return (
     <>
       <FormField
@@ -190,6 +192,8 @@ function GrafanaFields() {
 }
 
 function IRCFields() {
+  const helpText = getHelpText();
+
   return (
     <>
       <PasswordField
@@ -351,6 +355,8 @@ function RocketChatFields() {
 }
 
 function SlackFields() {
+  const helpText = getHelpText();
+
   return (
     <>
       <ArrayTextField
@@ -381,6 +387,8 @@ function SlackFields() {
 }
 
 function TwilioFields() {
+  const helpText = getHelpText();
+
   return (
     <>
       <PasswordField
@@ -421,6 +429,8 @@ function TwilioFields() {
 }
 
 function WebhookFields() {
+  const helpText = getHelpText();
+
   const [methodField, methodMeta] = useField({
     name: 'notification_configuration.http_method',
     validate: required(t`Select a value for this field`),

awx/ui/src/screens/Project/ProjectDetail/ProjectDetail.js

@@ -31,7 +31,7 @@ import { formatDateString } from 'util/dates';
 import Popover from 'components/Popover';
 import getDocsBaseUrl from 'util/getDocsBaseUrl';
 import ProjectSyncButton from '../shared/ProjectSyncButton';
-import projectHelpText from '../shared/Project.helptext';
+import getProjectHelpText from '../shared/Project.helptext';
 import useWsProject from './useWsProject';
 
 const Label = styled.span`
@@ -39,6 +39,7 @@ const Label = styled.span`
 `;
 
 function ProjectDetail({ project }) {
+  const projectHelpText = getProjectHelpText();
   const {
     allow_override,
     created,

awx/ui/src/screens/Project/shared/Project.helptext.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { t } from '@lingui/macro';
 
-const projectHelpTextStrings = {
+const projectHelpTextStrings = () => ({
   executionEnvironment: t`The execution environment that will be used for jobs that use this project. This will be used as fallback when an execution environment has not been explicitly assigned at the job template or workflow level.`,
   projectBasePath: (brandName = '') => (
     <span>
@@ -132,6 +132,6 @@ const projectHelpTextStrings = {
                     considered current, and a new project update will be
                     performed.`,
   },
-};
+});
 
 export default projectHelpTextStrings;

awx/ui/src/screens/Project/shared/ProjectForm.js

@@ -17,7 +17,7 @@ import ExecutionEnvironmentLookup from 'components/Lookup/ExecutionEnvironmentLo
 import { CredentialTypesAPI, ProjectsAPI } from 'api';
 import { required } from 'util/validators';
 import { FormColumnLayout, SubFormLayout } from 'components/FormLayout';
-import projectHelpText from './Project.helptext';
+import getProjectHelpText from './Project.helptext';
 import {
   GitSubForm,
   SvnSubForm,
@@ -91,6 +91,7 @@ function ProjectFormFields({
   setScmSubFormState,
   scmSubFormState,
 }) {
+  const projectHelpText = getProjectHelpText();
   const scmFormFields = {
     scm_url: '',
     scm_branch: '',

awx/ui/src/screens/Project/shared/ProjectSubForms/ArchiveSubForm.js

@@ -1,6 +1,6 @@
 import 'styled-components/macro';
 import React from 'react';
-import projectHelpText from '../Project.helptext';
+import getProjectHelpText from '../Project.helptext';
 
 import {
   UrlFormField,
@@ -12,15 +12,18 @@ const ArchiveSubForm = ({
   credential,
   onCredentialSelection,
   scmUpdateOnLaunch,
-}) => (
+}) => {
-  <>
+  const projectHelpText = getProjectHelpText();
-    <UrlFormField tooltip={projectHelpText.archiveUrl} />
+  return (
-    <ScmCredentialFormField
+    <>
-      credential={credential}
+      <UrlFormField tooltip={projectHelpText.archiveUrl} />
-      onCredentialSelection={onCredentialSelection}
+      <ScmCredentialFormField
-    />
+        credential={credential}
-    <ScmTypeOptions scmUpdateOnLaunch={scmUpdateOnLaunch} />
+        onCredentialSelection={onCredentialSelection}
-  </>
+      />
-);
+      <ScmTypeOptions scmUpdateOnLaunch={scmUpdateOnLaunch} />
+    </>
+  );
+};
 
 export default ArchiveSubForm;

awx/ui/src/screens/Project/shared/ProjectSubForms/GitSubForm.js

@@ -11,8 +11,7 @@ import {
   ScmCredentialFormField,
   ScmTypeOptions,
 } from './SharedFields';
-
+import getProjectHelpStrings from '../Project.helptext';
-import projectHelpStrings from '../Project.helptext';
 
 const GitSubForm = ({
   credential,
@@ -22,6 +21,7 @@ const GitSubForm = ({
   const docsURL = `${getDocsBaseUrl(
     useConfig()
   )}/html/userguide/projects.html#manage-playbooks-using-source-control`;
+  const projectHelpStrings = getProjectHelpStrings();
 
   return (
     <>

awx/ui/src/screens/Project/shared/ProjectSubForms/ManualSubForm.js

@@ -8,13 +8,14 @@ import AnsibleSelect from 'components/AnsibleSelect';
 import FormField from 'components/FormField';
 import Popover from 'components/Popover';
 import useBrandName from 'hooks/useBrandName';
-import projectHelpStrings from '../Project.helptext';
+import getProjectHelpStrings from '../Project.helptext';
 
 const ManualSubForm = ({
   localPath,
   project_base_dir,
   project_local_paths,
 }) => {
+  const projectHelpStrings = getProjectHelpStrings();
   const brandName = useBrandName();
   const localPaths = [...new Set([...project_local_paths, localPath])];
   const options = [

awx/ui/src/screens/Project/shared/ProjectSubForms/SharedFields.js

@@ -7,7 +7,7 @@ import CredentialLookup from 'components/Lookup/CredentialLookup';
 import FormField, { CheckboxField } from 'components/FormField';
 import { required } from 'util/validators';
 import { FormCheckboxLayout, FormFullWidthLayout } from 'components/FormLayout';
-import projectHelpStrings from '../Project.helptext';
+import getProjectHelpStrings from '../Project.helptext';
 
 export const UrlFormField = ({ tooltip }) => (
   <FormField
@@ -22,15 +22,18 @@ export const UrlFormField = ({ tooltip }) => (
   />
 );
 
-export const BranchFormField = ({ label }) => (
+export const BranchFormField = ({ label }) => {
-  <FormField
+  const projectHelpStrings = getProjectHelpStrings();
-    id="project-scm-branch"
+  return (
-    name="scm_branch"
+    <FormField
-    type="text"
+      id="project-scm-branch"
-    label={label}
+      name="scm_branch"
-    tooltip={projectHelpStrings.branchFormField}
+      type="text"
-  />
+      label={label}
-);
+      tooltip={projectHelpStrings.branchFormField}
+    />
+  );
+};
 
 export const ScmCredentialFormField = ({
   credential,
@@ -59,6 +62,7 @@ export const ScmCredentialFormField = ({
 
 export const ScmTypeOptions = ({ scmUpdateOnLaunch, hideAllowOverride }) => {
   const { values } = useFormikContext();
+  const projectHelpStrings = getProjectHelpStrings();
 
   return (
     <FormFullWidthLayout>

awx/ui/src/screens/Project/shared/ProjectSubForms/SvnSubForm.js

@@ -1,7 +1,7 @@
 import 'styled-components/macro';
 import React from 'react';
 import { t } from '@lingui/macro';
-import projectHelpStrings from '../Project.helptext';
+import getProjectHelpStrings from '../Project.helptext';
 
 import {
   UrlFormField,
@@ -14,16 +14,19 @@ const SvnSubForm = ({
   credential,
   onCredentialSelection,
   scmUpdateOnLaunch,
-}) => (
+}) => {
-  <>
+  const projectHelpStrings = getProjectHelpStrings();
-    <UrlFormField tooltip={projectHelpStrings.svnSourceControlUrl} />
+  return (
-    <BranchFormField label={t`Revision #`} />
+    <>
-    <ScmCredentialFormField
+      <UrlFormField tooltip={projectHelpStrings.svnSourceControlUrl} />
-      credential={credential}
+      <BranchFormField label={t`Revision #`} />
-      onCredentialSelection={onCredentialSelection}
+      <ScmCredentialFormField
-    />
+        credential={credential}
-    <ScmTypeOptions scmUpdateOnLaunch={scmUpdateOnLaunch} />
+        onCredentialSelection={onCredentialSelection}
-  </>
+      />
-);
+      <ScmTypeOptions scmUpdateOnLaunch={scmUpdateOnLaunch} />
+    </>
+  );
+};
 
 export default SvnSubForm;

awx/ui/src/screens/Project/shared/ProjectSyncButton.js

@@ -11,9 +11,10 @@ import useRequest, { useDismissableError } from 'hooks/useRequest';
 import AlertModal from 'components/AlertModal';
 import ErrorDetail from 'components/ErrorDetail';
 import { ProjectsAPI } from 'api';
-import projectHelpStrings from './Project.helptext';
+import getProjectHelpStrings from './Project.helptext';
 
 function ProjectSyncButton({ projectId, lastJobStatus = null }) {
+  const projectHelpStrings = getProjectHelpStrings();
   const match = useRouteMatch();
 
   const { request: handleSync, error: syncError } = useRequest(

awx/ui/src/screens/Template/JobTemplateDetail/JobTemplateDetail.js

@@ -34,7 +34,7 @@ import useRequest, { useDismissableError } from 'hooks/useRequest';
 import useBrandName from 'hooks/useBrandName';
 import ExecutionEnvironmentDetail from 'components/ExecutionEnvironmentDetail';
 import { relatedResourceDeleteRequests } from 'util/getRelatedResourceDeleteDetails';
-import helpText from '../shared/JobTemplate.helptext';
+import getHelpText from '../shared/JobTemplate.helptext';
 
 function JobTemplateDetail({ template }) {
   const {
@@ -68,7 +68,7 @@ function JobTemplateDetail({ template }) {
   const { id: templateId } = useParams();
   const history = useHistory();
   const brandName = useBrandName();
-
+  const helpText = getHelpText();
   const {
     isLoading: isLoadingInstanceGroups,
     request: fetchInstanceGroups,

awx/ui/src/screens/Template/WorkflowJobTemplateDetail/WorkflowJobTemplateDetail.js

@@ -25,7 +25,7 @@ import Sparkline from 'components/Sparkline';
 import { toTitleCase } from 'util/strings';
 import { relatedResourceDeleteRequests } from 'util/getRelatedResourceDeleteDetails';
 import useRequest, { useDismissableError } from 'hooks/useRequest';
-import helpText from '../shared/WorkflowJobTemplate.helptext';
+import getHelpText from '../shared/WorkflowJobTemplate.helptext';
 
 function WorkflowJobTemplateDetail({ template }) {
   const {
@@ -44,7 +44,7 @@ function WorkflowJobTemplateDetail({ template }) {
     scm_branch: scmBranch,
     limit,
   } = template;
-
+  const helpText = getHelpText();
   const urlOrigin = window.location.origin;
   const history = useHistory();
 

awx/ui/src/screens/Template/shared/JobTemplate.helptext.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { t } from '@lingui/macro';
 import getDocsBaseUrl from 'util/getDocsBaseUrl';
 
-const jtHelpTextStrings = {
+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.`,
   inventory: t`Select the inventory containing the hosts you want this job to manage.`,
   project: t`Select the project containing the playbook you want this job to execute.`,
@@ -60,6 +60,6 @@ const jtHelpTextStrings = {
       {t`for more information.`}
     </span>
   ),
-};
+});
 
 export default jtHelpTextStrings;

awx/ui/src/screens/Template/shared/JobTemplateForm.js

@@ -46,7 +46,7 @@ import LabelSelect from 'components/LabelSelect';
 import { VerbositySelectField } from 'components/VerbositySelectField';
 import PlaybookSelect from './PlaybookSelect';
 import WebhookSubForm from './WebhookSubForm';
-import helpText from './JobTemplate.helptext';
+import getHelpText from './JobTemplate.helptext';
 
 const { origin } = document.location;
 
@@ -60,6 +60,7 @@ function JobTemplateForm({
   validateField,
   isOverrideDisabledLookup, // TODO: this is a confusing variable name
 }) {
+  const helpText = getHelpText();
   const [contentError, setContentError] = useState(false);
   const [allowCallbacks, setAllowCallbacks] = useState(
     Boolean(template?.host_config_key)

awx/ui/src/screens/Template/shared/WebhookSubForm.js

@@ -22,9 +22,10 @@ import {
   WorkflowJobTemplatesAPI,
   CredentialTypesAPI,
 } from 'api';
-import helpText from './WorkflowJobTemplate.helptext';
+import getHelpText from './WorkflowJobTemplate.helptext';
 
 function WebhookSubForm({ templateType }) {
+  const helpText = getHelpText();
   const { setFieldValue } = useFormikContext();
   const { id } = useParams();
   const { pathname } = useLocation();

awx/ui/src/screens/Template/shared/WorkflowJobTemplate.helptext.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { t } from '@lingui/macro';
 
-const wfHelpTextStrings = {
+const wfHelpTextStrings = () => ({
   inventory: t`Select an inventory for the workflow. This inventory is applied to all workflow nodes that prompt for an inventory.`,
   limit: t`Provide a host pattern to further constrain
   the list of hosts that will be managed or affected by the
@@ -24,6 +24,6 @@ const wfHelpTextStrings = {
       <p>{t`Webhooks: Enable Webhook for this workflow job template.`}</p>
     </>
   ),
-};
+});
 
 export default wfHelpTextStrings;

awx/ui/src/screens/Template/shared/WorkflowJobTemplateForm.js

@@ -28,7 +28,7 @@ import Popover from 'components/Popover';
 import { WorkFlowJobTemplate } from 'types';
 import LabelSelect from 'components/LabelSelect';
 import WebhookSubForm from './WebhookSubForm';
-import helpText from './WorkflowJobTemplate.helptext';
+import getHelpText from './WorkflowJobTemplate.helptext';
 
 const urlOrigin = window.location.origin;
 
@@ -39,6 +39,7 @@ function WorkflowJobTemplateForm({
   submitError,
   isOrgAdmin,
 }) {
+  const helpText = getHelpText();
   const { setFieldValue, setFieldTouched } = useFormikContext();
   const [enableWebhooks, setEnableWebhooks] = useState(
     Boolean(template.webhook_service)

awx/ui/src/screens/User/UserTokenDetail/UserTokenDetail.js

@@ -12,9 +12,10 @@ import { TokensAPI } from 'api';
 import { formatDateString } from 'util/dates';
 import useRequest, { useDismissableError } from 'hooks/useRequest';
 import { toTitleCase } from 'util/strings';
-import helptext from '../shared/User.helptext';
+import getHelptext from '../shared/User.helptext';
 
 function UserTokenDetail({ token }) {
+  const helptext = getHelptext();
   const { scope, description, created, modified, expires, summary_fields } =
     token;
   const history = useHistory();

awx/ui/src/screens/User/shared/User.helptext.js

@@ -1,8 +1,8 @@
 import { t } from '@lingui/macro';
 
-const userHelpTextStrings = {
+const userHelpTextStrings = () => ({
   application: t`The application that this token belongs to, or leave this field empty to create a Personal Access Token.`,
   scope: t`Scope for the token's access`,
-};
+});
 
 export default userHelpTextStrings;