From 60751dfa16fe0d1d5afc5e496e5c87b18714e27a Mon Sep 17 00:00:00 2001 From: Alex Corey Date: Thu, 15 Oct 2020 15:29:58 -0400 Subject: [PATCH] adds edit functionality --- .../LaunchPrompt/steps/PreviewStep.jsx | 14 ++++++---- .../LaunchPrompt/steps/useSurveyStep.jsx | 18 ++++++++---- .../components/PromptDetail/PromptDetail.jsx | 2 +- .../Modals/NodeModals/NodeEditModal.jsx | 28 ++++++++++++++++--- .../Modals/NodeModals/NodeModal.jsx | 28 ++++++++++--------- .../NodeTypeStep/useNodeTypeStep.jsx | 16 ++--------- .../Modals/NodeModals/useWorkflowNodeSteps.js | 14 ++++++---- 7 files changed, 72 insertions(+), 48 deletions(-) diff --git a/awx/ui_next/src/components/LaunchPrompt/steps/PreviewStep.jsx b/awx/ui_next/src/components/LaunchPrompt/steps/PreviewStep.jsx index d2ee608401..c20f96d0e8 100644 --- a/awx/ui_next/src/components/LaunchPrompt/steps/PreviewStep.jsx +++ b/awx/ui_next/src/components/LaunchPrompt/steps/PreviewStep.jsx @@ -6,6 +6,7 @@ import { t } from '@lingui/macro'; import { useFormikContext } from 'formik'; import { withI18n } from '@lingui/react'; import yaml from 'js-yaml'; +import { parseVariableField } from '../../../util/yaml'; import mergeExtraVars, { maskPasswords } from '../mergeExtraVars'; import getSurveyValues from '../getSurveyValues'; import PromptDetail from '../../PromptDetail'; @@ -27,11 +28,12 @@ function PreviewStep({ resource, config, survey, formErrors, i18n }) { const { values } = useFormikContext(); const surveyValues = getSurveyValues(values); - const overrides = { ...values }; + const overrides = { + ...values, + }; if (config.ask_variables_on_launch || config.survey_enabled) { - const initialExtraVars = config.ask_variables_on_launch - ? overrides.extra_vars || '---' - : resource.extra_vars; + const initialExtraVars = + config.ask_variables_on_launch && (overrides.extra_vars || '---'); if (survey && survey.spec) { const passwordFields = survey.spec .filter(q => q.type === 'password') @@ -47,8 +49,8 @@ function PreviewStep({ resource, config, survey, formErrors, i18n }) { // Api expects extra vars to be merged with the survey data. // We put the extra_data key/value pair on the values object here // so that we don't have to do this loop again inside of the NodeAddModal.jsx - values.extra_data = overrides.extra_vars; - + values.extra_data = + overrides.extra_vars && parseVariableField(overrides?.extra_vars); return ( {formErrors && ( diff --git a/awx/ui_next/src/components/LaunchPrompt/steps/useSurveyStep.jsx b/awx/ui_next/src/components/LaunchPrompt/steps/useSurveyStep.jsx index bbc545fcdd..988bf5da2a 100644 --- a/awx/ui_next/src/components/LaunchPrompt/steps/useSurveyStep.jsx +++ b/awx/ui_next/src/components/LaunchPrompt/steps/useSurveyStep.jsx @@ -8,7 +8,13 @@ import StepName from './StepName'; const STEP_ID = 'survey'; -export default function useSurveyStep(config, i18n, visitedSteps, resource) { +export default function useSurveyStep( + config, + i18n, + visitedSteps, + resource, + nodeToEdit +) { const { values } = useFormikContext(); const { result: survey, request: fetchSurvey, isLoading, error } = useRequest( useCallback(async () => { @@ -48,7 +54,7 @@ export default function useSurveyStep(config, i18n, visitedSteps, resource) { const formError = Object.keys(validate()).length > 0; return { step: getStep(config, survey, validate, i18n, visitedSteps), - initialValues: getInitialValues(config, survey, resource), + initialValues: getInitialValues(config, survey, nodeToEdit), validate, survey, isReady: !isLoading && !!survey, @@ -113,7 +119,7 @@ function getStep(config, survey, validate, i18n, visitedSteps) { }; } -function getInitialValues(config, survey, resource) { +function getInitialValues(config, survey, nodeToEdit) { if (!config.survey_enabled || !survey) { return {}; } @@ -126,11 +132,11 @@ function getInitialValues(config, survey, resource) { } else { values[`survey_${question.variable}`] = question.default; } - if (resource?.extra_data) { - Object.entries(resource?.extra_data).forEach(([key, value]) => { + if (nodeToEdit?.extra_data) { + Object.entries(nodeToEdit?.extra_data).forEach(([key, value]) => { if (key === question.variable) { if (question.type === 'multiselect') { - values[`survey_${question.variable}`] = value.split('\n'); + values[`survey_${question.variable}`] = value; } else { values[`survey_${question.variable}`] = value; } diff --git a/awx/ui_next/src/components/PromptDetail/PromptDetail.jsx b/awx/ui_next/src/components/PromptDetail/PromptDetail.jsx index e6eccdbe6a..a59fd7ba7f 100644 --- a/awx/ui_next/src/components/PromptDetail/PromptDetail.jsx +++ b/awx/ui_next/src/components/PromptDetail/PromptDetail.jsx @@ -143,7 +143,7 @@ function PromptDetail({ i18n, resource, launchConfig = {}, overrides = {} }) { value={toTitleCase(overrides.job_type)} /> )} - {overrides?.credentials && ( + {overrides?.credentials?.length > 0 && ( { + const updateNode = (values, linkType, config) => { + const { added, removed } = getAddedAndRemoved( + config?.defaults?.credentials, + values?.credentials + ); + if (added?.length > 0) { + values.addedCredentals = added; + } + if (removed?.length > 0) { + values.removedCredentals = removed; + } + values.inventory = values?.inventory?.id; + delete values.linkType; + const node = { + nodeResource: values.nodeResource, + }; + if ( + values?.nodeType === 'job_template' || + values?.nodeType === 'workflow_job_template' + ) { + node.promptValues = values; + } dispatch({ type: 'UPDATE_NODE', - node: { - nodeResource: resource, - }, + node, }); }; diff --git a/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeModal.jsx b/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeModal.jsx index de598daf6f..72bdb710e5 100644 --- a/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeModal.jsx +++ b/awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeModal.jsx @@ -49,11 +49,7 @@ function NodeModalForm({ askLinkType, i18n, onSave, title, credentialError }) { const history = useHistory(); const dispatch = useContext(WorkflowDispatchContext); const { nodeToEdit } = useContext(WorkflowStateContext); - const { - values, - setTouched, - validateForm, - } = useFormikContext(); + const { values, setTouched, validateForm } = useFormikContext(); const [triggerNext, setTriggerNext] = useState(0); @@ -149,7 +145,11 @@ function NodeModalForm({ askLinkType, i18n, onSave, title, credentialError }) { }, ]), ]; - + const nextButtonText = activeStep => + activeStep.id === steps[steps?.length - 1]?.id || + activeStep.name === 'Preview' + ? i18n._(t`Save`) + : i18n._(t`Next`); const CustomFooter = ( @@ -158,23 +158,25 @@ function NodeModalForm({ askLinkType, i18n, onSave, title, credentialError }) { setTriggerNext(triggerNext + 1)} - buttonText={ - activeStep.id === steps[steps?.length - 1]?.id || - activeStep.name === 'Preview' - ? i18n._(t`Save`) - : i18n._(t`Next`) - } + buttonText={nextButtonText(activeStep)} /> {activeStep && activeStep.id !== steps[0]?.id && ( - )}