function ActionButton()

in react/features/base/premeeting/components/web/ActionButton.js [179:250]
68 lines of code
15 McCabe index (conditional complexity)

function ActionButton({
    children,
    classes,
    className = '',
    disabled,
    hasOptions,
    OptionsIcon = IconArrowDown,
    testId,
    type = 'primary',
    onClick,
    onOptionsClick,
    tabIndex,
    role,
    ariaPressed,
    ariaLabel,
    ariaDropDownLabel
}: Props) {

    const onKeyPressHandler = useCallback(e => {
        if (onClick && !disabled && (e.key === ' ' || e.key === 'Enter')) {
            e.preventDefault();
            onClick(e);
        }
    }, [ onClick, disabled ]);

    const onOptionsKeyPressHandler = useCallback(e => {
        if (onOptionsClick && !disabled && (e.key === ' ' || e.key === 'Enter')) {
            e.preventDefault();
            e.stopPropagation();
            onOptionsClick(e);
        }
    }, [ onOptionsClick, disabled ]);

    const containerClasses = clsx(
        classes.actionButton,
        className && className,
        type,
        disabled && 'disabled'
    );

    return (
        <div
            aria-disabled = { disabled }
            aria-label = { ariaLabel }
            className = { containerClasses }
            data-testid = { testId ? testId : undefined }
            onClick = { disabled ? undefined : onClick }
            onKeyPress = { onKeyPressHandler }
            role = 'button'
            tabIndex = { 0 } >
            {children}
            { hasOptions
                  && <div
                      aria-disabled = { disabled }
                      aria-haspopup = 'true'
                      aria-label = { ariaDropDownLabel }
                      aria-pressed = { ariaPressed }
                      className = { classes.options }
                      data-testid = 'prejoin.joinOptions'
                      onClick = { disabled ? undefined : onOptionsClick }
                      onKeyPress = { onOptionsKeyPressHandler }
                      role = { role }
                      tabIndex = { tabIndex }>
                      <Icon
                          className = 'icon'
                          size = { 14 }
                          src = { OptionsIcon } />
                  </div>
            }
        </div>
    );
}