All files / buffer-web-components/ColabTool/Shared/PostFooterApproval index.jsx

100% Statements 13/13
100% Branches 12/12
100% Functions 1/1
100% Lines 13/13
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                          2x           2x                 109x 109x   109x 16x                           93x 13x                           80x 48x                         32x     2x                   2x                  
import React from 'react';
import PropTypes from 'prop-types';
import {
  Button,
} from '@bufferapp/components';
import {
  borderWidth,
} from '@bufferapp/components/style/border';
import {
  mystic,
} from '@bufferapp/components/style/color';
import HoverableText from '../../../HoverableText';
 
const verticalLineStyle = {
  marginRight: '0.7rem',
  marginLeft: '0.7rem',
  borderLeft: `${borderWidth} solid ${mystic}`,
};
 
const PostFooterApproval = ({
  hasPermission,
  isPastDue,
  onApproveClick,
  onRequestApprovalClick,
  onRescheduleClick,
  manager,
  view,
}) => {
  const isDraftsView = view === 'drafts';
  const managerCopy = isDraftsView ? 'Add to Queue' : 'Approve';
 
  if (isPastDue && hasPermission) {
    return (<span>
      <span style={verticalLineStyle} />
      <Button onClick={onRescheduleClick} noStyle>
        <HoverableText
          size={'small'}
          color={'curiousBlue'}
          hoverColor={'toryBlue'}
        >
          Reschedule
        </HoverableText>
      </Button>
    </span>);
  }
 
  if (manager) {
    return (<span>
      <span style={verticalLineStyle} />
      <Button onClick={onApproveClick} noStyle>
        <HoverableText
          size={'small'}
          color={'curiousBlue'}
          hoverColor={'toryBlue'}
        >
          {managerCopy}
        </HoverableText>
      </Button>
    </span>);
  }
 
  if (isDraftsView && hasPermission) {
    return (<span>
      <span style={verticalLineStyle} />
      <Button onClick={onRequestApprovalClick} noStyle>
        <HoverableText
          size={'small'}
          color={'curiousBlue'}
          hoverColor={'toryBlue'}
        >
          Request Approval
        </HoverableText>
      </Button>
    </span>);
  }
  return null;
};
 
PostFooterApproval.propTypes = {
  hasPermission: PropTypes.bool.isRequired,
  isPastDue: PropTypes.bool,
  onApproveClick: PropTypes.func,
  onRequestApprovalClick: PropTypes.func,
  onRescheduleClick: PropTypes.func,
  manager: PropTypes.bool.isRequired,
  view: PropTypes.string.isRequired,
};
 
PostFooterApproval.defaultProps = {
  isPastDue: false,
  manager: false,
  onApproveClick: undefined,
  onRequestApprovalClick: undefined,
  onRescheduleClick: undefined,
};
 
export default PostFooterApproval;