ultimatepos/Modules/AssetExchange/Resources/views/layouts/nav.blade.php

<section class="no-print">
    @include('assetexchange::layouts.styles')
    @include('assetexchange::layouts.datatables_lang')
    @php
        $aexSeg2 = request()->segment(2);
        $aexActiveDashboard = $aexSeg2 === 'dashboard' || $aexSeg2 === null;
        $aexActiveListings = $aexSeg2 === 'listings';
        $aexActiveAppraisals = $aexSeg2 === 'appraisals';
        $aexActiveDeals = $aexSeg2 === 'deals';
        $aexActiveOffers = $aexSeg2 === 'offers';
        $aexActivePipeline = $aexSeg2 === 'pipeline';
        $aexActiveReports = $aexSeg2 === 'reports';
        $aexActiveSettings = $aexSeg2 === 'settings';
        $aexNavHome = action([\Modules\AssetExchange\Http\Controllers\DashboardController::class, 'index']);
    @endphp
    <nav class="navbar navbar-default mt-nav-wrap">
        <div class="container-fluid">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#aex-navbar" aria-expanded="false">
                    <span class="sr-only">@lang('assetexchange::lang.toggle_nav')</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand mt-nav-brand" href="{{ $aexNavHome }}">
                    <i class="fas fa-exchange-alt"></i>
                    @lang('assetexchange::lang.module_name')
                </a>
            </div>
            <div class="collapse navbar-collapse" id="aex-navbar">
                <ul class="nav navbar-nav mt-nav-groups">
                    @can('aex.view')
                    <li @if($aexActiveDashboard) class="active" @endif>
                        <a href="{{ action([\Modules\AssetExchange\Http\Controllers\DashboardController::class, 'index']) }}">
                            <i class="fas fa-tachometer-alt"></i> @lang('assetexchange::lang.dashboard')
                        </a>
                    </li>
                    @endcan

                    @can('aex.view')
                    <li @if($aexSeg2 === 'notifications') class="active" @endif>
                        <a href="{{ action([\Modules\AssetExchange\Http\Controllers\NotificationController::class, 'index']) }}">
                            <i class="fas fa-bell"></i> @lang('assetexchange::lang.notifications')
                            <span class="label label-warning aex-unread-badge" style="display:none;margin-right:6px;"></span>
                            <span class="aex-unread-updated text-muted" style="font-size:10px;margin-right:6px;display:none;"></span>
                        </a>
                    </li>
                    @endcan

                    @can('aex.listings.view')
                    <li @if($aexActiveListings) class="active" @endif>
                        <a href="{{ action([\Modules\AssetExchange\Http\Controllers\ListingController::class, 'index']) }}">
                            <i class="fas fa-list"></i> @lang('assetexchange::lang.listings')
                        </a>
                    </li>
                    @endcan

                    @can('aex.appraisals.view')
                    <li @if($aexActiveAppraisals) class="active" @endif>
                        <a href="{{ action([\Modules\AssetExchange\Http\Controllers\AppraisalController::class, 'index']) }}">
                            <i class="fas fa-search-dollar"></i> @lang('assetexchange::lang.appraisals')
                        </a>
                    </li>
                    @endcan

                    @can('aex.deals.view')
                    <li @if($aexActiveDeals) class="active" @endif>
                        <a href="{{ action([\Modules\AssetExchange\Http\Controllers\DealController::class, 'index']) }}">
                            <i class="fas fa-handshake"></i> @lang('assetexchange::lang.deals')
                        </a>
                    </li>
                    @endcan

                    @can('aex.offers.view')
                    <li @if($aexActiveOffers) class="active" @endif>
                        <a href="{{ action([\Modules\AssetExchange\Http\Controllers\OfferController::class, 'index']) }}">
                            <i class="fas fa-tag"></i> @lang('assetexchange::lang.offers')
                        </a>
                    </li>
                    @endcan

                    @can('aex.pipeline.view')
                    <li @if($aexActivePipeline) class="active" @endif>
                        <a href="{{ action([\Modules\AssetExchange\Http\Controllers\PipelineController::class, 'index']) }}">
                            <i class="fas fa-project-diagram"></i> @lang('assetexchange::lang.pipeline')
                        </a>
                    </li>
                    @endcan

                    @can('aex.reports.view')
                    <li @if($aexActiveReports) class="active" @endif>
                        <a href="{{ action([\Modules\AssetExchange\Http\Controllers\ReportController::class, 'index']) }}">
                            <i class="fas fa-chart-bar"></i> @lang('assetexchange::lang.reports')
                        </a>
                    </li>
                    @endcan

                    @can('aex.access')
                    <li @if($aexActiveSettings) class="active" @endif>
                        <a href="{{ action([\Modules\AssetExchange\Http\Controllers\SettingsController::class, 'index']) }}">
                            <i class="fas fa-sliders-h"></i> @lang('assetexchange::lang.settings')
                        </a>
                    </li>
                    @endcan
                </ul>
            </div>
        </div>
    </nav>
</section>

<script>
$(function () {
    var isPolling = false;
    var pollTimer = null;
    var baseIntervalMs = 30000;
    var currentIntervalMs = baseIntervalMs;

    function setBadge(count) {
        var $badge = $('.aex-unread-badge');
        if (count > 0) {
            $badge.text(count).show();
        } else {
            $badge.hide();
        }
    }

    function setUpdatedNow() {
        var now = new Date();
        var hh = String(now.getHours()).padStart(2, '0');
        var mm = String(now.getMinutes()).padStart(2, '0');
        $('.aex-unread-updated').text('↻ ' + hh + ':' + mm).show();
    }

    function scheduleNext(ms) {
        if (pollTimer) {
            clearTimeout(pollTimer);
        }
        pollTimer = setTimeout(runPoll, ms);
    }

    function runPoll() {
        if (document.hidden || isPolling) {
            scheduleNext(baseIntervalMs);
            return;
        }

        isPolling = true;
        $.getJSON('{{ action([\Modules\AssetExchange\Http\Controllers\NotificationController::class, 'unreadCount']) }}')
            .done(function (res) {
                var count = parseInt(res.unread_count || 0, 10);
                setBadge(count);
                setUpdatedNow();
                currentIntervalMs = baseIntervalMs;
            })
            .fail(function () {
                // Exponential backoff up to 5 minutes when endpoint fails.
                currentIntervalMs = Math.min(currentIntervalMs * 2, 300000);
            })
            .always(function () {
                isPolling = false;
                scheduleNext(currentIntervalMs);
            });
    }

    document.addEventListener('visibilitychange', function () {
        if (!document.hidden) {
            currentIntervalMs = baseIntervalMs;
            runPoll();
        }
    });

    $(document).on('click', '.aex-unread-badge, .aex-unread-updated', function (e) {
        e.preventDefault();
        currentIntervalMs = baseIntervalMs;
        runPoll();
    });

    runPoll();
});
</script>