<aside class="main-sidebar float-left @if (!($filter_on ?? false)) d-none" @endif id="sidebar" style="width: 200px;">
    <section class="sidebar shadow mr-2" style="height: auto;">
        @if ($tags ?? false)
            @foreach ($tags as $tag_group_id => $group)
                @if ($group['tags'] ?? false)
                    @component('components.layout.box-collapse', [
                        'title' => $group['name'],
                        'id' => 'tag_group_' . $tag_group_id,
                        'collapsed' => App\Repositories\Shop\TagGroups::isTagGroupHaveSelected($tags_selected ?? [], $group['tags']),
                    ])
                        @foreach ($group['tags'] as $tag)
                            <div class="form-inline">
                                @include('components.form.checkboxes.icheck', [
                                    'name' => 'tags[]',
                                    'val' => $tag['id'],
                                    'value' => in_array($tag['id'], $tags_selected ?? []),
                                    'id_name' => 'tag_' . $tag['id'],
                                    'class' => 'filter_tags',
                                ])
                                {{ $tag['name'] }} ({{ $tag['count'] }})
                            </div>
                        @endforeach
                    @endcomponent
                @endif
            @endforeach
        @endif
    </section>
</aside>

@include('load.layout.chevron')
@include('load.form.icheck')

@push('js')
    <script>
        $('#filters').click(function() {
            $('#sidebar').toggleClass('d-none');
            $('#filter-on').toggleClass('d-none');
            // $('#filter-off').toggleClass('d-none');
            $('#filter-off-text').toggleClass('d-none');
            $('#filters').toggleClass('filters-width');
        });
        $('.filter_tags input').change(function() {
            $('#category-form').submit();
        })
        initChevron();

        $('#reset_filters').click(function() {
            $("input[type=checkbox]").each(function() {
                $(this).prop("checked", false);
            });
            $('#category-form').submit();            
        });
        
    </script>
@endpush