[Resolved] Mega Menu Description/second line

you would need to do something like this instead:

add_filter('wp_nav_menu_objects', 'ad_filter_menu', 10, 2);

function ad_filter_menu($sorted_menu_objects, $args) {
    // select the menu
    if ($args->theme_location === 'primary'){
        // get the menu objects
        foreach ($sorted_menu_objects as $menu_object) {
            // get any posttype menu item that are not parents
            if ( in_array($menu_object->object, array('post', 'page', 'any_post_type')) && $menu_object->menu_item_parent != 0 ) {
                // get the custom content 
                $subtitle = get_post_meta($menu_object->object_id, 'subtitle', true);
                $thumbnail = get_the_post_thumbnail($menu_object->object_id, 'thumbnail', array( 'class' => 'menu-thumbnail' ));
                // build the custom classes and menu item
                if ($subtitle || $thumbnail){
                    $menu_object->classes[] = 'custom-menu';
                    if ($subtitle){$menu_object->classes[] = 'has-subtitle';}
                    if ($thumbnail){$menu_object->classes[] = 'has-thumbnail';}
                    $menu_object->title = sprintf(
                        '%1$s %2$s %3$s',
                        $thumbnail,
                        '<span class="menu-item-label">'.$menu_object->title.'</span>',
                        $subtitle ? '<span class="menu-subtitle">' . $subtitle . '</span>' : ''      
                    );
                }
            }
        }
    }
    return $sorted_menu_objects;
}

The second line will require a custom field on your post.
This line in the code is where it gets that custom field:

$subtitle = get_post_meta($menu_object->object_id, 'subtitle', true);

Change the subtitle to match yours.

I have tried to make the HTML Conditional so it only prints the html if there is the custom content and add the necessary classes.

The resulting HTML would look like this:

<li id="ID" class=".. custom-menu has-subtitle has-thumbnail ...">
    <a href="URL" aria-current="page">
        <img width="150" height="150" src="thumbnail_url" class="menu-thumbnail" alt="" decoding="async" loading="lazy"> 
        <span class="menu-item-label">Title</span> 
        <span class="menu-subtitle">subtitle</span>
    </a>
</li>

Note the li is given a class of custom-menu if it either has-subtitle or has-thumbnail
And each item within has a menu-* class to target

CSS you can do something like:

.main-nav ul li.custom-menu a {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    max-height: 60px;
    align-content: flex-start;
    justify-content: center;
}
.menu-thumbnail {
    width: 36px;
    border-radius: 100%;
    margin-right: 10px;
}

You’re welcome