{% sw_extends '@Storefront/storefront/utilities/offcanvas.html.twig' %}

{% block utilities_offcanvas_content %}
	{% block component_review_container %}

		{% set reviewsPerListPage = config('core.listing.reviewsPerPage') %}
		{% if reviewsPerListPage <= 0 %}
			{% set reviewsPerListPage = 10 %}
		{% endif %}

		{% set currentListPage = reviews.page %}

		{% set productReviewCount = reviews.total %}
        {% set totalReviewCount = reviews.matrix.totalReviewCount %}

		{% if totalReviewCount > 0 %}
            {% set productAvgRating = reviews.matrix.averageRating|round(2, 'common') %}
		{% endif %}

		{% set totalReviewsInCurrentLanguage = reviews.totalReviewsInCurrentLanguage ?: productReviewCount %}
		{% set numberOfReviewsNotInCurrentLanguage = productReviewCount - totalReviewsInCurrentLanguage %}

		<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 %}
                                        {% set formAjaxSubmitOptions = {
                                            replaceSelectors: ['.js-review-container'],
                                            submitOnChange: true
                                        } %}

                                        {% block component_review_list_actions %}
                                            {% block component_review_list_action_filters %}
                                                <div class="row align-items-center product-detail-review-actions">
                                                    {% block component_review_list_action_language %}
                                                        <div class="col product-detail-review-language">
                                                            {% block component_review_list_action_language_form %}
                                                                <form class="product-detail-review-language-form"
                                                                    action="{{ path('frontend.product.reviews', { productId: reviews.productId, parentId: reviews.parentId }) }}"
                                                                    method="post"
                                                                    data-form-ajax-submit="true"
                                                                    data-form-ajax-submit-options="{{ formAjaxSubmitOptions|json_encode }}">

                                                                    {% 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 %}

                                                                    {% block component_review_list_action_language_switch %}
                                                                        <div class="form-check form-switch">
                                                                            <input type="checkbox"
                                                                                class="form-check-input"
                                                                                id="showForeignReviews"
                                                                                value="filter-language"
                                                                                name="language"
                                                                                {% if app.request.get('language') %}checked="checked"{% endif %}
                                                                                {% if numberOfReviewsNotInCurrentLanguage is same as(0) and not app.request.get('language') %}disabled="disabled"{% endif %}>
                                                                            <label class="custom-control-label form-label"
                                                                                for="showForeignReviews">
                                                                                <small>{{ 'detail.reviewLanguageFilterLabel'|trans|sw_sanitize }}</small>
                                                                            </label>
                                                                        </div>
                                                                    {% endblock %}
                                                                </form>
                                                            {% endblock %}
                                                        </div>
                                                    {% endblock %}

                                                    {% block component_review_list_action_sortby %}
                                                        {% if productReviewCount > 0 %}
                                                            <div class="col-12 col-md-auto product-detail-review-sortby">
                                                                {% block component_review_list_action_sortby_form %}
                                                                    <form class="form-inline product-detail-review-sortby-form"
                                                                        action="{{ path('frontend.product.reviews', { productId: reviews.productId, parentId: reviews.parentId }) }}"
                                                                        method="post"
                                                                        data-form-ajax-submit="true"
                                                                        data-form-ajax-submit-options="{{ formAjaxSubmitOptions|json_encode }}">

                                                                        {% 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="form-select form-select-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>
                                            {% endblock %}

                                            {% block component_review_list_counter %}
                                                <hr/>
                                                <p class="text-right product-detail-review-counter">
                                                    {% if (productReviewCount > 1 and productReviewCount > reviewsPerListPage) %}
                                                        <small><strong>{{ currentListPage }}</strong> - <strong>{{ reviewsPerListPage }}</strong> {{ 'detail.reviewCountBefore'|trans|sw_sanitize }} <strong>{{ productReviewCount }}</strong> {{ 'detail.reviewCountAfter'|trans({'%count%': productReviewCount })|sw_sanitize }}</small>
                                                    {% elseif productReviewCount > 0 %}
                                                        <small><strong>{{ productReviewCount }}</strong> {{ 'detail.reviewCountAfter'|trans({'%count%': productReviewCount })|sw_sanitize }}</small>
                                                    {% endif %}
                                                </p>
                                            {% endblock %}
                                        {% 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 totalPages = (productReviewCount/reviewsPerListPage)|round(0,'ceil') %}

                                            {% if totalPages > 1 %}
                                                {% 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: reviews.productId, parentId: reviews.parentId }) }}"
                                                              method="post"
                                                              data-form-ajax-submit="true"
                                                              data-form-ajax-submit-options="{{ formAjaxSubmitOptions|json_encode }}"
                                                              data-form-ajax-pagination="true">

                                                            <input type="hidden" name="p" value="1">

                                                            {% 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}  %}
                                                        </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 %}