Having wordpress parent show then child category

Question

I have a side bar that is showing my custom post type categories and sub categories, its build to show categories and the child if not present in the current custom post type as categories is used across multiple types.

I have all parents and children showing but in the wrong order.

I would like

• Parent child child
• parent child

My current code

 <aside class="sidebar">
                 <div class="widget widget-filter">
                     <button class="widget-title">Explore Topics</button>
                     <svg class="separator" viewBox="0 0 238 11" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg">
                <line opacity="0.3" y1="0.5" x2="101.942" y2="0.5" stroke="#3CD5AF"></line>
                <line opacity="0.3" y1="10.5" x2="237.5" y2="10.5" stroke="#3CD5AF"></line>
              </svg>
<?php


$string = basename($wp->request); ;
$string = str_replace('-', '_', $string);

$new_string = $string;
// echo $new_string;

 $args = array(
                    'post_type'      => $new_string,
                    'post_status'    => 'publish',
                );

    $the_query = new WP_Query( $args );
    $my_categories = array();
    if ( $the_query->have_posts() ) {
        while ( $the_query->have_posts() ) {
            $the_query->the_post();
               $postType = get_queried_object();

            $terms = get_the_terms( get_the_ID(), 'category' );
            if ( $terms && ! is_wp_error( $terms ) ) : 
                foreach ( $terms as $term ) {
                if(!in_array($term->term_id, $my_categories))
                    $my_categories[] = $term->term_id;
                }   
            endif;  
        }
        wp_reset_postdata();
    }

    if(sizeof($my_categories)) { ?>
    

     <ul class="filter-list">
             <li :class="category == 0 ? 'parent' : ''" ;>
      <a class="" @click="filterPosts">Show All</a>
      </li>
      
  
         <?php foreach ($my_categories as $term_id) {
            $category = get_term_by('id', $term_id, 'category');
            if($category->slug!="all-articles") {
                if($category->parent != 0){ // If this is a subcategory
        ?>
          <li :class="category == <?php echo $category->term_id; ?> ? 'child' : ''" ;>
                     <a class="child" @click="filterPosts(<?= $category->term_id; ?>)"><?= esc_html( $category->name ); ?></a>
                </li> <?php
    } else {
    ?>
      <li :class="category == <?php echo $category->term_id; ?> ? 'parent' : ''" ;>
                     <a class="parent" @click="filterPosts(<?= $category->term_id; ?>)"><?= esc_html( $category->name ); ?></a>
                </li> 
                <?php
    }
          
            }
        }
    }
    ?>
    </ul>
    </div>
    </aside>