<?php

/**
 * Workspace Users list view.
 *
 * Variables expected:
 *   $users   — array — List of workspace users.
 *   $success — string|null — Success flash message.
 */

/** @var array $users */
/** @var string|null $success */

?>

<div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
    
    <!-- Title and Header Section -->
    <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-6">
        <div>
            <h1 class="text-2xl font-black tracking-tight text-slate-800 flex items-center gap-2.5">
                <span class="page-header-icon">
                    <i class="fa-solid fa-user-group"></i>
                </span>
                Workspace Users
            </h1>
            <p class="text-sm text-slate-500 mt-1.5 ml-0.5">Manage team members who have access to this wedding workspace.</p>
        </div>
        <div>
            <a href="<?= url('/app/couple/users/create') ?>" class="btn btn-primary btn-sm flex items-center gap-1.5">
                <i class="fa-solid fa-user-plus text-[10px]"></i> Add User
            </a>
        </div>
    </div>

    <!-- Notices -->
    <?php if ($success !== null): ?>
        <div class="p-4 bg-emerald-50 border border-emerald-150 text-emerald-800 rounded-2xl flex items-center gap-3 text-sm shadow-sm mb-4">
            <i class="fa-solid fa-circle-check text-emerald-500 text-base flex-shrink-0"></i>
            <div class="font-semibold"><?= escape_html($success) ?></div>
        </div>
    <?php endif; ?>

    <!-- Users Table Card -->
    <div class="card p-0 overflow-hidden">
        <div class="overflow-x-auto">
            <table class="table-elegant">
                <thead>
                    <tr>
                        <th class="px-6 py-4">Display Name</th>
                        <th class="px-6 py-4">Username</th>
                        <th class="px-6 py-4">Role</th>
                        <th class="px-6 py-4">Status</th>
                        <th class="px-6 py-4 text-right">Actions</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-100 text-slate-600">
                    <?php if (empty($users)): ?>
                        <tr>
                            <td colspan="5" class="px-6 py-10 text-center text-slate-400 font-semibold">
                                No users found in this workspace.
                            </td>
                        </tr>
                    <?php else: ?>
                        <?php foreach ($users as $user): ?>
                            <tr>
                                <td class="px-6 py-4 font-bold text-slate-800">
                                    <?= escape_html($user['display_name']) ?>
                                </td>
                                <td class="px-6 py-4 font-mono text-slate-500">
                                    <?= escape_html($user['username']) ?>
                                </td>
                                <td class="px-6 py-4">
                                    <?php if ($user['role_slug'] === 'couple'): ?>
                                        <span class="badge badge-primary">
                                            Owner
                                        </span>
                                    <?php else: ?>
                                        <span class="badge badge-secondary">
                                            Crew
                                        </span>
                                    <?php endif; ?>
                                </td>
                                <td class="px-6 py-4">
                                    <?php if ((int) $user['is_active'] === 1): ?>
                                        <span class="badge badge-success">
                                            Active
                                        </span>
                                    <?php else: ?>
                                        <span class="badge badge-danger">
                                            Deactivated
                                        </span>
                                    <?php endif; ?>
                                </td>
                                <td class="px-6 py-4 text-right text-sm">
                                    <a href="<?= url('/app/couple/users/edit/' . (int) $user['id']) ?>" class="link-elegant font-bold inline-flex items-center gap-1">
                                        <i class="fa-solid fa-pen text-[10px]"></i> Edit
                                    </a>
                                </td>
                            </tr>
                        <?php endforeach; ?>
                    <?php endif; ?>
                </tbody>
            </table>
        </div>
    </div>

</div>
