Change the value of a main checkbox when any of the others is selected and reset the others when main checkbox is selected

I have plenty of checkboxes that work as filters for an Ajax section, the problem here is that the selection of those is not working properly.

When you first enter the page, the main checkbox "All" is already selected, and when you select any of the others, the main checkbox must change to "unselected", also when the others are deselected, the main checkbox must return to it's inital value (selected), this is already working.

The problem here is that if you have already selected many of the others and you attempt to select the main checkbox, the others must change to "unselected", but this is not happening.

I tried using some onclick functions for the main checkbox and secondary checkboxes, but it seems that just the second one is working.

You can see the current state of the problem here: https://www.silieri.com/catalogo/mesas-y-escritorios

$(document).ready(function(){
        // Función cuando el checkbox inicial se clickea
        $('input:checkbox.initial-checkbox').click(function(){
            // Si esta seleccionado le sigo dejando el valor de true
            if($('input:checkbox.initial-checkbox').prop('checked')){
                $('input:checkbox.initial-checkbox').attr('checked', true);
            }
            // Si no estaba seleccionado y los demás sí
            if(!$('input:checkbox.initial-checkbox').prop('checked') && $('input:checkbox.secondary-checkbox:checked').length > 0){
                $('input:checkbox.secondary-checkbox:checked').each(function(){ 
                    $(this).attr('checked', false);
                });
                $('input:checkbox.initial-checkbox').attr('checked', true);
            }
        });

        // Si cualquier otro checkbox es clickeado
        $('input:checkbox.secondary-checkbox').click(function(){
            // Si la cantidad de los secundarios es mayor a 0 le quitas el checked al primero
            if($('input:checkbox.secondary-checkbox:checked').length > 0){
                $('input:checkbox.initial-checkbox').attr('checked', false);
            }
            // Si la cantidad de los secundarios es 0 le agregas el checked al primero
            else{
                $('input:checkbox.initial-checkbox').attr('checked', true);
            }
        });
    });

<ul class="list-group list-group-flush">
                <li class="list-group-item"><input type="checkbox" class="ml-5 initial-checkbox active-checkbox" value="0" name="subcategorias[]" aria-label="Checkbox para subcategoría" onClick="checkCheckBox(this)" checked> Todos</li>
                <?php 
                    foreach($list_subcat as $nameSubCat){
                        echo '<li class="list-group-item"><input type="checkbox" value="'.$nameSubCat[1].'" name="subcategorias[]" class="ml-5 secondary-checkbox" aria-label="Checkbox para subcategoría" onClick="checkCheckBox(this)"> '.$nameSubCat[0].'</li>';
                    }
                ?>
            </ul>

I just want that whenever you select the filter for "All" and if you have already selected any other filter, those filters must be changing their value to unselected.