Customizing filters layout from joomla.searchtools.default for list view of custom component

Question

In Joomla 4, there is the layout joomla.searchtools.default for the filters in a list view that you can see everywhere in the BackEnd.

In a list view of my custom component (FrontEnd), I managed to apply the layout joomla.searchtools.default for the filters. All is working fine.

Now I want to customize the layout. To avoid touching core files, I made a copy of the templates in the layout (joomla.searchtools.default) to my custom component. All is working fine.

Specifically, I want to get rid of the "filter options" button (which hides and shows the filters), but keep the useful "clear" button. This way, users will always see the filters.

There is a template called bar.php where you can see the following code:

<div class="filter-search-actions btn-group">
    <?php if ($filterButton) : ?>
        <button type="button" class="filter-search-actions__button btn btn-primary js-stools-btn-filter">
            <?php echo Text::_('JFILTER_OPTIONS'); ?>
            <span class="icon-angle-down" aria-hidden="true"></span>
        </button>
    <?php endif; ?>
    <button type="button" class="filter-search-actions__button btn btn-primary js-stools-btn-clear">
        <?php echo Text::_('JSEARCH_FILTER_CLEAR'); ?>
    </button>
</div>

In the code snippet, you can see two buttons: JFILTER_OPTIONS and JSEARCH_FILTER_CLEAR

There is other template called filters.php that really displays the filters:

<?php if ($filters) : ?>
    <?php foreach ($filters as $fieldName => $field) : ?>
        <?php if ($fieldName !== 'filter_search') : ?>
            <?php $dataShowOn = ''; ?>
            <?php if ($field->showon) : ?>
                <?php $wa->useScript('showon'); ?>
                <?php $dataShowOn = " data-showon='" . json_encode(FormHelper::parseShowOnConditions($field->showon, $field->formControl, $field->group)) . "'"; ?>
            <?php endif; ?>
            <div class="js-stools-field-filter"<?php echo $dataShowOn; ?>>
                <span class="visually-hidden"><?php echo $field->label; ?></span>
                <?php echo $field->input; ?>
            </div>
        <?php endif; ?>
    <?php endforeach; ?>
<?php endif; ?>

How could I get rid of the JFILTER_OPTIONS button (without losing the visibility of the filters) and maintain the functionality of the JSEARCH_FILTER_CLEAR button?

All is related with the js-stools-container-filters class in the divs' containers, I suppose, but I can't find more information.

Code snippet in the default_filter.php template (the "main" template):

// Load search tools
HTMLHelper::_('searchtools.form', $data['options']['formSelector'], $data['options']);
?>
<div class="js-stools" role="search">
    <?php if ($data['options']['showSelector']) : ?>
    <div class="js-stools-container-selector">
        <?php echo $this->sublayout('selector', $data); ?>
    </div>
    <?php endif; ?>
    <div class="js-stools-container-bar">
        <div class="btn-toolbar">
            <?php echo $this->sublayout('bar', $data); ?>
            <?php echo $this->sublayout('list', $data); ?>
        </div>
    </div>
    <!-- Filters div -->
    <div class="js-stools-container-filters clearfix<?php echo $filtersActiveClass; ?>">
        <?php if ($data['options']['filterButton']) : ?>
        <?php echo $this->sublayout('filters', $data); ?>
        <?php endif; ?>
    </div>
</div>
<?php if ($data['options']['showNoResults']) : ?>
    <?php echo $this->sublayout('noitems', $data); ?>
<?php endif; ?>

Answer 1

Finally I did it (get rid of JFILTER_OPTIONS button, maintaining JSEARCH_FILTER_CLEAR button functionality) touching very little code:

At main filter template file (I named it default_filter.php in my component, it's the default.php in the layout joomla.searchtools.default) fixing the class js-stools-container-filters-visible in the filter's div:

<!-- Filters div -->
<div class="js-stools-container-filters clearfix js-stools-container-filters-visible">

In the bar.php sublayout, deleting the JFILTER_OPTIONS button, and leaving alone the JSEARCH_FILTER_CLEAR button:

<div class="filter-search-actions btn-group">
    <button type="button" class="filter-search-actions__button btn btn-primary js-stools-btn-clear">
        <?php echo Text::_('JSEARCH_FILTER_CLEAR'); ?>
    </button>
</div>

That's it !