// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`loads more 1`] = `
<div
  data-testid="decisionHistory-container"
>
  <div
    className="Box-root Flex-root Title-root Flex-flex Flex-alignCenter"
  >
    <i
      aria-hidden="true"
      className="Icon-root Icon-md Title-icon"
    >
      history
    </i>
    <span
      className="Title-text"
    >
      Your Decision History
    </span>
  </div>
  <div
    className="Main-root"
  >
    <ul
      className="DecisionList-root"
    >
      <li
        className="DecisionItem-root"
      >
        <div
          className="Box-root Flex-root Flex-flex"
        >
          <div
            className="DecisionItem-leftCol"
          >
            <i
              aria-hidden="true"
              className="Icon-root Icon-md ApprovedIcon-root"
            >
              check_circled
            </i>
          </div>
          <div>
            <span
              className="Info-root"
            >
              Approved comment by 
              <strong
                className="Username-root"
              >
                dany
              </strong>
            </span>
            <div
              className="Box-root Flex-root Footer-root Flex-flex Flex-alignBaseline"
            >
              <button
                className="BaseButton-root Timestamp-root"
                onBlur={[Function]}
                onClick={[Function]}
                onFocus={[Function]}
                onMouseOut={[Function]}
                onMouseOver={[Function]}
                onTouchEnd={[Function]}
                type="button"
              >
                <time
                  className="RelativeTime-root Timestamp-text Timestamp-root"
                  dateTime="2018-11-29T16:01:51.897Z"
                  title="2018-11-29T16:01:51.897Z"
                >
                  2018-11-29T16:01:51.897Z
                </time>
              </button>
              <div
                className="DotDivider-root"
              >
                •
              </div>
              <a
                className="TextLink-root GoToCommentLink-root"
                href="/admin/moderate/comment/1b41be9f-510f-41f3-a1df-5a431dc98bf3"
                onClick={[Function]}
              >
                <span>
                  Go to comment
                </span>
                 
                <i
                  aria-hidden="true"
                  className="Icon-root Icon-sm"
                >
                  chevron_right
                </i>
              </a>
            </div>
          </div>
        </div>
      </li>
      <li
        className="DecisionItem-root"
      >
        <div
          className="Box-root Flex-root Flex-flex"
        >
          <div
            className="DecisionItem-leftCol"
          >
            <i
              aria-hidden="true"
              className="Icon-root Icon-md RejectedIcon-root"
            >
              cancel
            </i>
          </div>
          <div>
            <span
              className="Info-root"
            >
              Rejected comment by 
              <strong
                className="Username-root"
              >
                dany
              </strong>
            </span>
            <div
              className="Box-root Flex-root Footer-root Flex-flex Flex-alignBaseline"
            >
              <button
                className="BaseButton-root Timestamp-root"
                onBlur={[Function]}
                onClick={[Function]}
                onFocus={[Function]}
                onMouseOut={[Function]}
                onMouseOver={[Function]}
                onTouchEnd={[Function]}
                type="button"
              >
                <time
                  className="RelativeTime-root Timestamp-text Timestamp-root"
                  dateTime="2018-11-29T16:01:45.644Z"
                  title="2018-11-29T16:01:45.644Z"
                >
                  2018-11-29T16:01:45.644Z
                </time>
              </button>
              <div
                className="DotDivider-root"
              >
                •
              </div>
              <a
                className="TextLink-root GoToCommentLink-root"
                href="/admin/moderate/comment/1b41be9f-510f-41f3-a1df-5a431dc98bf3"
                onClick={[Function]}
              >
                <span>
                  Go to comment
                </span>
                 
                <i
                  aria-hidden="true"
                  className="Icon-root Icon-sm"
                >
                  chevron_right
                </i>
              </a>
            </div>
          </div>
        </div>
      </li>
      <li
        className="DecisionItem-root"
      >
        <div
          className="Box-root Flex-root Flex-flex"
        >
          <div
            className="DecisionItem-leftCol"
          >
            <i
              aria-hidden="true"
              className="Icon-root Icon-md ApprovedIcon-root"
            >
              check_circled
            </i>
          </div>
          <div>
            <span
              className="Info-root"
            >
              Approved comment by 
              <strong
                className="Username-root"
              >
                dany
              </strong>
            </span>
            <div
              className="Box-root Flex-root Footer-root Flex-flex Flex-alignBaseline"
            >
              <button
                className="BaseButton-root Timestamp-root"
                onBlur={[Function]}
                onClick={[Function]}
                onFocus={[Function]}
                onMouseOut={[Function]}
                onMouseOver={[Function]}
                onTouchEnd={[Function]}
                type="button"
              >
                <time
                  className="RelativeTime-root Timestamp-text Timestamp-root"
                  dateTime="2018-11-29T16:01:42.060Z"
                  title="2018-11-29T16:01:42.060Z"
                >
                  2018-11-29T16:01:42.060Z
                </time>
              </button>
              <div
                className="DotDivider-root"
              >
                •
              </div>
              <a
                className="TextLink-root GoToCommentLink-root"
                href="/admin/moderate/comment/1b41be9f-510f-41f3-a1df-5a431dc98bf3"
                onClick={[Function]}
              >
                <span>
                  Go to comment
                </span>
                 
                <i
                  aria-hidden="true"
                  className="Icon-root Icon-sm"
                >
                  chevron_right
                </i>
              </a>
            </div>
          </div>
        </div>
      </li>
    </ul>
  </div>
</div>
`;

exports[`opens popover when clicked on button showing loading state 1`] = `
<div
  data-testid="decisionHistory-loading-container"
>
  <div
    className="Box-root Flex-root Title-root Flex-flex Flex-alignCenter"
  >
    <i
      aria-hidden="true"
      className="Icon-root Icon-md Title-icon"
    >
      history
    </i>
    <span
      className="Title-text"
    >
      Your Decision History
    </span>
  </div>
  <div
    className="Main-root"
  >
    <div
      className="Box-root Flex-root DecisionHistoryLoading-container Flex-flex Flex-justifyCenter Flex-alignCenter"
    />
  </div>
</div>
`;

exports[`render popover content 1`] = `
<div
  data-testid="decisionHistory-container"
>
  <div
    className="Box-root Flex-root Title-root Flex-flex Flex-alignCenter"
  >
    <i
      aria-hidden="true"
      className="Icon-root Icon-md Title-icon"
    >
      history
    </i>
    <span
      className="Title-text"
    >
      Your Decision History
    </span>
  </div>
  <div
    className="Main-root"
  >
    <ul
      className="DecisionList-root"
    >
      <li
        className="DecisionItem-root"
      >
        <div
          className="Box-root Flex-root Flex-flex"
        >
          <div
            className="DecisionItem-leftCol"
          >
            <i
              aria-hidden="true"
              className="Icon-root Icon-md ApprovedIcon-root"
            >
              check_circled
            </i>
          </div>
          <div>
            <span
              className="Info-root"
            >
              Approved comment by 
              <strong
                className="Username-root"
              >
                addy
              </strong>
            </span>
            <div
              className="Box-root Flex-root Footer-root Flex-flex Flex-alignBaseline"
            >
              <button
                className="BaseButton-root Timestamp-root"
                onBlur={[Function]}
                onClick={[Function]}
                onFocus={[Function]}
                onMouseOut={[Function]}
                onMouseOver={[Function]}
                onTouchEnd={[Function]}
                type="button"
              >
                <time
                  className="RelativeTime-root Timestamp-text Timestamp-root"
                  dateTime="2018-11-29T16:01:51.897Z"
                  title="2018-11-29T16:01:51.897Z"
                >
                  2018-11-29T16:01:51.897Z
                </time>
              </button>
              <div
                className="DotDivider-root"
              >
                •
              </div>
              <a
                className="TextLink-root GoToCommentLink-root"
                href="/admin/moderate/comment/1b41be9f-510f-41f3-a1df-5a431dc98bf3"
                onClick={[Function]}
              >
                <span>
                  Go to comment
                </span>
                 
                <i
                  aria-hidden="true"
                  className="Icon-root Icon-sm"
                >
                  chevron_right
                </i>
              </a>
            </div>
          </div>
        </div>
      </li>
      <li
        className="DecisionItem-root"
      >
        <div
          className="Box-root Flex-root Flex-flex"
        >
          <div
            className="DecisionItem-leftCol"
          >
            <i
              aria-hidden="true"
              className="Icon-root Icon-md RejectedIcon-root"
            >
              cancel
            </i>
          </div>
          <div>
            <span
              className="Info-root"
            >
              Rejected comment by 
              <strong
                className="Username-root"
              >
                addy
              </strong>
            </span>
            <div
              className="Box-root Flex-root Footer-root Flex-flex Flex-alignBaseline"
            >
              <button
                className="BaseButton-root Timestamp-root"
                onBlur={[Function]}
                onClick={[Function]}
                onFocus={[Function]}
                onMouseOut={[Function]}
                onMouseOver={[Function]}
                onTouchEnd={[Function]}
                type="button"
              >
                <time
                  className="RelativeTime-root Timestamp-text Timestamp-root"
                  dateTime="2018-11-29T16:01:45.644Z"
                  title="2018-11-29T16:01:45.644Z"
                >
                  2018-11-29T16:01:45.644Z
                </time>
              </button>
              <div
                className="DotDivider-root"
              >
                •
              </div>
              <a
                className="TextLink-root GoToCommentLink-root"
                href="/admin/moderate/comment/1b41be9f-510f-41f3-a1df-5a431dc98bf3"
                onClick={[Function]}
              >
                <span>
                  Go to comment
                </span>
                 
                <i
                  aria-hidden="true"
                  className="Icon-root Icon-sm"
                >
                  chevron_right
                </i>
              </a>
            </div>
          </div>
        </div>
      </li>
    </ul>
    <button
      className="BaseButton-root ShowMoreButton-root"
      disabled={false}
      onBlur={[Function]}
      onClick={[Function]}
      onFocus={[Function]}
      onMouseOut={[Function]}
      onMouseOver={[Function]}
      onTouchEnd={[Function]}
      type="button"
    >
      Show More
    </button>
  </div>
</div>
`;

exports[`renders decision history popover button 1`] = `
<div
  className="Popover-root"
  data-testid="decisionHistory-popover"
>
  <button
    aria-controls="decision-history-popover"
    className="BaseButton-root DecisionHistoryButton-historyIcon"
    data-testid="decisionHistory-toggle"
    onBlur={[Function]}
    onClick={[Function]}
    onFocus={[Function]}
    onMouseOut={[Function]}
    onMouseOver={[Function]}
    onTouchEnd={[Function]}
    type="button"
  >
    <i
      aria-hidden="true"
      className="Icon-root Icon-lg"
    >
      history
    </i>
  </button>
  <div
    aria-hidden={true}
    aria-labelledby="decision-history-popover-ariainfo"
    id="decision-history-popover"
    role="dialog"
  >
    <div
      className="AriaInfo-root"
      id="decision-history-popover-ariainfo"
    >
      A dialog showing the decision history
    </div>
  </div>
</div>
`;
