How does this WordPress Plugin (Thrive Comments) apply their custom comment sort?

I am building a site that uses the WordPress Plugin Thrive Comments.

It allows people to sort the comment by Top Rated, Newest, or Oldest.

Digging into the code I can see that Top Rated is sorting based on a default WordPress comment_karma field.

I want to change it so that Top Rated sorts based on a new comment metadata field I created called confidence_rank_cached.

The Thrive Comments plugin has a function named tcm_get_localization_parameters which I think is sending PHP data to the front end so it can be used by the JavaScript sort script.

Here is a full copy of that function:

/**
 * Get params to be used in javascript
 *
 * @return array
 */
public function tcm_get_localization_parameters() {
    $post    = $this->post_for_localization();
    $post_id = empty( $post['ID'] ) ? 0 : $post['ID'];

    $localization = array(
        'current_user'               => tcmh()->tcm_get_current_user(),
        'translations'               => include tcm()->plugin_path( 'includes/i18n.php' ),
        'nonce'                      => $this->create_nonce(),
        'routes'                     => array(
            'comments'               => tcm()->tcm_get_route_url( 'comments' ),
            'gravatar'               => tcm()->tcm_get_route_url( 'comments' ) . '/gravatar',
            'live_update'            => tcm()->tcm_get_route_url( 'comments' ) . '/live_update',
            'update_post_subscriber' => tcm()->tcm_get_route_url( 'comments' ) . '/update_post_subscriber',
            'generate_nonce'         => admin_url( 'admin-ajax.php' ),
        ),
        'post'                       => $post,
        'related_posts'              => tcmc()->get_related_posts( Thrive_Comments_Constants::TCM_NO_RELATED_POSTS, $args = array() ),
        'const'                      => array(
            'toast_timeout' => Thrive_Comments_Constants::TCM_TOAST_TIMEOUT, // Not sure if we really need this.
            'wp_content'    => rtrim( WP_CONTENT_URL, '/' ) . '/',
            'ajax_dash'     => array( Thrive_Comments_Constants::TCM_AJAX_DASH ),
            'site_url'      => get_site_url(),
            'post_url'      => apply_filters( 'tcm_post_url', get_permalink() ),
            'moderation'    => array(
                'approve'              => Thrive_Comments_Constants::TCM_APPROVE,
                'unapprove'            => Thrive_Comments_Constants::TCM_UNAPPROVE,
                'spam'                 => Thrive_Comments_Constants::TCM_SPAM,
                'unspam'               => Thrive_Comments_Constants::TCM_UNSPAM,
                'trash'                => Thrive_Comments_Constants::TCM_TRASH,
                'untrash'              => Thrive_Comments_Constants::TCM_UNTRASH,
                'unreplied'            => Thrive_Comments_Constants::TCM_UNREPLIED,
                'tcm_delegate'         => Thrive_Comments_Constants::TCM_DELEGATE,
                'tcm_featured'         => Thrive_Comments_Constants::TCM_FEATURED,
                'tcm_keyboard_tooltip' => Thrive_Comments_Constants::TCM_KEYBOARD_TOOLTIP,
                'featured'             => Thrive_Comments_Constants::TCM_FEATURE_VALUE,
                'not_featured'         => Thrive_Comments_Constants::TCM_NOT_FEATURE_VALUE,
            ),
        ),
        'settings'                   => tcms()->tcm_get_settings(),
        'close_comments'             => tcms()->close_comments( $post_id ) || ! $this->tcm_show_comments(),
        'sorting'                    => tcms()->get_comment_sorting(),
        'tcm_customize_labels'       => tcms()->tcm_get_setting_by_name( Thrive_Comments_Constants::TCM_LABELS_KEY ),
        'tcm_social_apis'            => array(
            'facebook' => Thrive_Dash_List_Manager::credentials( 'facebook' ),
            'google'   => Thrive_Dash_List_Manager::credentials( 'google' ),
        ),
        'email_services'             => tcamh()->get_email_services(),
        'tcm_accent_color'           => tcms()->tcm_get_setting_by_name( Thrive_Comments_Constants::TCM_ACCENT_COLOR ),
        'has_plugin_cache'           => tve_dash_detect_cache_plugin(),
        'default_author_picture_url' => tcmh()->get_picture_url(),
    );

    /**
     * Filter for adding extra params for comments localization in fronted
     *
     * @param array $localization the already built localization by TC
     */
    return apply_filters( 'tcm_comments_localization', $localization );
}

Looking at the function, you will see it is returning apply_filters( 'tcm_comments_localization', $localization );.

So I thought I could apply a filter inside functions.php of my child theme to make it sort by my confidence_rank_cached comment metadata field instead of the default WordPress comment_karma field.

Here is the code I’m using inside functions.php:

function custom_change_top_ranking_comment_sort( $localization ) {
    $localization['sorting']['sort_field'] = 'confidence_rank_cached';
    return $localization;
}
add_filter( 'tcm_comments_localization', 'custom_change_top_ranking_comment_sort', 10, 1 );

After adding that code and inspecting the source code of the loaded post I can see that the JavaScript sort_field is now using confidence_rank_cached instead of comment_karma.

This is good, but the sorting does not work correctly. When Top Rated is selected as the sort option it doesn’t sort the comments by my confidence_rank_cached metadata value.

I’m sure there is a step I’m missing here somewhere.

I have a suspicion that it isn’t working because the original JavaScript sort is based on comment_karma which is from the main comment database table, and now I’m trying to make it use confidence_rank_cached which is from the comment metadata table… but I don’t have a good enough understanding of JavaScript and AJAX etc to figure it out.

Could someone please take a look and help me get this working?

Here is a live staging site here so you can see it in action. I have disabled my custom code in functions.php so you can see how it is intended to work: https://wholesale-discussion.flywheelsites.com/new-post-test/

Since it’s not live yet you will need these login details to view the post…

  • Username: explode
  • Password: boomboom

And incase it helps, here is a copy of the Thrive Comments frontend JavaScript file. I un-minified it to make it easy to read: https://pastebin.com/6NznyLKV

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

How the JS script works

  1. On page load, the script loads the post comments by making an AJAX request to a custom WordPress REST API endpoint at /tcm/v1/comments/<post ID> (here’s a sample URL, valid as of writing).
  2. Then the script displays the comments sorted by the sort_field value in the comment localization parameters defined in the tcm_get_localization_parameters() (PHP) function. So at this point, your custom sort field (the metadata named confidence_rank_cached) would work as expected.
  3. However, it didn’t work when you selected the “Top Rated” option in the dropdown because the script (always) sets back the sort field to comment_karma — see the relevant code below:
    sortComments: function (a) {
        switch (a) {
            ...
            case "top-rated":
                (this.collection.compField = "comment_karma"), (this.collection.compOrder = -1);
        }
        ...
    },
    

How to make your custom sort field works when the “Top Rated” option is selected

  1. Change the above comment_karma to confidence_rank_cached.

    Yes, modifying (core) plugin files is not recommended, but I don’t have enough time to look thoroughly on the plugin script. Hence it’s up to you to come up with a better solution than modifying the original JS file.

  2. Add your custom metadata to the REST API endpoint mentioned above — and add the metadata as a root/top-level property (i.e. same level as the comment_karma field).

    I don’t know if the plugin provides a specific hook for filtering the comment objects/data in the REST API response, but you can try using the get_comment hook to add the custom metadata to the comment object.


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x