Filtering posts within a page that displays a single category php

Question

I'm editing a website that has existing filters that filter through all products in all categories.

I'm changing the menu structure to display pages that show the categories on separate pages. I would like to retain the filters but I can't figure out how to edit them to filter just the category that is being displayed. The filters are created using custom post id's.

So really i'm trying to get the page to retain the category that is originally being passed to the page on first load.

<?php
/*
 *  Template Name: Products List Category
 */
$context = Timber::context();
$timber_post = new Timber\Post();
$context['post'] = $timber_post;

global $paged;
if (!isset($paged) || ! $paged) {
    $paged = 1;
}

// Banner data
$post = $timber_post;
$parent_post = getProductsPage();
$context['main_image'] = !empty(get_field('page_banner', $post->ID)['image']) ? get_field('page_banner', $post->ID)['image'] : get_field('page_banner', $parent_post->ID)['image'];
$context['main_text'] = !empty($timber_post->meta('page_banner')['text']) ? $timber_post->meta('page_banner')['text'] : $parent_post->meta('page_banner')['text'];

// if filters
$pet_filter = get_field('products_pet', $timber_post->ID);
$context['pet_filter'] = $pet_filter;

$brand_filter = get_field('products_brand', $timber_post->ID);
$context['brand_filter'] = $brand_filter;

$category_filter = get_field('products_category', $timber_post);
$context['category_filter'] = $category_filter;

// Get pets
remove_all_filters('posts_orderby');
$args = array(
   'post_type' => 'pet',
   'orderby'   => 'post_title',
   'order'     => 'ASC',
);

$context['pets'] = new Timber\PostQuery($args);

// Get brands
remove_all_filters('posts_orderby');
$args = array(
   'post_type' => 'brand',
   'orderby'   => 'post_title',
   'order'     => 'ASC',
);

$context['brands'] = new Timber\PostQuery($args);

// Get categories
$categories = get_terms('product_category', array(
    'include' => !empty($category_filter) ? $category_filter : [],
   'hide_empty' => true,
));

// Get products by categories
$contents = [];
foreach($categories as $category){
    $obj = new StdClass;
    $obj->category = $category;

    // Get posts
    $args = array(
      'post_type' => 'product',
      'numberposts' => -1,
      'orderby' => 'menu_order',
    'order' => 'DESC',
      'tax_query' => array(
        array(
          'taxonomy' => 'product_category',
          'field' => 'term_id', 
          'terms' => $category->term_id,
          'include_children' => false
        )
      )
    );

    if($pet_filter){
        $args['meta_query'] = [
            [
        'key' => 'product_related_pet', // name of custom field
        'value' => '"'.$pet_filter.'"', // matches exactly the id
        'compare' => 'LIKE'
      ]
      ];
    }

 if($brand_filter){
        $args['meta_query'] = [
            [
        'key' => 'product_related_brand', // name of custom field
        'value' => '"'.$brand_filter.'"', // matches exactly the id
        'compare' => 'LIKE'
      ]
      ];
    }


    $products = Timber::get_posts($args);
    $obj->products = $products;

    $contents[] = $obj;
}
// Get categories
remove_filter('terms_clauses', 'TO_apply_order_filter');
$args2 = array (
    'taxonomy' => 'product_category',
    'orderby' => 'name',
   'order' => 'ASC',
    'include' => !empty($category_filter) ? $category_filter : [],
   'hide_empty' => true,
);
$categories2 = get_terms($args2);
$context['categories'] = $categories2;

$context['contents'] = $contents;

Timber::render( array( 'pages/products_category.twig' ), $context );

Here is the filter output code 'pages/products_category.twig'

{% extends 'base.twig' %}

{% block content %}
    {% include 'blocks/content-top-banner.twig' with {
        'fields': {
            'title': post.title,
            'image': main_image,
            'text': main_text
        }
    } %}
    <div class="bg-wood">
        <div class="container">
            <div class="row flex-end">
                <div class="col-lg-7">{% include 'components/search-form_category.twig' with {
                    'searchByBrand': true,
                    'brands': brands,
                    'searchByPet': true,
                    'pets': pets,
                    'categories': categories,
                    'data_url': '/ajax/products',
                        'data_cpt': 1,
                        'pet_value': pet_filter,
                        'brand_value': brand_filter,
                        'cat_value': category_filter
                } %}</div>
            </div>
            <div id="js-list-result">
                {% include 'partials/ajax/products-list.twig' with {'contents': contents} %}
            </div>
        </div>
    </div>
{% endblock %}

{% block page_scripts %}
    <script src="{{theme.link}}/dist/scripts/utils/filters-list.js"></script>
{% endblock %}

and here is the filter 'components/search-form_category.twig'

<form class="search-form" method="POST">
    <div class="row">
    {% if searchByBrand %}
        <div class="col-sm-6">
            <label class="form-label">{{ __("Search by brand", "living-world") }}</label>
            <div class="select select-full">
                <select class="js-select js-select-filter" name="brand">
                    <option value="" selected="selected">{{ __("All brands", "living-world") }}</option>
                    {% for brand in brands %}
                    <option value="{{ brand.ID }}" {% if brand.ID == brand_value %}selected{% endif %}>{{ brand.name }}</option>
                    {% endfor %}
                </select>
                <div class="select-arrow"></div>
            </div>
        </div>
        {% endif %}
        {% if searchByPet %}
        <div class="col-sm-6">
            <label class="form-label">{{ __("Search by pet", "living-world") }}</label>
            <div class="select select-full">
                <select class="js-select js-select-filter" name="pet">
                    <option value="" selected="selected">{{ __("All pets", "living-world") }}</option>
                    {% for pet in pets %}
                    <option value="{{ pet.ID }}" {% if pet.ID == pet_value %}selected{% endif %}>{{ pet.name }}</option>
                    {% endfor %}
                </select>
                <div class="select-arrow"></div>
            </div>
        </div>
        {% endif %}
        <div class="{{ searchByPet ? 'col-sm-6' : 'col-12' and searchByBrand ? 'col-sm-6' : 'col-12'}}">
            
            <div class="select select-full">
                    <input type="hidden" id="js-filter-ajax-settings" data-url="{{ data_url }}" data-limit="{{ data_limit }}" data-cpt="{{ data_cpt }}" data-lang="{{ current_lang }}">
                
                <div class="select-arrow"></div>
            </div>
        </div>
    </div>
</form>