Goal: Display Average Rating from wix-comments.v2
Background: I’m using Wix Comments as a workaround to Wix Reviews, as the latter can only be integrated with Wix Stores & not other listing types like services, properties etc
I’m not a coder but have built many features with online resources. I’ve been trying this for months but hitting walls, if y’all can find the answer that would be mean a lot.
Below is a Wix Comments Widget showing the exact component I need. However I want to show that info elsewhere; on the same page or another, via a text box or ideally a Ratings Display element.
What I’ve tried: GPT & Velo Assistant code. But none of the code work, due to a few unknown IDs or syntax. Velo Asst. seems close to the solution. Here are different potential approaches.
1)
2)
3)
Additional info:
API ref: Velo Deps Wix Comments V 2 Comments Introduction | Velo
The following limited approach may have potential but has only worked for the following use case.
I would start with one piece at a time. When you say not working, what isn’t working.
Have you been able to successfully query the comments? If not, I would start there first.
One you are getting data back, then work on the math to calc the rating.
Display will come last once you are getting back the values you need.
One thing to note if this is a new build is that we have updated how you build on websites to SDK (this method will require elevation) Query Comments | SDK
While you can still use velo, it will no longer be updated.
1 Like
Sorry I’m not a coder and not sure how to even check if even the query has worked. (Try Catch block?) Would appreciate if anyone can get me over this hurdle
1 Like
That’s no problem - we all start somewhere!
So - this article will teach you how to test backend code functions in your wix site Test Backend Functions with Functional Testing
I would write the initial query just based on the minimal example in the docs - once that is returning data, then you can look into modifying further
2 Likes
I had a joint coding session with a helpful professional coder from the community. After a few iterations that threw errors, this was the furthest he got, without success. He wasn’t sure if the feature is even possible, so asked to first check with the Wix team if it is. Below, I’ve attached pics including of the code. Please lmk for anything you need to troubleshoot such as console logs. Though all of it can be done on your end, you just need the Wix Comments App & enable ratings.
To the Wix Velo Team or anyone who knows, is it possible to query comment ratings & achieve this feature? If yes, can you link resources that a coder can refer to implement it?
Hi, can you please advice on my last update?
This API can only be used on the backend and in Dashboard pages but the code you shared. is in a frontend/page file. For the backend the appID is required (which is correct as far as i can see here).
You will need to move all this code to a web method.
THere is an example code in the documentation you can use for how to do this. In the docs, switch the dropdown from “dashboard” to “backend” then start with that code snippet
1 Like
Thank you @amandam ! This clued the incredible @thewixwiz in producing some basic code that successfully queries and displays it. Passing the main hurdle…
// Working code for backend web module
import { Permissions, webMethod } from "wix-web-module";
import { comments } from "wix-comments.v2";
import { elevate } from "wix-auth";
const COMMENTS_APP_ID = "91c9d6a7-6667-41fb-b0b4-7d3b3ff0b02e"
export const getAverageRating = webMethod(
Permissions.Anyone,
() => {
return queryComments()
}
);
async function queryComments() {
const elevatedQueryComments = elevate(comments.queryComments)
const { items } = await elevatedQueryComments(COMMENTS_APP_ID).find();
console.log("items", items);
const totalRatings = items.reduce((a, b) => a + b.rating, 0);
const averageRatings = totalRatings / items.length;
return averageRatings;
}
// Working code for frontend
import { getAverageRating } from 'backend/comments.web'
$w.onReady(async function () {
const averageRating = await getAverageRating();
$w("#ratingsDisplay").text = `Average Rating: ${averageRating}`;
});
However, the requirement is not yet solved. Now I’m stuck at the following point; as I need this on dynamic pages, all that’s needed is to filter the comments by the dynamic page (using resource Id?) GPT’s attempt at modifying that basic working code (shown below), doesn’t work though. **1) How do I modify this itty bit properly?
*2) Also, if anyone can make a substitution to use a Ratings Display instead of a text box that’d be great❤️
// GPT's non working attempt
import { Permissions, webMethod } from "wix-web-module";
import { comments } from "wix-comments.v2";
import { elevate } from "wix-auth";
const COMMENTS_APP_ID = "91c9d6a7-6667-41fb-b0b4-7d3b3ff0b02e";
export const getAverageRating = webMethod(
Permissions.Anyone,
(resourceId) => {
return queryComments(resourceId);
}
);
async function queryComments(resourceId) {
const elevatedQueryComments = elevate(comments.queryComments);
// Query comments filtered by resourceId
const { items } = await elevatedQueryComments(COMMENTS_APP_ID)
.eq("resourceId", resourceId) // Querying based on resourceId
.find();
if (!items || items.length === 0) {
return { averageRating: 0, totalComments: 0 }; // Handle case when no comments are found
}
console.log("Filtered Comments:", items);
const totalRatings = items.reduce((sum, comment) => sum + (comment.rating || 0), 0);
const averageRatings = totalRatings / items.length;
return { averageRating: averageRatings, totalComments: items.length };
}
Shoutout to @thewixwiz 's YouTube channel - Subscribe & support his superb work. His vids & streams have helped me build many features. A gem of the community.
1 Like
