<?php

/**
 * @deprecated UX009 — This file is a LEGACY ORPHAN.
 *
 * This horizontal navigation component is NOT included by any current layout.
 * The active Couple Portal layout (app/views/layouts/couple.php) uses an inline
 * sidebar navigation pattern instead.
 *
 * Routes referenced here (RSVP, Vendors, Communication) are stubs and no longer
 * match the current route structure.
 *
 * This file should be DELETED in a future cleanup sprint.
 * Do NOT include or extend this component.
 *
 * Replaced by: inline <nav> block inside app/views/layouts/couple.php
 *
 * @ref UX009 Final Audit
 */

/**
 * Couple Portal Navigation Bar Component (LEGACY — NOT IN USE)
 *
 * Renders the top navigation bar for the Couple Portal.
 * Included by app/views/layouts/couple.php.
 *
 * Active state: compares the current REQUEST_URI against each nav item's
 * base path. Applies the 'active' CSS class to the matching link.
 *
 * Variables expected in scope (optional, from layout data):
 *   $workspaceName — string — Couple's workspace name. Placeholder until Sprint 3.
 *   $currentUser   — array  — Authenticated user. Placeholder until Sprint 2.
 *
 * Navigation items (Couple Portal modules):
 *   Dashboard     → /app/couple/dashboard
 *   Guests        → /app/couple/guests
 *   RSVP          → /app/couple/rsvp
 *   Vendors       → /app/couple/vendors
 *   Communication → /app/couple/communication
 *   Settings      → /app/couple/settings
 *
 * Note: These routes are not yet registered (Sprint 1+). The links are
 * structural placeholders — they will resolve correctly once routes exist.
 *
 * Mobile: Alpine.js $store('nav').toggle() drives the mobile menu open state.
 *
 * @ref  INIT-011, DBP v1.0 Ch.8, Sprint 0 Execution Plan
 */

$currentUri = $_SERVER['REQUEST_URI'] ?? '';
$workspaceName = isset($workspaceName) && is_string($workspaceName)
    ? $workspaceName
    : 'My Wedding';

/**
 * Helper to determine nav link active state.
 * Returns 'active' if the current URI starts with $path.
 *
 * @param string $path  Route path prefix to match.
 * @return string  'active' or ''
 */
$navActive = function (string $path) use ($currentUri): string {
    return strpos($currentUri, $path) === 0 ? 'active' : '';
};

/** @var array<int, array{label: string, href: string, icon: string, path: string}> */
$navItems = [
    [
        'label' => 'Dashboard',
        'href'  => '/app/couple/dashboard',
        'path'  => '/app/couple/dashboard',
        'icon'  => '⊞',
    ],
    [
        'label' => 'Guests',
        'href'  => '/app/couple/guests',
        'path'  => '/app/couple/guests',
        'icon'  => '👥',
    ],
    [
        'label' => 'RSVP',
        'href'  => '/app/couple/rsvp',
        'path'  => '/app/couple/rsvp',
        'icon'  => '✉',
    ],
    [
        'label' => 'Vendors',
        'href'  => '/app/couple/vendors',
        'path'  => '/app/couple/vendors',
        'icon'  => '🏷',
    ],
    [
        'label' => 'Communication',
        'href'  => '/app/couple/communication',
        'path'  => '/app/couple/communication',
        'icon'  => '💬',
    ],
    [
        'label' => 'Users',
        'href'  => '/app/couple/users',
        'path'  => '/app/couple/users',
        'icon'  => '👤',
    ],
    [
        'label' => 'Settings',
        'href'  => '/app/couple/settings',
        'path'  => '/app/couple/settings',
        'icon'  => '⚙',
    ],
];

?>
<nav class="app-nav" aria-label="Couple portal navigation">
    <div class="app-nav-inner">

        <!-- Logo / Brand -->
        <a href="/app/couple/dashboard" class="app-nav-logo" aria-label="Inveetaire – Go to dashboard">
            Inveetaire
        </a>

        <!-- Desktop navigation links -->
        <ul
            class="app-nav-links"
            id="nav-couple-links"
            x-data
            :class="$store('nav').mobileOpen ? 'is-open' : ''"
            role="menubar"
        >
            <?php foreach ($navItems as $item): ?>
                <li role="none">
                    <a
                        href="<?= escape_html($item['href']) ?>"
                        class="app-nav-link <?= $navActive($item['path']) ?>"
                        role="menuitem"
                        <?php if ($navActive($item['path']) === 'active'): ?>
                            aria-current="page"
                        <?php endif; ?>
                    >
                        <span aria-hidden="true"><?= $item['icon'] ?></span>
                        <?= escape_html($item['label']) ?>
                    </a>
                </li>
            <?php endforeach; ?>
        </ul>

        <!-- Right section: workspace name + user placeholder -->
        <div class="app-nav-right">
            <span
                class="hidden md:flex items-center gap-1 text-sm text-neutral-500 truncate max-w-[160px]"
                title="<?= escape_html($workspaceName) ?>"
                aria-label="Current workspace: <?= escape_html($workspaceName) ?>"
            >
                <?= escape_html($workspaceName) ?>
            </span>

            <!-- User avatar placeholder — Sprint 2 Auth fills this in -->
            <button
                type="button"
                class="flex items-center justify-center w-8 h-8 rounded-full bg-violet-100 text-violet-700 text-sm font-semibold focus:outline-none focus:ring-2 focus:ring-violet-500"
                aria-label="Account menu"
                title="Account"
                disabled
            >
                ?
            </button>

            <!-- Mobile menu toggle -->
            <button
                type="button"
                class="app-nav-mobile"
                x-data
                @click="$store('nav').toggle()"
                :aria-expanded="$store('nav').mobileOpen.toString()"
                aria-controls="nav-couple-links"
                aria-label="Toggle mobile navigation"
            >
                <i x-show="!$store('nav').mobileOpen" class="fa-solid fa-bars text-lg"></i>
                <i x-show="$store('nav').mobileOpen" class="fa-solid fa-xmark text-lg" style="display: none;"></i>
            </button>
        </div>

    </div>
</nav>
