How to display Categories and Products in Separate Lists in Woo

functions.php

<?php // Don't copy the opening php tag

// =========================================================================
// SEPARATE PRODUCTS AND SUBCATEGORY ON ARCHIVE PAGES
// =========================================================================
function display_product_subcategories( $args = array() ) {
    $parentid = get_queried_object_id();
 
    $args = array(
        'parent' => $parentid
    );
     
    $terms = get_terms( 'product_cat', $args );
     
    if ( $terms ) {
        echo '<ul class="product-cats">';
     
        foreach ( $terms as $term ) {
            echo '<li class="category">';                 
                echo '<a href="' .  esc_url( get_term_link( $term ) ) . '" class="' . $term->slug . '">';
                woocommerce_subcategory_thumbnail( $term );
                    echo '<h2>';
                        echo $term->name;
                    echo '</h2>';
                echo '</a>';
            echo '</li>';
        }
     
        echo '</ul>';
    }
}
 
add_action( 'woocommerce_before_shop_loop', 'display_product_subcategories', 50 );