fix warnings

frontend/app/components/comment/comment.test.tsx

@@ -1,9 +1,10 @@
 /** @jsx createElement */
 import { createElement } from 'preact';
-import { mount } from 'enzyme';
+import { mount, shallow, HTMLAttributes } from 'enzyme';
 import { Props, Comment } from './comment';
 import { User, Comment as CommentType, PostInfo } from '@app/common/types';
 import { sleep } from '@app/utils/sleep';
+import { StaticStore } from '@app/common/static_store';
 
 const DefaultProps: Partial<Props> = {
   post_info: {
@@ -25,6 +26,7 @@ const DefaultProps: Partial<Props> = {
   user: {
     admin: false,
     id: 'testuser',
+    picture: 'somepicture-url',
   } as User,
 };
 
@@ -221,5 +223,59 @@ describe('<Comment />', () => {
       const controls = element.find('.comment__verification').first();
       expect(controls.hasClass('comment__verification_clickable')).toEqual(false);
     });
+
+    it('should be editable', () => {
+      const initTime = new Date().toString();
+      const changedTime = new Date(Date.now() + 10 * 1000).toString();
+      const props: Partial<Props> = {
+        ...DefaultProps,
+        user: DefaultProps.user as User,
+        data: {
+          ...DefaultProps.data,
+          id: '100',
+          user: DefaultProps.user as User,
+          vote: 1,
+          time: initTime,
+          delete: false,
+          orig: 'test',
+        } as CommentType,
+        repliesCount: 0,
+      };
+      StaticStore.config.edit_duration = 300;
+
+      const component = shallow(<Comment {...(props as Props)} />);
+
+      expect((component.state('editDeadline') as Date).getTime()).toBe(
+        new Date(new Date(initTime).getTime() + 300 * 1000).getTime()
+      );
+
+      component.setProps<Props & HTMLAttributes>({
+        data: { ...props.data, time: changedTime },
+      });
+
+      expect((component.state('editDeadline') as Date).getTime()).toBe(
+        new Date(new Date(changedTime).getTime() + 300 * 1000).getTime()
+      );
+    });
+
+    it('shoud not be editable', () => {
+      const props: Partial<Props> = {
+        ...DefaultProps,
+        user: DefaultProps.user as User,
+        data: {
+          ...DefaultProps.data,
+          id: '100',
+          user: DefaultProps.user as User,
+          vote: 1,
+          time: new Date(new Date().getDate() - 300).toString(),
+          orig: 'test',
+        } as CommentType,
+      };
+      StaticStore.config.edit_duration = 300;
+
+      const component = shallow(<Comment {...(props as Props)} />);
+
+      expect(component.state('editDeadline')).toBe(null);
+    });
   });
 });

frontend/app/components/comment/comment.tsx

@@ -84,12 +84,11 @@ export class Comment extends Component<Props, State> {
       scoreDelta: 0,
       cachedScore: props.data.score,
       initial: true,
+      ...this.updateState(props),
     };
 
     this.votingPromise = Promise.resolve();
 
-    this.updateState(props);
-
     this.toggleEditing = this.toggleEditing.bind(this);
     this.toggleReplying = this.toggleReplying.bind(this);
     this.blockUser = debounce(this.blockUser, 100).bind(this);
@@ -102,7 +101,7 @@ export class Comment extends Component<Props, State> {
   // };
 
   componentWillReceiveProps(nextProps: Props) {
-    this.updateState(nextProps);
+    this.setState(this.updateState(nextProps));
   }
 
   componentDidMount() {
@@ -110,25 +109,25 @@ export class Comment extends Component<Props, State> {
   }
 
   updateState = (props: Props) => {
-    this.setState({
+    const newState: Partial<State> = {
       scoreDelta: props.data.vote,
       cachedScore: props.data.score,
-    });
+    };
 
-    if (props.user) {
-      const userId = props.user!.id;
+    // set comment edit timer
+    if (props.user && props.user.id === props.data.user.id) {
+      const editDuration = StaticStore.config.edit_duration;
+      const timeDiff = StaticStore.serverClientTimeDiff || 0;
+      const editDeadline = new Date(new Date(props.data.time).getTime() + timeDiff + editDuration * 1000);
 
-      // set comment edit timer
-      if (userId === props.data.user.id) {
-        const editDuration = StaticStore.config.edit_duration;
-        const timeDiff = StaticStore.serverClientTimeDiff || 0;
-        let editDeadline: Date | null = new Date(new Date(props.data.time).getTime() + timeDiff + editDuration * 1000);
-        if (editDeadline < new Date()) editDeadline = null;
-        this.setState({
-          editDeadline,
-        });
+      if (editDeadline < new Date()) {
+        newState.editDeadline = null;
+      } else {
+        newState.editDeadline = editDeadline;
       }
     }
+
+    return newState;
   };
 
   toggleReplying = () => {
@@ -454,7 +453,6 @@ export class Comment extends Component<Props, State> {
 
     const isReplying = props.editMode === CommentMode.Reply;
     const isEditing = props.editMode === CommentMode.Edit;
-
     const lowCommentScore = StaticStore.config.low_score;
     const downvotingDisabledReason = this.getDownvoteDisabledReason();
     const isDownvotingDisabled = downvotingDisabledReason !== null;
@@ -684,7 +682,6 @@ export class Comment extends Component<Props, State> {
                   {isReplying ? 'Cancel' : 'Reply'}
                 </span>
               )}
-
               {!props.data.delete &&
                 !props.disabled &&
                 !!o.orig &&