{% extends 'Layouts/default.html.twig' %}

{% block title %}{{ 'app.global.user.list.users'|trans }}{% endblock %}

{% block search %}
	{% include 'Search/list.html.twig' %}
{% endblock %}

{% block toolbar_actions %}
    {% if true == is_granted('ROLE_SUPPORT') and 'customer' == instance %}
        {% if isDbReachable %}
            <a class="btn btn-sm fw-bold btn-primary new-entity" data-bs-toggle="modal" data-bs-target="#foxorders_modal_form_migration">
                {{ 'app.global.user.buttons.migration'|trans }}
            </a>
        {% else %}
            <div class="alert alert-warning d-flex align-items-center px-2 py-1 mt-2">
                <i class="ki-duotone ki-shield-tick fs-2hx text-warning me-4"><span class="fa-solid fa-triangle-exclamation"></span></i>
                <div class="d-flex flex-column">
                    <span>{{ 'app.global.user.migration.warning_unreachable_db'|trans }}</span>
                </div>
            </div>
        {% endif %}
    {% endif %}

	{% set canAddShopManager = userTypeShopManager != instance or (not isSwitchedByDeveloper and not isDeveloper) %}
    {% set displayCustomerForm = (isShopManager and 'customer' == instance) %}
    {% set displayStaffForm = (isAdministrator and instance in ['manager', 'support', 'developer', 'shop-manager']) %}
    {% set displayShopManagerForm = (isSupport or isManager) and 'shop-manager' == instance %}

    {% set targetKey = {
        'customer': 'clients',
        'manager': 'managers',
        'shop-manager': 'shop_owners',
        'developer': 'developers',
        'support': 'supports'
    }[instance] ?? 'supports' %}

    {% if (canAddShopManager and (displayCustomerForm or displayStaffForm or displayShopManagerForm)) %}
        <a class="btn btn-sm fw-bold btn-primary new-user" data-bs-toggle="modal" data-bs-target="#foxorders_modal_form_user">
            {{ ("app.global.user.#{targetKey}.new.title")|trans }}
        </a>
    {% endif %}
{% endblock %}

{% block body %}
    {% include 'List/switch_table_list.html.twig' with {'totalCountPagination': users.getPaginationData.totalCount} %}
    <div class="tab-content">
        {% include 'Security/User/Lists/table.html.twig' with { 'users': users } %}
        {% include 'Security/User/Lists/cards.html.twig' with { 'users': users } %}
        <!--begin::Pagination-->
        {% include 'List/pagination.html.twig' with { 'data' : users } %}
        <!--end::Pagination-->
    </div>
{% endblock %}

{% block modals %}
	{% set canAddShopManager = userTypeShopManager != instance or (not isSwitchedByDeveloper and not isDeveloper) %}
    {% set displayCustomerForm = (isShopManager and 'customer' == instance) %}
    {% set displayStaffForm = (isAdministrator and instance in ['manager', 'support', 'developer', 'shop-manager']) %}
    {% set displayShopManagerForm = (isSupport or isManager) and 'shop-manager' == instance %}

    {% if (canAddShopManager and (displayCustomerForm or displayStaffForm or displayShopManagerForm)) %}
        {% include 'Modal/form.html.twig' with {
            'id': 'user',
        } %}
    {% endif %}
    {% if true == is_granted('ROLE_SUPPORT') and migrationForm is defined and isDbReachable %}
		{% include 'Modal/form.html.twig' with {
			'title':'app.global.user.migration.title'|trans,
			'id': 'migration',
			'form': migrationForm,
		} %}
	{% endif %}
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script>
        var period = "{{ data['period'] ?? '' }}";
		var inputId = "#search_form_period";
		var daysOfWeek = {{ daysOfWeek | raw }};
		var monthNames = {{ monthNames | raw }};
        var translations = {
            "apply": '{{ 'app.global.date.input.apply'|trans }}',
			"cancel": '{{ 'app.global.date.input.cancel'|trans }}',
			"from": '{{ 'app.global.date.input.from'|trans }}',
			"to": '{{ 'app.global.date.input.to'|trans }}',
			"custom": '{{ 'app.global.date.input.custom'|trans }}',
			"today": '{{ 'app.global.date.today'|trans }}',
			"yesterday": '{{ 'app.global.date.yesterday'|trans }}',
			"last7Days": '{{ 'app.global.date.last_7_days'|trans }}',
			"last30Days": '{{ 'app.global.date.last_30_days'|trans }}',
			"thisMonth": '{{ 'app.global.date.this_month'|trans }}',
			"lastMonth": '{{ 'app.global.date.last_month'|trans }}',
			"customRange": '{{ 'app.global.date.custom_range'|trans }}',
            'message': '{{ 'app.global.validation.switch_user.message'|trans }}',
            "confirm": '{{ 'app.global.validation.switch_user.confirm'|trans }}',
            'refuse': '{{ 'app.global.validation.switch_user.refuse'|trans }}',
            'gender': '{{ 'app.global.validation.user.gender'|trans }}',
            'firstname': '{{ 'app.global.validation.user.firstname'|trans }}',
            'lastname': '{{ 'app.global.validation.user.lastname'|trans }}',
            'email':{
                    'empty': '{{ 'app.global.validation.user.email.empty'|trans }}',
                    'invalid': '{{ 'app.global.validation.user.email.invalid'|trans }}',
			},
            'phone': {
                    'invalid': '{{ 'app.global.validation.user.phone.invalid'|trans }}',
                    'length': '{{ 'app.global.validation.user.phone.length'|trans }}',
            },
            'password': {
                'first': {
                    'empty': '{{ 'app.global.validation.user.password.first.empty'|trans }}',
                    'format': '{{ 'app.global.validation.user.password.first.format'|trans }}',
                },
                'second': {
                    'notidentical': '{{ 'app.global.validation.user.password.second.notidentical'|trans }}',
                },
            },
            "modal": {
                'add': '{{ ("app.global.buttons.add_" ~ instance|replace({"-": "_"}))|trans }}',
            },
            'franchise': '{{ 'app.global.validation.user.migrate.franchise.empty'|trans }}',
            'externalFranchise': '{{ 'app.global.validation.user.migrate.external_franchise.empty'|trans }}',
            'unlink_manager' : {
                'message': '{{ 'app.user.validation.modal.unlink_manager.message'|trans }}',
                'yes': '{{ 'app.global.validation.modal.unlink.yes'|trans }}',
                'no': '{{ 'app.global.validation.modal.unlink.no'|trans }}',
                'cancel': {
                    'message': '{{ 'app.global.validation.modal.unlink.cancel.message'|trans }}',
                    'ok': '{{ 'app.global.validation.modal.unlink.cancel.ok'|trans }}'
                }
            },
            'validate_email' : {
                'message': '{{ 'app.user.validation.modal.validate_email.message'|trans }}',
                'yes': '{{ 'app.global.validation.modal.continue.yes'|trans }}',
                'no': '{{ 'app.global.validation.modal.continue.no'|trans }}',
            },
        }
        var inputPhone = ".phone";
		var inputEmail = ".email";
        var maxDate = "{{ 'now'|date('Y-m-d') }}";
        var instance = "{{ instance }}";
    </script>
    <script src="{{ asset('foxorders/js/user/switch_user.js') }}"></script>
    <script src="{{ asset('foxorders/js/intl-tel-input/intlTelInput.min.js') }}"></script>
    <script src="{{ asset('foxorders/js/intl-tel-input/intl-tel-input.js') }}"></script>
    <script src="{{ asset('foxorders/js/user/user.js') }}"></script>
    <script src="{{ asset('foxorders/js/validation/rules/customer/customer.js') }}"></script>
    <script src="{{ asset('foxorders/js/validation/rules/customer/migration.js') }}"></script>
	<script src="{{ asset('foxorders/js/global/masks/inputmask.js')}}"></script>
    <script src="{{ asset('foxorders/js/global/date/range-picker.js') }}"></script>
{% endblock %}