/home/ejrndhmu/tokobiolink.com/user/pages/catalog.php
<?php
// Get all products with user access status
$products = getAllProductsWithUserAccess($currentUser['id']);

// Handle search
$search = $_GET['search'] ?? '';
if ($search) {
    $products = array_filter($products, function($product) use ($search) {
        return stripos($product['name'], $search) !== false || 
               stripos($product['description'], $search) !== false;
    });
}

// Handle filter
$filter = $_GET['filter'] ?? 'all';
if ($filter !== 'all') {
    $products = array_filter($products, function($product) use ($filter) {
        if ($filter === 'accessible') {
            return $product['has_access'] == 1;
        } elseif ($filter === 'not_accessible') {
            return $product['has_access'] == 0;
        }
        return true;
    });
}

$totalProducts = count($products);
?>

<div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
    <div class="flex flex-col lg:flex-row lg:items-center lg:justify-between mb-6">
        <div>
            <h2 class="text-2xl font-bold text-gray-800 mb-2">Katalog Produk</h2>
            <p class="text-gray-600">Lihat semua produk yang tersedia dan status akses Anda</p>
        </div>
        <div class="mt-4 lg:mt-0">
            <span class="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium bg-blue-100 text-blue-800">
                <i class="fas fa-box mr-1"></i>
                <?php echo $totalProducts; ?> Produk
            </span>
        </div>
    </div>

    <!-- Search and Filter -->
    <div class="flex flex-col md:flex-row gap-4 mb-6">
        <div class="flex-1">
            <form method="GET" class="relative">
                <input type="hidden" name="page" value="catalog">
                <?php if (isset($_GET['filter'])): ?>
                    <input type="hidden" name="filter" value="<?php echo htmlspecialchars($_GET['filter']); ?>">
                <?php endif; ?>
                <input type="text" 
                       name="search" 
                       value="<?php echo htmlspecialchars($search); ?>"
                       placeholder="Cari produk..."
                       class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent">
                <i class="fas fa-search absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
            </form>
        </div>
        <div class="flex gap-2">
            <a href="?page=catalog<?php echo $search ? '&search=' . urlencode($search) : ''; ?>" 
               class="px-4 py-2 rounded-lg border <?php echo $filter === 'all' ? 'bg-blue-primary text-white border-blue-primary' : 'bg-white text-gray-700 border-gray-300 hover:bg-gray-50'; ?> transition-colors">
                Semua
            </a>
            <a href="?page=catalog&filter=accessible<?php echo $search ? '&search=' . urlencode($search) : ''; ?>" 
               class="px-4 py-2 rounded-lg border <?php echo $filter === 'accessible' ? 'bg-green-600 text-white border-green-600' : 'bg-white text-gray-700 border-gray-300 hover:bg-gray-50'; ?> transition-colors">
                Dapat Diakses
            </a>
            <a href="?page=catalog&filter=not_accessible<?php echo $search ? '&search=' . urlencode($search) : ''; ?>" 
               class="px-4 py-2 rounded-lg border <?php echo $filter === 'not_accessible' ? 'bg-red-600 text-white border-red-600' : 'bg-white text-gray-700 border-gray-300 hover:bg-gray-50'; ?> transition-colors">
                Belum Dapat Diakses
            </a>
        </div>
    </div>

    <?php if (empty($products)): ?>
        <div class="text-center py-12">
            <i class="fas fa-box-open text-6xl text-gray-300 mb-4"></i>
            <h3 class="text-xl font-semibold text-gray-600 mb-2">Tidak Ada Produk</h3>
            <p class="text-gray-500">
                <?php if ($search): ?>
                    Tidak ditemukan produk dengan kata kunci "<?php echo htmlspecialchars($search); ?>"
                <?php else: ?>
                    Belum ada produk yang tersedia saat ini.
                <?php endif; ?>
            </p>
        </div>
    <?php else: ?>
        <!-- Products Grid -->
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
            <?php foreach ($products as $product): ?>
                <div class="bg-white border border-gray-200 rounded-lg overflow-hidden hover:shadow-lg transition-shadow duration-300">
                    <!-- Product Image -->
                    <div class="relative h-48 bg-gradient-to-br from-blue-50 to-indigo-100">
                        <?php if (isset($product['image']) && $product['image']): ?>
                            <img src="../uploads/products/<?php echo htmlspecialchars($product['image']); ?>" 
                                 alt="<?php echo htmlspecialchars($product['name']); ?>"
                                 class="w-full h-full object-cover">
                        <?php else: ?>
                            <div class="flex items-center justify-center h-full">
                                <i class="fas fa-box text-4xl text-gray-400"></i>
                            </div>
                        <?php endif; ?>
                        
                        <!-- Access Status Badge -->
                        <div class="absolute top-3 right-3">
                            <?php if ($product['has_access']): ?>
                                <span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-green-100 text-green-800">
                                    <i class="fas fa-check-circle mr-1"></i>
                                    Dapat Diakses
                                </span>
                            <?php else: ?>
                                <span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-red-100 text-red-800">
                                    <i class="fas fa-lock mr-1"></i>
                                    Terkunci
                                </span>
                            <?php endif; ?>
                        </div>
                    </div>

                    <!-- Product Info -->
                    <div class="p-4">
                        <div class="flex items-start justify-between mb-2">
                            <h3 class="text-lg font-semibold text-gray-800 line-clamp-2">
                                <?php echo htmlspecialchars($product['name']); ?>
                            </h3>
                        </div>
                        
                        <p class="text-gray-600 text-sm mb-3 line-clamp-2">
                            <?php echo htmlspecialchars($product['description']); ?>
                        </p>
                        
                        <!-- Provider Info -->
                        <div class="flex items-center justify-between mb-3">
                            <div class="flex items-center text-sm text-gray-500">
                                <i class="fas fa-user-circle mr-1"></i>
                                <span><?php echo htmlspecialchars($product['provider_name']); ?></span>
                            </div>
                            <div class="text-lg font-bold text-blue-primary">
                                <?php echo $product['price'] > 0 ? 'Rp ' . number_format($product['price'], 0, ',', '.') : 'Gratis'; ?>
                            </div>
                        </div>
                        
                        <!-- Action Button -->
                        <div class="mt-4">
                            <?php if ($product['has_access']): ?>
                                <a href="?page=products" 
                                   class="w-full bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200 flex items-center justify-center">
                                    <i class="fas fa-box mr-2"></i>
                                    Lihat di Produk Saya
                                </a>
                                <?php if ($product['user_access_granted']): ?>
                                    <p class="text-xs text-gray-500 mt-2 text-center">
                                        Akses diberikan: <?php echo date('d M Y', strtotime($product['user_access_granted'])); ?>
                                    </p>
                                <?php endif; ?>
                            <?php else: ?>
                                <button class="w-full bg-gray-300 text-gray-500 font-medium py-2 px-4 rounded-lg cursor-not-allowed flex items-center justify-center" disabled>
                                    <i class="fas fa-lock mr-2"></i>
                                    Akses Diperlukan
                                </button>
                                <p class="text-xs text-gray-500 mt-2 text-center">
                                    Hubungi admin atau reseller untuk mendapatkan akses
                                </p>
                            <?php endif; ?>
                        </div>
                    </div>
                </div>
            <?php endforeach; ?>
        </div>
    <?php endif; ?>
</div>

<style>
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
</style>