hide empty collection in / from menu in Shopify - collections

Question

I recently moved from Woocommerce to Shopify. I am using Expanse theme from Shopify. I have set listings not to show once they sold out or no stock is available. I need help with hiding the collection from menu that has no stock. I am going to add the code below. Kindly help what code line i need to add within that code.
The header navigation liquid code is below;
{%- liquid
unless limit
assign limit = main_menu.links.size
endunless
unless offset
assign offset = 0
endunless
-%}
<ul class="site-nav site-navigation site-navigation--{{ nav_position }} small--hide" role="navigation">
{%- for link in main_menu.links limit: limit offset: offset -%}
{%- liquid
assign has_dropdown = false
assign is_megamenu = false
if link.levels > 0
assign has_dropdown = true
if link.levels > 1
assign is_megamenu = true
endif
endif
assign isCollection = false
if show_mega_products
if is_megamenu and link.url contains '/collections/'
assign lang_code_string = request.locale.iso_code | prepend: '/' | downcase
assign collection_handle = link.url | remove: '/collections/' | remove: lang_code_string
assign collection_drop = collections[collection_handle]
assign isCollection = true
endif
endif
-%}
<li
class="site-nav__item site-nav__expanded-item{% if has_dropdown %} site-nav--has-dropdown{% endif %}{% if is_megamenu %} site-nav--is-megamenu{% endif %}"
{% if has_dropdown %}aria-haspopup="true"{% endif %}>
<a href="{{ link.url }}" class="site-nav__link site-nav__link--underline{% if has_dropdown %} site-nav__link--has-dropdown{% endif %}">
{{ link.title }}
</a>
{%- if is_megamenu -%}
{%- assign previous_column_type = '' -%}
<div class="site-nav__dropdown megamenu text-left">
<div class="page-width">
<div class="site-nav__dropdown-animate megamenu__wrapper">
<div class="megamenu__cols">
<div class="megamenu__col">
{%- for childlink in link.links -%}
{%- liquid
assign create_new_column = false
if childlink.levels > 0 and forloop.index != 1
assign create_new_column = true
endif
if childlink.levels == 0 and previous_column_type == 'full'
assign create_new_column = true
endif
-%}
{%- if create_new_column -%}
</div><div class="megamenu__col">
{%- endif -%}
<div class="megamenu__col-title">
{{ childlink.title }}
</div>
{%- liquid
if childlink.levels > 0
assign previous_column_type = 'full'
else
assign previous_column_type = 'single'
endif
-%}
{%- for grandchildlink in childlink.links -%}
<a href="{{ grandchildlink.url }}" class="site-nav__dropdown-link">
{{grandchildlink.title}}
</a>
{%- endfor -%}
{%- endfor -%}
</div>
</div>
{%- if isCollection -%}
<div class="megamenu__featured">
<div class="product-grid">
{%- liquid
assign mega_product = collection_drop.products.first
render 'product-grid-item', product: mega_product
if settings.quick_shop_enable
render 'quick-shop-modal', product: mega_product
endif
-%}
</div>
</div>
{%- endif -%}
</div>
</div>
</div>
{%- elsif has_dropdown -%}
<div class="site-nav__dropdown">
<ul class="site-nav__dropdown-animate site-nav__dropdown-list text-left">
{%- for childlink in link.links -%}
{%- liquid
assign has_sub_dropdown = false
if childlink.levels > 0
assign has_sub_dropdown = true
endif
-%}
<li class="{% if has_sub_dropdown %} site-nav__deep-dropdown-trigger{% endif %}">
<a href="{{ childlink.url }}" class="site-nav__dropdown-link site-nav__dropdown-link--second-level{% if has_sub_dropdown %} site-nav__dropdown-link--has-children{% endif %}">
{{ childlink.title | escape }}
{%- if has_sub_dropdown -%}
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon--wide icon-chevron-down" viewBox="0 0 28 16"><path d="M1.57 1.59l12.76 12.77L27.1 1.59" stroke-width="2" stroke="#000" fill="none" fill-rule="evenodd"/></svg>
{%- endif -%}
</a>
{%- if has_sub_dropdown -%}
<ul class="site-nav__deep-dropdown">
{%- for grandchildlink in childlink.links -%}
<li>
{{ grandchildlink.title | escape }}
</li>
{%- endfor -%}
</ul>
{%- endif -%}
</li>
{%- endfor -%}
</ul>
</div>
{%- endif -%}
</li>
{%- endfor -%}
</ul>

Answer 1

Here is a way to check if a link object is a collection and if it contains or not available products (which I understand is your question) (not tested):
{% if link.type == 'collection_link' %}
{% assign c_products = link.object.products | where: "available" %}
{% if c_products.size > 0 %}
Display the link
{% endif %}
{% endif %}
Explanations:
First, I check if the current link is a link to a collection by checking type value.
If it is, I define an array of available products contained by the collection (accessing it via link.object) whith a filter. The where filter is here to keep only available products in the array.
Then I check if the array size, then I know whether collection contains available products or not.
HTH
Useful documentation :
Link object: https://shopify.dev/api/liquid/objects#link
Where filter (arrays): https://shopify.github.io/liquid/filters/where/
Size filter (arrays): https://shopify.github.io/liquid/filters/size/