decidim-comments 0.23.0 → 0.24.0.rc1

data/app/frontend/comments/up_vote_button.component.test.tsx

@@ -1,59 +0,0 @@
-import { shallow } from "enzyme";
-import * as React from "react";
-
-import { UpVoteButton } from "./up_vote_button.component";
-import VoteButton from "./vote_button.component";
-
-import generateCommentsData from "../support/generate_comments_data";
-import generateUserData from "../support/generate_user_data";
-
-import { UpVoteButtonFragment } from "../support/schema";
-
-describe("<UpVoteButton />", () => {
-  const orderBy = "older";
-  const rootCommentable = {
-    id: "1",
-    type: "Decidim::DummyResources::DummyResource"
-  };
-  let comment: UpVoteButtonFragment;
-  let session: any = null;
-  const upVote = jasmine.createSpy("upVote");
-
-  beforeEach(() => {
-    const commentsData = generateCommentsData(1);
-    session = {
-      user: generateUserData()
-    };
-    comment = commentsData[0];
-  });
-
-  it("should render a VoteButton component with the correct props", () => {
-    const wrapper = shallow(<UpVoteButton session={session} comment={comment} upVote={upVote} rootCommentable={rootCommentable} orderBy={orderBy} />);
-    expect(wrapper.find(VoteButton).prop("buttonClassName")).toEqual("comment__votes--up");
-    expect(wrapper.find(VoteButton).prop("iconName")).toEqual("icon-chevron-top");
-    expect(wrapper.find(VoteButton).prop("votes")).toEqual(comment.upVotes);
-  });
-
-  it("should pass disabled prop as false if comment upVoted is true", () => {
-    comment.upVoted = true;
-    const wrapper = shallow(<UpVoteButton session={session} comment={comment} upVote={upVote} rootCommentable={rootCommentable} orderBy={orderBy} />);
-    expect(wrapper.find(VoteButton).prop("disabled")).toBeFalsy();
-  });
-
-  it("should pass disabled prop as false if comment downVoted is true", () => {
-    comment.downVoted = true;
-    const wrapper = shallow(<UpVoteButton session={session} comment={comment} upVote={upVote} rootCommentable={rootCommentable} orderBy={orderBy} />);
-    expect(wrapper.find(VoteButton).prop("disabled")).toBeFalsy();
-  });
-
-  describe("when session is not present", () => {
-    beforeEach(() => {
-      session = null;
-    });
-
-    it("should pass userLoggedIn as false", () => {
-      const wrapper = shallow(<UpVoteButton session={session} comment={comment} upVote={upVote} rootCommentable={rootCommentable} orderBy={orderBy} />);
-      expect(wrapper.find(VoteButton).prop("userLoggedIn")).toBeFalsy();
-    });
-  });
-});

data/app/frontend/comments/up_vote_button.component.tsx

@@ -1,133 +0,0 @@
-import * as React from "react";
-import { graphql, MutationFunc } from "react-apollo";
-
-const PropTypes = require("prop-types");
-
-import VoteButton from "./vote_button.component";
-
-const { I18n } = require("react-i18nify");
-
-import {
-  AddCommentFormCommentableFragment,
-  AddCommentFormSessionFragment,
-  CommentFragment,
-  GetCommentsQuery,
-  UpVoteButtonFragment,
-  UpVoteMutation
-} from "../support/schema";
-
-interface UpVoteButtonProps {
-  session: AddCommentFormSessionFragment & {
-    user: any;
-  } | null;
-  comment: UpVoteButtonFragment;
-  upVote?: (context: any) => void;
-  rootCommentable: AddCommentFormCommentableFragment;
-  orderBy: string;
-}
-
-export const UpVoteButton: React.SFC<UpVoteButtonProps> = (
-  {
-    session,
-    comment: { upVotes, upVoted, downVoted },
-    upVote
-  },
-  context) => {
-  let selectedClass = "";
-
-  if (upVoted) {
-    selectedClass = "is-vote-selected";
-  } else if (downVoted) {
-     selectedClass = "is-vote-notselected";
-  }
-
-  const userLoggedIn = session && session.user;
-  const disabled = false;
-  const voteAction = () => upVote && upVote(context);
-
-  return (
-    <VoteButton
-      buttonClassName="comment__votes--up"
-      iconName="icon-chevron-top"
-      text={I18n.t("components.up_vote_button.text")}
-      votes={upVotes}
-      voteAction={voteAction}
-      disabled={disabled}
-      selectedClass={selectedClass}
-      userLoggedIn={userLoggedIn}
-    />
-  );
-};
-
-UpVoteButton.contextTypes = {
-  locale: PropTypes.string,
-  toggleTranslations: PropTypes.bool
-};
-
-const upVoteMutation = require("../mutations/up_vote.mutation.graphql");
-const getCommentsQuery = require("../queries/comments.query.graphql");
-
-const UpVoteButtonWithMutation = graphql<UpVoteMutation, UpVoteButtonProps>(upVoteMutation, {
-  props: ({ ownProps, mutate }: { ownProps: UpVoteButtonProps, mutate: MutationFunc<UpVoteMutation> }) => ({
-    upVote: ({ locale, toggleTranslations }: any) => mutate({
-      variables: {
-        locale,
-        toggleTranslations,
-        id: ownProps.comment.id
-      },
-      optimisticResponse: {
-        __typename: "Mutation",
-        comment: {
-          __typename: "CommentMutation",
-          upVote: {
-            __typename: "Comment",
-            ...ownProps.comment,
-            upVotes: ownProps.comment.upVotes + (ownProps.comment.upVoted ? -1 : 1),
-            upVoted: true
-          }
-        }
-      },
-      update: (store, { data }: { data: UpVoteMutation }) => {
-        const variables = {
-          locale,
-          toggleTranslations,
-          commentableId: ownProps.rootCommentable.id,
-          commentableType: ownProps.rootCommentable.type,
-          orderBy: ownProps.orderBy,
-          singleCommentId: null
-        };
-
-        const commentReducer = (comment: CommentFragment): CommentFragment => {
-          const replies = comment.comments || [];
-
-          if (comment.id === ownProps.comment.id && data.comment) {
-            return data.comment.upVote;
-          }
-
-          return {
-            ...comment,
-            comments: replies.map(commentReducer)
-          };
-        };
-
-        const prev = store.readQuery<GetCommentsQuery>({ query: getCommentsQuery, variables });
-
-        if (prev) {
-          store.writeQuery({
-            query: getCommentsQuery,
-            data: {
-              ...prev,
-              commentable: {
-                ...prev.commentable,
-                comments: prev.commentable.comments.map(commentReducer)
-              }
-            },
-            variables
-          });
-        }
-      }
-    })
-  })
-})(UpVoteButton);
-
-export default UpVoteButtonWithMutation;

data/app/frontend/comments/vote_button.component.tsx

@@ -1,50 +0,0 @@
-import * as React from "react";
-import Icon from "../application/icon.component";
-
-interface VoteButtonProps {
-  buttonClassName: string;
-  iconName: string;
-  text: string;
-  votes: number;
-  voteAction?: () => void;
-  disabled?: boolean;
-  selectedClass?: string;
-  userLoggedIn: boolean;
-}
-
-const preventDefault = (event: any) => {
-  event.preventDefault();
-};
-
-const VoteButton: React.SFC<VoteButtonProps> = ({
-  buttonClassName,
-  iconName,
-  text,
-  votes,
-  voteAction,
-  disabled,
-  selectedClass,
-  userLoggedIn
-}) => (
-  <button
-    className={`${buttonClassName} ${selectedClass}`}
-    onClick={userLoggedIn ? voteAction : preventDefault}
-    disabled={disabled}
-    title={text}
-    data-open={userLoggedIn ? null : "loginModal"}
-  >
-    <span className="show-for-sr">{text}</span>
-    <Icon name={iconName} iconExtraClassName="icon--small" />
-    {` ${votes}`}
-  </button>
-);
-
-VoteButton.defaultProps = {
-  buttonClassName: "",
-  iconName: "",
-  votes: 0,
-  selectedClass: "selected",
-  disabled: false
-};
-
-export default VoteButton;

data/app/frontend/comments/vote_button_component.test.tsx

@@ -1,64 +0,0 @@
-import { shallow } from "enzyme";
-import * as React from "react";
-import Icon from "../application/icon.component";
-import VoteButton from "./vote_button.component";
-
-describe("<VoteButton />", () => {
-  const voteAction: jasmine.Spy = jasmine.createSpy("voteAction");
-  const preventDefault: jasmine.Spy = jasmine.createSpy("preventDefault");
-
-  beforeEach(() => {
-    voteAction.calls.reset();
-    preventDefault.calls.reset();
-  });
-
-  it("should render the number of votes passed as a prop", () => {
-    const wrapper = shallow(<VoteButton votes={10} buttonClassName="vote-button" iconName="vote-icon" text="Test" voteAction={voteAction} userLoggedIn={true} />);
-    expect(wrapper.find("button").text()).toMatch(/10/);
-  });
-
-  it("should render a button with the given buttonClassName", () => {
-    const wrapper = shallow(<VoteButton votes={10} buttonClassName="vote-button" iconName="vote-icon" text="Test" voteAction={voteAction} userLoggedIn={true} />);
-    expect(wrapper.find("button.vote-button").exists()).toBeTruthy();
-  });
-
-  it("should render a Icon component with the correct name prop", () => {
-    const wrapper = shallow(<VoteButton votes={10} buttonClassName="vote-button" iconName="vote-icon" text="Test" voteAction={voteAction} userLoggedIn={true} />);
-    expect(wrapper.find(Icon).prop("name")).toEqual("vote-icon");
-  });
-
-  it("should render a button with the text as title attribute and screen reader visible element", () => {
-    const wrapper = shallow(<VoteButton votes={10} buttonClassName="vote-button" iconName="vote-icon" text="Test" voteAction={voteAction} userLoggedIn={true} />);
-    expect(wrapper.find("button").prop("title")).toBe("Test");
-    expect(wrapper.find("button span.show-for-sr").text()).toEqual("Test");
-  });
-
-  it("should call the voteAction prop on click", () => {
-    const wrapper = shallow(<VoteButton votes={10} buttonClassName="vote-button" iconName="vote-icon" text="Test" voteAction={voteAction} userLoggedIn={true} />);
-    wrapper.find("button").simulate("click");
-    expect(voteAction).toHaveBeenCalled();
-  });
-
-  it("should disable the button based on the disabled prop", () => {
-    const wrapper = shallow(<VoteButton votes={10} buttonClassName="vote-button" iconName="vote-icon" text="Test" voteAction={voteAction} disabled={true} userLoggedIn={true} />);
-    expect(wrapper.find("button").props()).toHaveProperty("disabled");
-  });
-
-  it("should render a button with the given selectedClass", () => {
-    const wrapper = shallow(<VoteButton votes={10} buttonClassName="vote-button" iconName="vote-icon" text="Test" voteAction={voteAction} disabled={true} selectedClass="is-vote-selected" userLoggedIn={true} />);
-    expect(wrapper.find(".is-vote-selected").exists()).toBeTruthy();
-  });
-
-  describe("when userLoggedIn prop is false", () => {
-    it("should add data-open prop as 'loginModal' to the button", () => {
-      const wrapper = shallow(<VoteButton votes={10} buttonClassName="vote-button" iconName="vote-icon" text="Test" voteAction={voteAction} userLoggedIn={false} />);
-      expect(wrapper.find("button").prop("data-open")).toBe("loginModal");
-    });
-
-    it("should call the event preventDefault method", () => {
-      const wrapper = shallow(<VoteButton votes={10} buttonClassName="vote-button" iconName="vote-icon" text="Test" voteAction={voteAction} userLoggedIn={false} />);
-      wrapper.find("button").simulate("click", { preventDefault });
-      expect(preventDefault).toHaveBeenCalled();
-    });
-  });
-});

data/app/frontend/entry.ts

@@ -1,38 +0,0 @@
-import * as React from "react";
-import * as ReactDOM from "react-dom";
-
-import Comments, { CommentsApplicationProps } from "./comments/comments.component";
-import loadTranslations from "./support/load_translations";
-
-window.DecidimComments = window.DecidimComments || {};
-
-interface StorageDict {
-  [key: string]: string;
-}
-
-window.DecidimComments.renderCommentsComponent = (nodeId: string, props: CommentsApplicationProps) => {
-  const node = window.$(`#${nodeId}`)[0];
-  const queryDict: StorageDict = {};
-  window
-    .location
-    .search
-    .substr(1)
-    .split("&")
-    .forEach(item => queryDict[item.split("=")[0]] = item.split("=")[1]);
-
-  props = { ...props, singleCommentId: queryDict.commentId };
-
-  ReactDOM.render(
-    React.createElement(Comments, props),
-    node
-  );
-
-  if (queryDict.commentId) {
-    $([document.documentElement, document.body]).animate({
-      scrollTop: $("#comments").offset()!.top
-    }, 2000);
-  }
-};
-
-// Load component locales from yaml files
-loadTranslations();

data/app/frontend/entry_test.ts

@@ -1,6 +0,0 @@
-import { configure } from "enzyme";
-import * as Adapter from "enzyme-adapter-react-16";
-
-import "jest-localstorage-mock";
-
-configure({ adapter: new Adapter() });

data/app/frontend/fragments/add_comment_form_commentable.fragment.graphql

@@ -1,4 +0,0 @@
-fragment AddCommentFormCommentable on Commentable {
-  id
-  type
-}

data/app/frontend/fragments/add_comment_form_session.fragment.graphql

@@ -1,6 +0,0 @@
-fragment AddCommentFormSession on Session {
-  verifiedUserGroups {
-    id
-    name
-  }
-}

data/app/frontend/fragments/comment.fragment.graphql

@@ -1,14 +0,0 @@
-#import "../fragments/comment_data.fragment.graphql"
-
-fragment Comment on Comment {
-  ...CommentData
-  comments {
-    ...CommentData
-    comments {
-      ...CommentData
-      comments {
-        ...CommentData
-      }
-    }
-  }
-}

data/app/frontend/fragments/comment_data.fragment.graphql

@@ -1,27 +0,0 @@
-#import "../fragments/up_vote_button.fragment.graphql"
-#import "../fragments/down_vote_button.fragment.graphql"
-
-fragment CommentData on Comment {
-  id
-  sgid
-  type
-  body
-  formattedBody
-  createdAt
-  formattedCreatedAt
-  author {
-    name
-    nickname
-    avatarUrl
-    profilePath
-    deleted
-    badge
-  }
-  hasComments
-  acceptsNewComments
-  userAllowedToComment
-  alignment
-  alreadyReported
-  ...UpVoteButton
-  ...DownVoteButton
-}

data/app/frontend/fragments/comment_thread.fragment.graphql

@@ -1,6 +0,0 @@
-#import "../fragments/comment.fragment.graphql"
-
-fragment CommentThread on Comment {
-  hasComments
-  ...Comment
-}

data/app/frontend/fragments/down_vote_button.fragment.graphql

@@ -1,6 +0,0 @@
-fragment DownVoteButton on Comment {
-  id
-  downVotes
-  downVoted
-  upVoted
-}

data/app/frontend/fragments/up_vote_button.fragment.graphql

@@ -1,6 +0,0 @@
-fragment UpVoteButton on Comment {
-  id
-  upVotes
-  upVoted
-  downVoted
-}

data/app/frontend/mutations/add_comment.mutation.graphql

@@ -1,9 +0,0 @@
-#import "../fragments/comment_thread.fragment.graphql"
-
-mutation addComment($commentableId: String!, $commentableType: String!, $body: String!, $alignment: Int, $userGroupId: ID, $locale: String!, $toggleTranslations: Boolean!)  {
-  commentable(id: $commentableId, type: $commentableType, locale: $locale, toggleTranslations: $toggleTranslations) {
-    addComment(body: $body, alignment: $alignment, userGroupId: $userGroupId) {
-      ...CommentThread
-    }
-  }
-}