Woocommerce_before_shop_loop related

Hi all,

i am using below code to modify the default shop behavior. instead of showing whole products list, i am displaying them as separate sections based on category name. Each section will have it’s category name as the title. You can see the example here : https://prnt.sc/wMvUdKj9kciw

Below is my modified code in my_child_theme/woocommerce/archive-product.php

do_action( 'woocommerce_before_shop_loop' );
	
	
	//get catagories// 
    $args = array(
         'taxonomy' => 'product_cat',
         'orderby' => 'name',
         'order' => 'ASC',
         'hide_empty' => false
    );
    //var_dump($args) ;
     
    foreach( get_categories( $args ) as $category ) :
        echo $category -> name; //section heading
        $cat_id_antler=$category -> cat_ID;
        echo do_shortcode ('[products paginate="false" category="' . $cat_id_antler . '"]');
    endforeach;	

         

	/**
	 * Hook: woocommerce_after_shop_loop.
	 *
	 * @hooked woocommerce_pagination - 10
	 */
	do_action( 'woocommerce_after_shop_loop' );

now with this approach i face one problem. if user clicks “shop” link in website’s navigation bar, the shop loads all products section by section as shown above in screen shot. But within the shop page, if user clicks on a category, the shop still loads all the products in the shop instead of that particular category’s products. how can i resolve this?

my idea is to have a an if condition from that system will decides to run default template code (which i removed and shown below) or the above custom code. but i am not getting the logic here to apply.

	woocommerce_product_loop_start();

	if ( wc_get_loop_prop( 'total' ) ) {
		while ( have_posts() ) {
			the_post();

			/**
			 * Hook: woocommerce_shop_loop.
			 */
			do_action( 'woocommerce_shop_loop' );

			wc_get_template_part( 'content', 'product' );
		}
	}

	woocommerce_product_loop_end();