function ActionComponent()

in src/components/ActionElement/ActionElement.tsx [90:185]


function ActionComponent({
  actionIndex,
  className,
  isLast,
  actionContext,
  stepIndex,
  testStatus,
}: IActionElement) {
  const { onDeleteAction, onUpdateAction, onSetActionIsOpen } = useContext(StepsContext);
  const isAssertion = actionContext.action.isAssert;
  const [areControlsVisible, setAreControlsVisible] = useState(false);
  const setIsOpen = useCallback(
    (isOpen: boolean) => {
      onSetActionIsOpen(stepIndex, actionIndex, isOpen);
    },
    [actionIndex, stepIndex, onSetActionIsOpen]
  );
  const close = () => setIsOpen(false);
  const { isDragOver, onDropActions, splitStepAtAction } = useDrop(stepIndex, actionIndex);

  if (actionContext?.isSoftDeleted) {
    return null;
  }

  return (
    <Container
      className={className}
      isDragOver={isDragOver}
      id={`action-element-${stepIndex}-${actionIndex}`}
      gutterSize="none"
      {...onDropActions}
    >
      <EuiFlexItem grow={false}>
        <NewStepDividerButton
          actionIndex={actionIndex}
          stepIndex={stepIndex}
          onClick={splitStepAtAction}
        />
      </EuiFlexItem>
      <EuiFlexItem grow={false}>
        <ActionStatusIndicator showRect={isLast} status={testStatus} />
      </EuiFlexItem>
      <Behavior isAssert={isAssertion} omitBorder={isLast}>
        <ActionAccordion
          isDragOver={isDragOver}
          arrowDisplay="none"
          buttonProps={{ style: { display: 'none' } }}
          paddingSize="m"
          data-testid={`step-accordion-${actionContext.title}`}
          id={`step-accordion-${actionContext.title}`}
          initialIsOpen={actionContext.isOpen}
          forceState={actionContext.isOpen ? 'open' : 'closed'}
          onMouseOver={() => {
            if (!areControlsVisible) {
              setAreControlsVisible(true);
            }
          }}
          onMouseLeave={() => {
            setAreControlsVisible(false);
          }}
          extraAction={
            <ExtraActions
              actionIndex={actionIndex}
              areControlsVisible={areControlsVisible}
              isOpen={actionContext.isOpen ?? false}
              setIsOpen={setIsOpen}
              actionContext={actionContext}
              stepIndex={stepIndex}
            />
          }
        >
          {!actionContext.action.isAssert && actionContext.isOpen && (
            <ActionDetail
              actionContext={actionContext}
              actionIndex={actionIndex}
              close={close}
              stepIndex={stepIndex}
            />
          )}
          {actionContext.action.isAssert && actionContext.isOpen && (
            <Assertion
              actionIndex={actionIndex}
              actionContext={actionContext}
              close={close}
              onDeleteAction={onDeleteAction}
              saveAssertion={(updatedAction: ActionInContext) => {
                onUpdateAction(updatedAction, stepIndex, actionIndex);
              }}
              stepIndex={stepIndex}
            />
          )}
        </ActionAccordion>
      </Behavior>
    </Container>
  );
}