{% sw_extends '@Storefront/storefront/utilities/offcanvas.html.twig' %}
{% block utilities_offcanvas_content %}
{% block component_review_container %}
{# TODO NEXT-16993 - replace items per list config value #}
{% set reviewsPerListPage = 10 %}
{% set currentListPage = reviews.page + 1 %}
{% set productReviewCount = reviews.totalReviews %}
{% if productReviewCount > 0 %}
{% set productAvgRating = reviews.matrix.averageRating|round(2, 'common') %}
{% endif %}
{# TODO NEXT-16994 - replace language flag #}
{% set foreignReviewsCount = 150 %}
{% set ratingSuccess = element.data.ratingSuccess %}
<div class="product-detail-review tab-pane-container">
{% block component_review_tab_pane %}
<div class="row product-detail-review-content js-review-container">
{% block component_review_aside %}
<div class="col-sm-4">
{% block component_review_widget_container %}
{% sw_include '@Storefront/storefront/component/review/review-widget.html.twig' %}
{% endblock %}
</div>
{% endblock %}
{% block component_review_main %}
<div class="col product-detail-review-main js-review-content">
{% block component_review_alert %}
{% if ratingSuccess == 1 %}
{% sw_include '@Storefront/storefront/utilities/alert.html.twig' with {
type: "success",
content: "detail.reviewFormSuccessAlert"|trans|sw_sanitize
} %}
{% elseif ratingSuccess == 2 %}
{% sw_include '@Storefront/storefront/utilities/alert.html.twig' with {
type: "success",
content: "detail.reviewFormSuccessUpdateAlert"|trans|sw_sanitize
} %}
{% elseif ratingSuccess == -1 %}
{% sw_include '@Storefront/storefront/utilities/alert.html.twig' with {
type: "danger",
content: "detail.reviewFormErrorAlert"|trans|sw_sanitize
} %}
{% endif %}
{% endblock %}
{% block component_review_form_container %}
<div class="collapse multi-collapse{% if ratingSuccess == -1 %} show{% endif %}"
id="review-form">
{% if context.customer and not context.customer.guest %}
<div class="product-detail-review-form">
{% sw_include '@Storefront/storefront/component/review/review-form.html.twig' %}
</div>
{% else %}
<div class="product-detail-review-login">
{% sw_include '@Storefront/storefront/component/review/review-login.html.twig' %}
</div>
{% endif %}
</div>
{% endblock %}
{% block component_review_list_container %}
<div id="review-list"
class="collapse multi-collapse product-detail-review-list{% if ratingSuccess != -1 %} show{% endif %}">
{% block component_review_list %}
{% block component_review_list_actions %}
<div class="row align-items-center product-detail-review-actions">
{% set formAjaxSubmitOptions = {
replaceSelectors: [".js-review-container"],
submitOnChange: true
} %}
{% block component_review_list_action_language %}
<div class="col product-detail-review-language">
{% if foreignReviewsCount > 0 %}
<form class="product-detail-review-language-form"
action="{{ path('frontend.product.reviews', { productId: product.id, parentId: product.parentId }) }}"
method="post"
data-form-ajax-submit="true"
data-form-ajax-submit-options='{{ formAjaxSubmitOptions|json_encode }}'>
{% block component_review_list_action_language_csrf %}
{{ sw_csrf('frontend.product.reviews') }}
{% endblock %}
{% if app.request.get('limit') %}
<input type="hidden" name="limit" value="{{ app.request.get('limit') }}">
{% endif %}
{% if app.request.get('sort') %}
<input type="hidden" name="sort" value="{{ app.request.get('sort') }}">
{% endif %}
<div class="custom-control custom-switch">
{# TODO NEXT-16994 - set checked and disabled state #}
<input type="checkbox"
class="custom-control-input"
id="showForeignReviews"
value="filter-language"
name="language"
{% if app.request.get('language') %}checked="checked"{% endif %}>
<label class="custom-control-label form-label"
for="showForeignReviews">
<small>{{ "detail.reviewLanguageFilterLabel"|trans|sw_sanitize }}</small>
</label>
</div>
</form>
{% endif %}
</div>
{% endblock %}
{% block component_review_list_action_sortby %}
{% if productReviewCount > 0 %}
<div class="col-12 col-md-auto product-detail-review-sortby">
{% set formAjaxSubmitOptions = {
replaceSelectors: [
".js-review-info",
".js-review-teaser",
".js-review-content"
],
submitOnChange: true
} %}
{% block component_review_list_action_sortby_form %}
<form class="form-inline product-detail-review-sortby-form"
action="{{ path('frontend.product.reviews', { productId: product.id, parentId: product.id }) }}"
method="post"
data-form-ajax-submit="true"
data-form-ajax-submit-options='{{ formAjaxSubmitOptions|json_encode }}'>
{% block component_review_list_action_sortby_form_csrf %}
{{ sw_csrf('frontend.product.reviews') }}
{% endblock %}
{% if app.request.get('limit') %}
<input type="hidden" name="limit" value="{{ app.request.get('limit') }}">
{% endif %}
{% if app.request.get('language') %}
<input type="hidden" name="language" value="{{ app.request.get('language') }}">
{% endif %}
{% if app.request.get('points') %}
{% for points in app.request.get('points') %}
<input type="hidden" name="points[]" value="{{ points }}">
{% endfor %}
{% endif %}
{% block component_review_list_action_sortby_label %}
<label class="form-label product-detail-review-sortby-label"
for="reviewsSortby">
<small>{{ "detail.reviewSortLabel"|trans|sw_sanitize }}</small>
</label>
{% endblock %}
{% block component_review_list_action_sortby_select %}
<select class="{{ formSelectClass }} {{ formSelectClass }}-sm"
name="sort"
id="reviewsSortby">
<option value="createdAt"{% if reviews.criteria.sorting.0.field == 'createdAt' %} selected{% endif %}>
{{ "detail.reviewSortNewLabel"|trans|sw_sanitize }}
</option>
<option value="points"{% if reviews.criteria.sorting.0.field== 'points' %} selected{% endif %}>
{{ "detail.reviewSortTopRatedLabel"|trans|sw_sanitize }}
</option>
</select>
{% endblock %}
</form>
{% endblock %}
</div>
{% endif %}
{% endblock %}
</div>
<hr/>
{# TODO NEXT-16994 - calculate reviews in current language in list #}
{% set listReviewsCount = productReviewCount - foreignReviewsCount %}
{# TODO NEXT-16994 - fix if reviews in foreign language are more than in customer language #}
{% if listReviewsCount < 0 %}
{% set listReviewsCount = 0 %}
{% endif %}
<p class="text-right product-detail-review-counter">
{% if (listReviewsCount > 1 and listReviewsCount > reviewsPerListPage) %}
<small><strong>{{ currentListPage }}</strong> - <strong>{{ reviewsPerListPage }}</strong> {{ "detail.reviewCountBefore"|trans|sw_sanitize }} <strong>{{ listReviewsCount }}</strong> {{ "detail.reviewCountAfter"|trans({'%count%': listReviewsCount })|sw_sanitize }}</small>
{% elseif listReviewsCount > 0 %} {# TODO NEXT-16994 - fix detail.reviewCountAfter snippet for listReviewsCount = 0 #}
<small><strong>{{ listReviewsCount }}</strong> {{ "detail.reviewCountAfter"|trans({'%count%': listReviewsCount })|sw_sanitize }}</small>
{% endif %}
</p>
{% endblock %}
{% block component_review_list_content %}
{% for review in reviews %}
<div class="product-detail-review-list-content">
{% sw_include '@Storefront/storefront/component/review/review-item.html.twig' %}
</div>
{% endfor %}
{% endblock %}
{% block component_review_list_paging %}
{% set criteria = reviews.criteria %}
{% set totalPages = (productReviewCount/reviewsPerListPage)|round(0,'ceil') %}
{% if totalPages > 1 %}
{% set formAjaxSubmitOptions = {
replaceSelectors: ".js-review-container",
submitOnChange: true
} %}
{% block component_review_list_paging_form %}
<div class="product-detail-review-pagination">
<form class="product-detail-review-pagination-form"
action="{{ path('frontend.product.reviews', { productId: product.id }) }}"
method="post"
data-form-ajax-submit="true"
data-form-ajax-submit-options='{{ formAjaxSubmitOptions|json_encode }}'>
{% block component_review_list_paging_csrf %}
{{ sw_csrf('frontend.product.reviews') }}
{% endblock %}
{% if app.request.get('limit') %}
<input type="hidden" name="limit" value="{{ app.request.get('limit') }}">
{% endif %}
{% if app.request.get('language') %}
<input type="hidden" name="language" value="{{ app.request.get('language') }}">
{% endif %}
{% if app.request.get('sort') %}
<input type="hidden" name="sort" value="{{ app.request.get('sort') }}">
{% endif %}
{% if app.request.get('points') %}
{% for points in app.request.get('points') %}
<input type="hidden" name="points[]" value="{{ points }}">
{% endfor %}
{% endif %}
{% sw_include '@Storefront/storefront/component/pagination.html.twig' with {
entities: reviews,
criteria: criteria,
total: productReviewCount,
} %}
</form>
</div>
{% endblock %}
{% endif %}
{% endblock %}
{% endblock %}
{% if productReviewCount <= 0 %}
{% block component_review_list_empty %}
{% sw_include '@Storefront/storefront/utilities/alert.html.twig' with {
type: "info",
content: "detail.reviewListEmpty"|trans|sw_sanitize
} %}
{% endblock %}
{% endif %}
</div>
{% endblock %}
</div>
{% endblock %}
</div>
{% endblock %}
</div>
{% endblock %}
{% endblock %}