src/comments/Comment.js

@@ -62,6 +62,10 @@ export default class Comment extends Component {
  this.props.onTextInputfocus && this.props.onTextInputfocus(this.props.comment, offset);
  }
 
+ onCommentFocus = (comment, offset) => {
+ this.props.onCommentFocus && this.props.onCommentFocus(this.props.comment, offset);
+ }
+
  /**
  * Render
  */
@@ -116,6 +120,7 @@ export default class Comment extends Component {
  parent={comment}
  store={comment.comments}
  onInputFocus={this.onInputFocus}
+ onCommentFocus={this.onCommentFocus}
  navigation={this.props.navigation}
  />
  }

src/comments/CommentList.js

@@ -240,6 +240,28 @@ export default class CommentList extends React.Component<Props, State> {
  }
  }
 
+ onCommentFocus = (item, offset) => {
+ if (!offset) offset = 0;
+
+ const comments = this.getComments();
+
+ if (!this.props.parent) {
+ setTimeout(() => {
+ this.listRef.scrollToIndex({
+ index: comments.findIndex(c => item === c),
+ viewOffset: offset ? -(offset - (this.height - 200)): -110 ,
+ viewPosition: 0
+ });
+ }, 50);
+ } else {
+ const index = comments.findIndex(c => item === c);
+ const frame = this.listRef._listRef._getFrameMetricsApprox(index);
+ if (this.props.onCommentFocus) {
+ this.props.onCommentFocus(item, offset + frame.offset );
+ }
+ }
+ }
+
  /**
  * On comment input focus
  */
@@ -364,16 +386,27 @@ export default class CommentList extends React.Component<Props, State> {
  */
  renderComment = (row: any) => {
  const comment = row.item;
+ const comments = this.props.store;
 
  // add the editing observable property
  comment.editing = observable.box(false);
 
+ if (comment.focused && this.props.parent) {
+ setTimeout(() => {
+ if (this.props.onCommentFocus && this.listRef && this.listRef._listRef) {
+ const frame = this.listRef._listRef._getFrameMetricsApprox(row.index);
+ this.props.onCommentFocus(row.item, frame.offset + frame.length);
+ }
+ }, 1000);
+ }
+
  return (
  <Comment
  comment={comment}
  entity={this.props.entity}
  store={this.props.store}
  onTextInputfocus={this.onChildFocus}
+ onCommentFocus={this.onCommentFocus}
  navigation={this.props.navigation}
  />
  );