@hrobarikt/box-ui-elements

Version:
Box UI Elements
developer.box.com/docs/box-ui-elements
76 lines (65 loc) • 3.34 kB
JavaScript
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }

function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

import * as React from 'react';
import TetherComponent from 'react-tether';
import { FormattedMessage } from 'react-intl';
import DeleteConfirmation from '../common/delete-confirmation';
import IconTrash from '../../../../icons/general/IconTrash';
import Media from '../../../../components/media';
import messages from './messages';
import { ACTIVITY_TARGETS } from '../../../common/interactionTargets';
import { bdlGray } from '../../../../styles/variables';
import { MenuItem } from '../../../../components/menu';

var AnnotationActivityMenu = function AnnotationActivityMenu(_ref) {
  var canDelete = _ref.canDelete,
      id = _ref.id,
      onDeleteConfirm = _ref.onDeleteConfirm;

  var _React$useState = React.useState(false),
      _React$useState2 = _slicedToArray(_React$useState, 2),
      isConfirmingDelete = _React$useState2[0],
      setIsConfirmingDelete = _React$useState2[1];

  var handleDeleteCancel = function handleDeleteCancel() {
    setIsConfirmingDelete(false);
  };

  var handleDeleteClick = function handleDeleteClick() {
    setIsConfirmingDelete(true);
  };

  var handleDeleteConfirm = function handleDeleteConfirm() {
    setIsConfirmingDelete(false);
    onDeleteConfirm();
  };

  var tetherProps = {
    attachment: 'top right',
    className: 'bcs-AnnotationActivity-deleteConfirmationModal',
    constraints: [{
      to: 'scrollParent',
      attachment: 'together'
    }],
    targetAttachment: 'bottom right'
  };
  return React.createElement(TetherComponent, tetherProps, canDelete && React.createElement(Media.Menu, {
    isDisabled: isConfirmingDelete,
    "data-testid": "annotation-activity-actions-menu",
    menuProps: {
      'data-resin-component': 'preview',
      'data-resin-feature': 'annotations'
    }
  }, React.createElement(MenuItem, {
    "data-resin-itemid": id,
    "data-resin-target": ACTIVITY_TARGETS.ANNOTATION_OPTIONS_DELETE,
    "data-testid": "delete-annotation-activity",
    onClick: handleDeleteClick
  }, React.createElement(IconTrash, {
    color: bdlGray
  }), React.createElement(FormattedMessage, messages.annotationActivityDeleteMenuItem))), isConfirmingDelete && React.createElement(DeleteConfirmation, {
    "data-resin-component": ACTIVITY_TARGETS.ANNOTATION_OPTIONS,
    isOpen: isConfirmingDelete,
    message: messages.annotationActivityDeletePrompt,
    onDeleteCancel: handleDeleteCancel,
    onDeleteConfirm: handleDeleteConfirm
  }));
};

export default AnnotationActivityMenu;
//# sourceMappingURL=AnnotationActivityMenu.js.map