Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 | 70x 70x 70x 70x 70x 70x 70x 70x 70x 70x 70x 70x 7x 7x 7x 7x 7x 7x 70x 70x 2x 2x | /*
* Copyright 2022 Harness Inc. All rights reserved.
* Use of this source code is governed by the PolyForm Shield 1.0.0 license
* that can be found in the licenses directory at the root of this repository, also available at
* https://polyformproject.org/wp-content/uploads/2020/06/PolyForm-Shield-1.0.0.txt.
*/
import React, { useState } from 'react'
import {
Text,
HarnessDocTooltip,
Layout,
Container,
MultiTypeInputType,
getMultiTypeFromValue
} from '@wings-software/uicore'
import { Color } from '@harness/design-system'
import { isEmpty, get } from 'lodash-es'
import { connect, FormikContext } from 'formik'
import cx from 'classnames'
import type { StageElementConfig } from 'services/cd-ng'
import { useVariablesExpression } from '@pipeline/components/PipelineStudio/PiplineHooks/useVariablesExpression'
import { MultiTypeExecutionCondition } from '@common/components/MultiTypeExecutionCondition/MultiTypeExecutionCondition'
import DelegateSelectorPanel from '@pipeline/components/PipelineSteps/AdvancedSteps/DelegateSelectorPanel/DelegateSelectorPanel'
import { useStrings } from 'framework/strings'
import css from './PipelineInputSetForm.module.scss'
import stepCss from '@pipeline/components/PipelineSteps/Steps/Steps.module.scss'
interface StageAdvancedInputSetFormProps {
deploymentStageTemplate?: StageElementConfig
path: string
readonly?: boolean
stageIdentifier?: string
allowableTypes?: MultiTypeInputType[]
delegateSelectors?: string[] | string
}
interface ConditionalExecutionFormProps {
readonly?: boolean
path: string
allowableTypes?: MultiTypeInputType[]
formik?: FormikContext<any>
}
function ConditionalExecutionFormInternal(props: ConditionalExecutionFormProps): React.ReactElement {
const { readonly, path, allowableTypes, formik } = props
const { getString } = useStrings()
const conditionValue = get(formik?.values, path)
const { expressions } = useVariablesExpression()
const [multiType, setMultiType] = useState<MultiTypeInputType>(getMultiTypeFromValue(conditionValue))
return (
<Container margin={{ bottom: 'medium' }}>
<Layout.Vertical flex={{ alignItems: 'flex-start' }}>
<Text
color={Color.GREY_600}
margin={{ bottom: 'small' }}
className={css.conditionalExecutionTitle}
font={{ weight: 'semi-bold' }}
>
{getString('pipeline.conditionalExecution.title')}
</Text>
<Text width="85%" color={Color.GREY_500} margin={{ bottom: 'small' }} font={{ size: 'small' }}>
{getString('pipeline.conditionalExecution.conditionLabel')}
<HarnessDocTooltip tooltipId="conditionalExecution" useStandAlone={true} />
</Text>
<Container width="100%">
<MultiTypeExecutionCondition
path={path}
allowableTypes={allowableTypes}
multiType={multiType}
setMultiType={setMultiType}
readonly={readonly}
expressions={expressions}
/>
</Container>
</Layout.Vertical>
</Container>
)
}
export const ConditionalExecutionForm = connect(ConditionalExecutionFormInternal)
export function StageAdvancedInputSetForm({
deploymentStageTemplate,
path,
readonly,
stageIdentifier,
allowableTypes,
delegateSelectors = []
}: StageAdvancedInputSetFormProps): React.ReactElement {
const { getString } = useStrings()
return (
<>
<div id={`Stage.${stageIdentifier}.Advanced`} className={cx(css.accordionSummary)}>
<div className={css.inputheader}>{getString('advancedTitle')}</div>
{!isEmpty(/* istanbul ignore next */ delegateSelectors) && (
<div className={cx(css.nestedAccordions, stepCss.formGroup, stepCss.md)}>
<DelegateSelectorPanel
isReadonly={readonly || false}
allowableTypes={allowableTypes}
name={`${path}.delegateSelectors`}
/>
</div>
)}
{!isEmpty(/* istanbul ignore next */ deploymentStageTemplate?.when?.condition) && (
<div className={cx(css.nestedAccordions, stepCss.formGroup, stepCss.md)}>
<ConditionalExecutionForm
readonly={readonly}
path={`${path}.when.condition`}
allowableTypes={allowableTypes}
/>
</div>
)}
</div>
</>
)
}
|