diff --git a/awx/ui_next/src/components/LaunchPrompt/LaunchPrompt.jsx b/awx/ui_next/src/components/LaunchPrompt/LaunchPrompt.jsx index 6d83fcbb28..da0a74fa4a 100644 --- a/awx/ui_next/src/components/LaunchPrompt/LaunchPrompt.jsx +++ b/awx/ui_next/src/components/LaunchPrompt/LaunchPrompt.jsx @@ -1,5 +1,5 @@ -import React from 'react'; -import { Wizard } from '@patternfly/react-core'; +import React, { useState } from 'react'; +import { ExpandableSection, Wizard } from '@patternfly/react-core'; import { t } from '@lingui/macro'; import { Formik, useFormikContext } from 'formik'; import ContentError from '../ContentError'; @@ -19,6 +19,7 @@ function PromptModalForm({ resourceDefaultCredentials, }) { const { setFieldTouched, values } = useFormikContext(); + const [showDescription, setShowDescription] = useState(false); const { steps, @@ -102,7 +103,23 @@ function PromptModalForm({ } }} title={t`Launch | ${resource.name}`} - description={resource.description} + description={ + resource.description.length > 512 ? ( + { + setShowDescription(!showDescription); + }} + isExpanded={showDescription} + > + {resource.description} + + ) : ( + resource.description + ) + } steps={ isReady ? steps diff --git a/awx/ui_next/src/components/Schedule/shared/SchedulePromptableFields.jsx b/awx/ui_next/src/components/Schedule/shared/SchedulePromptableFields.jsx index 1eff706902..289c6c3259 100644 --- a/awx/ui_next/src/components/Schedule/shared/SchedulePromptableFields.jsx +++ b/awx/ui_next/src/components/Schedule/shared/SchedulePromptableFields.jsx @@ -1,5 +1,5 @@ -import React from 'react'; -import { Wizard } from '@patternfly/react-core'; +import React, { useState } from 'react'; +import { ExpandableSection, Wizard } from '@patternfly/react-core'; import { t } from '@lingui/macro'; import { useFormikContext } from 'formik'; import AlertModal from '../../AlertModal'; @@ -39,7 +39,7 @@ function SchedulePromptableFields({ credentials, resourceDefaultCredentials ); - + const [showDescription, setShowDescription] = useState(false); const { error, dismissError } = useDismissableError(contentError); const cancelPromptableValues = async () => { resetForm({ @@ -106,7 +106,23 @@ function SchedulePromptableFields({ } }} title={t`Prompt | ${resource.name}`} - description={resource.description} + description={ + resource.description.length > 512 ? ( + { + setShowDescription(!showDescription); + }} + isExpanded={showDescription} + > + {resource.description} + + ) : ( + resource.description + ) + } steps={ isReady ? steps