(function() {
  var rootCommentableId = <%== "comments-for-#{commentable.commentable_type.demodulize}-#{commentable.id}".to_json %>;

  var $comments = $("#" + rootCommentableId);
  var component = $comments.data("comments");
  component.unmountComponent();

  var commentsHtml = '<%== j(render partial: "comments").strip %>';
  $(".loading-comments").addClass("hide");
  $comments.replaceWith(commentsHtml);

  $comments = $("#" + rootCommentableId);
  $comments.foundation();

  // Re-create the component
  component = new Decidim.CommentsComponent($comments, $comments.data("decidim-comments"));
  component.mountComponent();
  $comments.data("comments", component);

  // Update the comments count
  $(".comments-count", $comments).text(<%== t("decidim.components.comments.title", count: @comments_count).to_json %>);

  Decidim.addInputEmoji();
}());