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

exports[`approves single comment 1`] = `
<div
  className="Card-root ModerateCard-root ModerateCard-selected"
  data-testid="moderate-comment-comment-0"
  id="moderate-comment-comment-0"
  onClick={[Function]}
  tabIndex={0}
>
  <div
    className="Box-root Flex-root Flex-flex"
  >
    <div
      className="ModerateCard-mainContainer"
    >
      <div
        className="ModerateCard-topBar"
      >
        <div
          className="Box-root Flex-root Flex-flex Flex-alignCenter"
        >
          <button
            className="BaseButton-root ModerateCard-usernameButton"
            onBlur={[Function]}
            onClick={[Function]}
            onFocus={[Function]}
            onMouseOut={[Function]}
            onMouseOver={[Function]}
            onTouchEnd={[Function]}
            type="button"
          >
            <span
              className="Username-root"
            >
              Isabelle
            </span>
          </button>
          <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"
              dateTime="2018-07-06T18:24:00.000Z"
              title="2018-07-06T18:24:00.000Z"
            >
              2018-07-06T18:24:00.000Z
            </time>
          </button>
          <button
            className="BaseButton-root FeatureButton-root"
            disabled={false}
            onBlur={[Function]}
            onClick={[Function]}
            onFocus={[Function]}
            onMouseOut={[Function]}
            onMouseOver={[Function]}
            onTouchEnd={[Function]}
            type="button"
          >
            <span>
              Feature
            </span>
          </button>
        </div>
      </div>
      <div
        className="ModerateCard-contentArea"
      >
        <div
          className="ModerateCard-content CommentContent-root"
          dangerouslySetInnerHTML={
            Object {
              "__html": "This is the last random sentence I will be writing and I am going to stop mid-sent",
            }
          }
        />
        <div
          className="ModerateCard-viewContext"
        >
          <a
            className="TextLink-root ModerateCard-link"
            href="http://localhost/comment/0"
            target="_blank"
          >
            View Context
            <i
              aria-hidden="true"
              className="Icon-root Icon-xs TextLink-icon"
            >
              open_in_new
            </i>
          </a>
        </div>
        <div
          className="ModerateCard-separator ModerateCard-ruledSeparator"
        />
      </div>
      <div
        className="ModerateCard-footer"
      >
        <div
          className="Box-root HorizontalGutter-root HorizontalGutter-spacing-3"
        >
          <div
            className="Box-root HorizontalGutter-root HorizontalGutter-full"
          >
            <div
              className="Box-root Flex-root Flex-flex Flex-itemGutter gutter"
            >
              <span
                className="Marker-root Marker-colorReported Marker-variantRegular"
              >
                <span>
                  Spam
                </span>
                 
                <span
                  className="Count-root"
                >
                  2
                </span>
              </span>
              <button
                aria-controls="uuid-0"
                aria-expanded={false}
                className="BaseButton-root Button-root Button-sizeRegular Button-colorMono Button-variantText Button-uppercase"
                data-color="mono"
                data-variant="text"
                onBlur={[Function]}
                onClick={[Function]}
                onFocus={[Function]}
                onMouseOut={[Function]}
                onMouseOver={[Function]}
                onTouchEnd={[Function]}
                type="button"
              >
                <span
                  className="Markers-detailsText"
                >
                  Details
                </span>
                <i
                  aria-hidden="true"
                  className="Icon-root Icon-sm ButtonIcon-root"
                >
                  arrow_drop_down
                </i>
              </button>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div
      className="Box-root Flex-root ModerateCard-aside ModerateCard-asideWithoutReplyTo Flex-flex Flex-itemGutter Flex-alignCenter Flex-directionColumn gutter"
    >
      <div
        className="ModerateCard-decision"
      >
        Decision
      </div>
      <div
        className="Box-root Flex-root Flex-flex Flex-itemGutter gutter"
      >
        <button
          aria-label="Reject"
          className="BaseButton-root RejectButton-root"
          disabled={false}
          onBlur={[Function]}
          onClick={[Function]}
          onFocus={[Function]}
          onMouseOut={[Function]}
          onMouseOver={[Function]}
          onTouchEnd={[Function]}
          type="button"
        >
          <i
            aria-hidden="true"
            className="Icon-root Icon-lg RejectButton-icon"
          >
            close
          </i>
        </button>
        <button
          aria-label="Approve"
          className="BaseButton-root ApproveButton-root ApproveButton-invert"
          disabled={true}
          onBlur={[Function]}
          onClick={[Function]}
          onFocus={[Function]}
          onMouseOut={[Function]}
          onMouseOver={[Function]}
          onTouchEnd={[Function]}
          type="button"
        >
          <i
            aria-hidden="true"
            className="Icon-root Icon-lg ApproveButton-icon"
          >
            done
          </i>
        </button>
      </div>
    </div>
  </div>
</div>
`;

exports[`rejects single comment 1`] = `
<div
  className="Card-root ModerateCard-root ModerateCard-selected"
  data-testid="moderate-comment-comment-0"
  id="moderate-comment-comment-0"
  onClick={[Function]}
  tabIndex={0}
>
  <div
    className="Box-root Flex-root Flex-flex"
  >
    <div
      className="ModerateCard-mainContainer"
    >
      <div
        className="ModerateCard-topBar"
      >
        <div
          className="Box-root Flex-root Flex-flex Flex-alignCenter"
        >
          <button
            className="BaseButton-root ModerateCard-usernameButton"
            onBlur={[Function]}
            onClick={[Function]}
            onFocus={[Function]}
            onMouseOut={[Function]}
            onMouseOver={[Function]}
            onTouchEnd={[Function]}
            type="button"
          >
            <span
              className="Username-root"
            >
              Isabelle
            </span>
          </button>
          <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"
              dateTime="2018-07-06T18:24:00.000Z"
              title="2018-07-06T18:24:00.000Z"
            >
              2018-07-06T18:24:00.000Z
            </time>
          </button>
          <button
            className="BaseButton-root FeatureButton-root"
            disabled={false}
            onBlur={[Function]}
            onClick={[Function]}
            onFocus={[Function]}
            onMouseOut={[Function]}
            onMouseOver={[Function]}
            onTouchEnd={[Function]}
            type="button"
          >
            <span>
              Feature
            </span>
          </button>
        </div>
      </div>
      <div
        className="ModerateCard-contentArea"
      >
        <div
          className="ModerateCard-content CommentContent-root"
          dangerouslySetInnerHTML={
            Object {
              "__html": "This is the last random sentence I will be writing and I am going to stop mid-sent",
            }
          }
        />
        <div
          className="ModerateCard-viewContext"
        >
          <a
            className="TextLink-root ModerateCard-link"
            href="http://localhost/comment/0"
            target="_blank"
          >
            View Context
            <i
              aria-hidden="true"
              className="Icon-root Icon-xs TextLink-icon"
            >
              open_in_new
            </i>
          </a>
        </div>
        <div
          className="ModerateCard-separator ModerateCard-ruledSeparator"
        />
      </div>
      <div
        className="ModerateCard-footer"
      >
        <div
          className="Box-root HorizontalGutter-root HorizontalGutter-spacing-3"
        >
          <div
            className="Box-root HorizontalGutter-root HorizontalGutter-full"
          >
            <div
              className="Box-root Flex-root Flex-flex Flex-itemGutter gutter"
            >
              <span
                className="Marker-root Marker-colorReported Marker-variantRegular"
              >
                <span>
                  Spam
                </span>
                 
                <span
                  className="Count-root"
                >
                  2
                </span>
              </span>
              <button
                aria-controls="uuid-0"
                aria-expanded={false}
                className="BaseButton-root Button-root Button-sizeRegular Button-colorMono Button-variantText Button-uppercase"
                data-color="mono"
                data-variant="text"
                onBlur={[Function]}
                onClick={[Function]}
                onFocus={[Function]}
                onMouseOut={[Function]}
                onMouseOver={[Function]}
                onTouchEnd={[Function]}
                type="button"
              >
                <span
                  className="Markers-detailsText"
                >
                  Details
                </span>
                <i
                  aria-hidden="true"
                  className="Icon-root Icon-sm ButtonIcon-root"
                >
                  arrow_drop_down
                </i>
              </button>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div
      className="Box-root Flex-root ModerateCard-aside ModerateCard-asideWithoutReplyTo Flex-flex Flex-itemGutter Flex-alignCenter Flex-directionColumn gutter"
    >
      <div
        className="ModerateCard-decision"
      >
        Decision
      </div>
      <div
        className="Box-root Flex-root Flex-flex Flex-itemGutter gutter"
      >
        <button
          aria-label="Reject"
          className="BaseButton-root RejectButton-root RejectButton-invert"
          disabled={true}
          onBlur={[Function]}
          onClick={[Function]}
          onFocus={[Function]}
          onMouseOut={[Function]}
          onMouseOver={[Function]}
          onTouchEnd={[Function]}
          type="button"
        >
          <i
            aria-hidden="true"
            className="Icon-root Icon-lg RejectButton-icon"
          >
            close
          </i>
        </button>
        <button
          aria-label="Approve"
          className="BaseButton-root ApproveButton-root"
          disabled={false}
          onBlur={[Function]}
          onClick={[Function]}
          onFocus={[Function]}
          onMouseOut={[Function]}
          onMouseOver={[Function]}
          onTouchEnd={[Function]}
          type="button"
        >
          <i
            aria-hidden="true"
            className="Icon-root Icon-lg ApproveButton-icon"
          >
            done
          </i>
        </button>
      </div>
    </div>
  </div>
</div>
`;

exports[`renders single comment view 1`] = `
<div
  data-testid="single-moderate-container"
>
  <div
    className="SubBar-root SingleModerate-subBar SubBar-gutterBegin SubBar-gutterEnd"
  >
    <div
      className="Box-root Flex-root SubBar-container Flex-flex Flex-justifyCenter Flex-alignCenter"
    >
      <a
        className="SingleModerate-subBarBegin"
        href="/admin/moderate/"
        onClick={[Function]}
      >
        Go to moderation queues
      </a>
      <div
        className="SingleModerate-subBarTitle"
      >
        Single Comment View
      </div>
    </div>
  </div>
  <div
    className="SingleModerate-background"
  />
  <div
    className="MainLayout-root"
  >
    <main
      className="SingleModerate-main"
    >
      <div
        className="Box-root HorizontalGutter-root Queue-root HorizontalGutter-double"
      >
        <div
          className="Card-root ModerateCard-root ModerateCard-selected"
          data-testid="moderate-comment-comment-0"
          id="moderate-comment-comment-0"
          onClick={[Function]}
          tabIndex={0}
        >
          <div
            className="Box-root Flex-root Flex-flex"
          >
            <div
              className="ModerateCard-mainContainer"
            >
              <div
                className="ModerateCard-topBar"
              >
                <div
                  className="Box-root Flex-root Flex-flex Flex-alignCenter"
                >
                  <button
                    className="BaseButton-root ModerateCard-usernameButton"
                    onBlur={[Function]}
                    onClick={[Function]}
                    onFocus={[Function]}
                    onMouseOut={[Function]}
                    onMouseOver={[Function]}
                    onTouchEnd={[Function]}
                    type="button"
                  >
                    <span
                      className="Username-root"
                    >
                      Isabelle
                    </span>
                  </button>
                  <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"
                      dateTime="2018-07-06T18:24:00.000Z"
                      title="2018-07-06T18:24:00.000Z"
                    >
                      2018-07-06T18:24:00.000Z
                    </time>
                  </button>
                  <button
                    className="BaseButton-root FeatureButton-root"
                    disabled={false}
                    onBlur={[Function]}
                    onClick={[Function]}
                    onFocus={[Function]}
                    onMouseOut={[Function]}
                    onMouseOver={[Function]}
                    onTouchEnd={[Function]}
                    type="button"
                  >
                    <span>
                      Feature
                    </span>
                  </button>
                </div>
              </div>
              <div
                className="ModerateCard-contentArea"
              >
                <div
                  className="ModerateCard-content CommentContent-root"
                  dangerouslySetInnerHTML={
                    Object {
                      "__html": "This is the last random sentence I will be writing and I am going to stop mid-sent",
                    }
                  }
                />
                <div
                  className="ModerateCard-viewContext"
                >
                  <a
                    className="TextLink-root ModerateCard-link"
                    href="http://localhost/comment/0"
                    target="_blank"
                  >
                    View Context
                    <i
                      aria-hidden="true"
                      className="Icon-root Icon-xs TextLink-icon"
                    >
                      open_in_new
                    </i>
                  </a>
                </div>
                <div
                  className="ModerateCard-separator ModerateCard-ruledSeparator"
                />
              </div>
              <div
                className="ModerateCard-footer"
              >
                <div
                  className="Box-root HorizontalGutter-root HorizontalGutter-spacing-3"
                >
                  <div
                    className="Box-root HorizontalGutter-root HorizontalGutter-full"
                  >
                    <div
                      className="Box-root Flex-root Flex-flex Flex-itemGutter gutter"
                    >
                      <span
                        className="Marker-root Marker-colorReported Marker-variantRegular"
                      >
                        <span>
                          Spam
                        </span>
                         
                        <span
                          className="Count-root"
                        >
                          2
                        </span>
                      </span>
                      <button
                        aria-controls="uuid-0"
                        aria-expanded={false}
                        className="BaseButton-root Button-root Button-sizeRegular Button-colorMono Button-variantText Button-uppercase"
                        data-color="mono"
                        data-variant="text"
                        onBlur={[Function]}
                        onClick={[Function]}
                        onFocus={[Function]}
                        onMouseOut={[Function]}
                        onMouseOver={[Function]}
                        onTouchEnd={[Function]}
                        type="button"
                      >
                        <span
                          className="Markers-detailsText"
                        >
                          Details
                        </span>
                        <i
                          aria-hidden="true"
                          className="Icon-root Icon-sm ButtonIcon-root"
                        >
                          arrow_drop_down
                        </i>
                      </button>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div
              className="Box-root Flex-root ModerateCard-aside ModerateCard-asideWithoutReplyTo Flex-flex Flex-itemGutter Flex-alignCenter Flex-directionColumn gutter"
            >
              <div
                className="ModerateCard-decision"
              >
                Decision
              </div>
              <div
                className="Box-root Flex-root Flex-flex Flex-itemGutter gutter"
              >
                <button
                  aria-label="Reject"
                  className="BaseButton-root RejectButton-root"
                  disabled={false}
                  onBlur={[Function]}
                  onClick={[Function]}
                  onFocus={[Function]}
                  onMouseOut={[Function]}
                  onMouseOver={[Function]}
                  onTouchEnd={[Function]}
                  type="button"
                >
                  <i
                    aria-hidden="true"
                    className="Icon-root Icon-lg RejectButton-icon"
                  >
                    close
                  </i>
                </button>
                <button
                  aria-label="Approve"
                  className="BaseButton-root ApproveButton-root"
                  disabled={false}
                  onBlur={[Function]}
                  onClick={[Function]}
                  onFocus={[Function]}
                  onMouseOut={[Function]}
                  onMouseOver={[Function]}
                  onTouchEnd={[Function]}
                  type="button"
                >
                  <i
                    aria-hidden="true"
                    className="Icon-root Icon-lg ApproveButton-icon"
                  >
                    done
                  </i>
                </button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </main>
  </div>
</div>
`;
