MetisMenu highlighting all the links if anchor tag links doesnt end with .html

[cwdabba]

Welcome to the metismenu issues!

Please take a moment to:

• Read the Contributing Guide (found at https://github.com/onokumus/metismenu/tree/master/.github/contributing.md)
• Review the project readme (you might find advice about creating new issues)

Once have reviewed both documents, please delete everything up to and including this line and provide the following details.

Version

_(note the version of metismenu you were using when you experienced the issue (this is required for bug reports)

jQuery v3.6.0
metisMenu v3.0.7

Description

I am using Metis Menu with Laravel but there seems to be an issue with it. If the anchor URL is not ending with .html then its highlighting all the links as shown in the image below

If li > a anchor links don't have a URL ending with .html then highlighting all the links

Following is my PHP Blade code

<div class="vertical-menu">

    <div data-simplebar class="h-100">

        <!--- Sidemenu -->
        <div id="sidebar-menu">
            <!-- Left Menu Start -->
            <ul class="metismenu list-unstyled" id="side-menu">
                <li>
                    <a href="{{ route('dashboard') }}">
                        <i data-feather="command"></i>
                        <span data-key="t-dashboard">Dashboard</span>
                    </a>
                </li>

                <li>
                    <a href="{{ route('usage-analytics') }}">
                        <i data-feather="trending-up"></i>
                        <span data-key="t-usage-analytics">Usage Analytics</span>
                    </a>
                </li>

                <li>
                    <a href="{{ route('earnings') }}">
                        <i data-feather="dollar-sign"></i>
                        <span data-key="t-earnings">Earnings</span>
                    </a>
                </li>

                <li>
                    <a href="{{ route('referral-programs') }}">
                        <i data-feather="link"></i>
                        <span data-key="t-referral-program">Referral Program</span>
                    </a>
                </li>

                <li>
                    <a href="{{ route('video-repositorys') }}">
                        <i data-feather="play-circle"></i>
                        <span data-key="t-video-repository">Video Repository</span>
                    </a>
                </li>

                <li>
                    <a href="{{ route('transactions') }}">
                        <i data-feather="database"></i>
                        <span data-key="t-transaction-details">Transaction Details</span>
                    </a>
                </li>

                <li>
                    <a href="{{ route('buy') }}">
                        <i data-feather="shopping-cart"></i>
                        <span data-key="t-buy">Buy</span>
                    </a>
                </li>

                <li>
                    <a href="javascript: void(0);" class="has-arrow" aria-expanded="false">
                        <i data-feather="settings"></i>
                        <span data-key="t-settings">Settings</span>
                    </a>
                    <ul class="sub-menu" aria-expanded="false">
                        <li>
                            <a href="{{ route('dashboard') }}">
                                <i data-feather="user"></i>
                                <span data-key="t-profile">Profile</span>
                            </a>
                        </li>

                        <li>
                            <a href="javascript: void(0);" class="has-arrow" aria-expanded="false">
                                <i data-feather="briefcase"></i>
                                <span data-key="t-payout-details">Payout Details</span>
                            </a>
                            <ul class="sub-menu" aria-expanded="false">
                                <li>
                                    <a href="{{ route('payouts.bank') }}" data-key="t-payout-details">
                                        <i data-feather="credit-card"></i>
                                        <span data-key="t-bank">Bank</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="{{ route('payouts.metamask') }}" data-key="t-metamask">
                                        <i data-feather="gitlab"></i>
                                        <span data-key="t-metamask">MetaMask</span>
                                    </a>
                                </li>
                            </ul>
                        </li>

                        <li>
                            <a href="{{ route('password') }}">
                                <i data-feather="key"></i>
                                <span data-key="t-profile">Password</span>
                            </a>
                        </li>
                    </ul>
                </li>

                <li>
                    <a href="{{ route('auth.logout') }}">
                        <i data-feather="power"></i>
                        <span data-key="t-logout">Logout</span>
                    </a>
                </li>
            </ul>
        </div>
        <!-- Sidebar -->
    </div>
</div>

Error message

# please paste any error messages here

metisMenu.js

// Please paste contents of metisMenu.js here, or in a gist.
// Be sure to include any additional comments that might help
// us resolve the issue.