salla-verified-review

A card on the product page that invites a signed-in customer to rate the product.

A card on the product page that invites a signed-in customer to rate the product. If they bought it, it shows a "Verified purchase" badge with the order number and date, plus the loyalty points they earn for a review when the store gives any. Otherwise it invites them to share their experience. Place it once on the product page. It renders nothing for guests, or when the rating API says the customer cannot review this product (for example it is already rated). The button opens salla-rating-modal (created in the page if missing). If the customer reached the daily limit for reviewing products they did not buy, the button opens a modal with that message instead. After the product is rated (rating::products-rated event) the card hides itself.

Use it

In HTML or JSX, use the tag <salla-verified-review> with the Attribute names below. In React, the wrapper takes the Property names (camelCase).

import { SallaVerifiedReview } from '@salla.sa/twilight-components-react/verified-review';

Example

import { SallaVerifiedReview } from '@salla.sa/twilight-components-react/verified-review';

export function Example() {
  return (
    <SallaVerifiedReview productId="123" />
  );
}

Properties

PropertyAttributeDescriptionTypeDefault
productIdproduct-idId of the product to check review eligibility for. Use product-id in markup. Falls back to the data-product-id attribute, then to the current page id (page.id).number | string

Renders: <salla-modal>, <salla-button>, <salla-rating-modal>.

On this page