All files / modules/70-pipeline/components/PipelineSteps/AdvancedSteps/ConditionalExecutionPanel ConditionalExecutionCondition.tsx

90.91% Statements 20/22
75% Branches 6/8
100% Functions 2/2
90.91% Lines 20/22

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              32x 32x 32x   32x 32x 32x 32x     32x 32x               32x 11x 11x 11x 11x 11x 11x   11x                           2x 2x 2x                                      
/*
 * Copyright 2021 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 { Container, getMultiTypeFromValue, HarnessDocTooltip, MultiTypeInputType } from '@wings-software/uicore'
import { Checkbox } from '@blueprintjs/core'
import type { FormikProps } from 'formik'
import cx from 'classnames'
import { useStrings } from 'framework/strings'
import { MultiTypeExecutionCondition } from '@common/components/MultiTypeExecutionCondition/MultiTypeExecutionCondition'
import { useVariablesExpression } from '@pipeline/components/PipelineStudio/PiplineHooks/useVariablesExpression'
import type { StepMode as Modes } from '@pipeline/utils/stepUtils'
import type { ConditionalExecutionOption } from './ConditionalExecutionPanelUtils'
import { ModeEntityNameMap } from './ConditionalExecutionPanelUtils'
import css from './ConditionalExecutionPanel.module.scss'
 
interface ConditionalExecutionConditionProps {
  formikProps: FormikProps<ConditionalExecutionOption>
  mode: Modes
  isReadonly: boolean
}
 
export default function ConditionalExecutionCondition(props: ConditionalExecutionConditionProps): React.ReactElement {
  const { getString } = useStrings()
  const { formikProps, mode, isReadonly } = props
  const conditionValue = formikProps.values?.condition
  const [multiType, setMultiType] = useState<MultiTypeInputType>(getMultiTypeFromValue(conditionValue))
  const isInputDisabled = !formikProps.values.enableJEXL || isReadonly
  const { expressions } = useVariablesExpression()
 
  return (
    <>
      <Checkbox
        name="enableJEXL"
        checked={formikProps.values.enableJEXL}
        disabled={isReadonly}
        className={cx(css.blackText, { [css.active]: formikProps.values.enableJEXL })}
        labelElement={
          <span data-tooltip-id="conditionalExecution">
            {getString('pipeline.conditionalExecution.condition', { entity: ModeEntityNameMap[mode] })}
            <HarnessDocTooltip tooltipId="conditionalExecution" useStandAlone={true} />
          </span>
        }
        onChange={e => {
          const isChecked = e.currentTarget.checked
          formikProps.setFieldValue('enableJEXL', isChecked)
          Iif (!isChecked) {
            formikProps.setFieldValue('condition', null)
            setMultiType(MultiTypeInputType.FIXED)
          }
        }}
      />
      <Container padding={{ top: 'small', left: 'large' }}>
        <MultiTypeExecutionCondition
          path={'condition'}
          allowableTypes={[MultiTypeInputType.FIXED, MultiTypeInputType.RUNTIME]}
          isInputDisabled={isInputDisabled}
          multiType={multiType}
          setMultiType={setMultiType}
          expressions={expressions}
        />
      </Container>
    </>
  )
}