<?php

require_once __DIR__ . '/app/helpers.php';
require_once __DIR__ . '/app/analytics.php';
require_once __DIR__ . '/app/public-layout.php';
require_once __DIR__ . '/app/shop-products.php';

$shop_title = trim(sparrow_public_setting('shop_page_title', 'Shop'));
$shop_intro = trim(sparrow_public_setting('shop_page_intro'));
$products_per_page = max(1, min(100, (int) sparrow_public_setting('shop_products_per_page', '20')));
$shop_categories = array_values(array_unique(array_filter(array_map(
    'trim',
    preg_split('/\r\n|\r|\n/', sparrow_public_setting('shop_product_categories')) ?: []
))));
$selected_category = trim((string) ($_GET['category'] ?? ''));

if ($selected_category !== '' && !in_array($selected_category, $shop_categories, true)) {
    $selected_category = '';
}

sparrow_record_analytics_event('page_view', 'page', null, 'Shop', '', '/shop.php');

$shop_css = <<<'CSS'
.public-card h1,
.public-card h2,
.public-card h3,
.shop-product-card h2,
.shop-product-card h3 {
    color: var(--sparrow-purple-dark);
}

.shop-intro-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.shop-soft-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 16px;
    border-radius: 999px;
    background: var(--sparrow-soft-pink);
    border: 1px solid var(--sparrow-border);
    color: var(--sparrow-purple-dark);
    font-weight: bold;
    font-size: 13px;
    text-decoration: none;
}

.shop-soft-button:hover {
    background: #ffffff;
    text-decoration: none;
}

.shop-category-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.shop-category-pill {
    display: inline-flex;
    align-items: center;
    padding: 7px 12px;
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid var(--sparrow-border);
    color: var(--sparrow-purple-dark);
    font-size: 13px;
    font-weight: bold;
    text-decoration: none;
}

.shop-category-pill:hover,
.shop-category-pill.is-active {
    background: var(--sparrow-soft-pink);
}

.shop-section-space {
    margin-top: 18px;
}

.shop-product-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
    margin-top: 18px;
}

.shop-product-card {
    background: var(--sparrow-card);
    border: 1px solid var(--sparrow-border);
    border-radius: 18px;
    padding: 12px;
    box-shadow: 0 8px 24px rgba(70, 35, 60, 0.05);
}

.shop-product-image {
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 14px;
    border: 1px dashed var(--sparrow-border);
    background: var(--sparrow-soft-pink);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--sparrow-muted);
    text-align: center;
    padding: 10px;
    font-size: 12px;
    margin-bottom: 10px;
}

.shop-product-card h2 {
    margin: 0 0 7px;
    font-size: 16px;
    line-height: 1.2;
}

.shop-product-description {
    color: var(--sparrow-muted);
    line-height: 1.4;
    margin: 0 0 10px;
    font-size: 13px;
}

.shop-product-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 9px;
}

.shop-price-pill,
.shop-stock-pill,
.shop-category-small-pill {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    border-radius: 999px;
    border: 1px solid var(--sparrow-border);
    font-size: 11px;
    font-weight: bold;
}

.shop-price-pill {
    background: var(--sparrow-soft-pink);
    color: var(--sparrow-purple-dark);
}

.shop-stock-pill {
    background: #ffffff;
    color: var(--sparrow-purple-dark);
}

.shop-category-small-pill {
    background: #ffffff;
    color: var(--sparrow-muted);
}

.shop-empty-note {
    color: var(--sparrow-muted);
    line-height: 1.6;
}

.shop-pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 24px;
}

.shop-product-image-link,
.shop-product-title-link {
    color: inherit;
    text-decoration: none;
}

.shop-product-image-link:hover,
.shop-product-title-link:hover {
    text-decoration: none;
}

.shop-product-title-link:hover {
    color: var(--sparrow-pink);
}

@media (max-width: 1100px) {
    .shop-product-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 800px) {
    .shop-product-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 520px) {
    .shop-product-grid {
        grid-template-columns: 1fr;
    }
}
CSS;

$all_products = sparrow_get_shop_products(false);

if ($selected_category !== '') {
    $all_products = array_values(array_filter(
        $all_products,
        static fn(array $product): bool => (string) ($product['category'] ?? '') === $selected_category
    ));
}

$total_products = count($all_products);
$total_pages = max(1, (int) ceil($total_products / $products_per_page));
$page = max(1, min((int) ($_GET['page'] ?? 1), $total_pages));
$products = array_slice($all_products, ($page - 1) * $products_per_page, $products_per_page);

sparrow_public_header($shop_title !== '' ? $shop_title : 'Shop', 'shop', $shop_css);

?>

<section class="public-card public-hero">
    <h1><?php echo sparrow_escape($shop_title !== '' ? $shop_title : 'Shop'); ?></h1>

    <?php if ($shop_intro !== ''): ?>
        <p><?php echo nl2br(sparrow_escape($shop_intro)); ?></p>
    <?php endif; ?>

    <div class="shop-intro-actions">
        <a class="shop-soft-button" href="<?php echo sparrow_escape(sparrow_url('/order.php')); ?>">
            Need Something Custom?
        </a>
    </div>
</section>

<section class="public-card shop-section-space">
    <h2>Shop Categories</h2>

    <div class="shop-category-row">
        <a class="shop-category-pill <?php echo $selected_category === '' ? 'is-active' : ''; ?>" href="<?php echo sparrow_escape(sparrow_url('/shop.php')); ?>">All</a>
        <?php foreach ($shop_categories as $category): ?>
            <a
                class="shop-category-pill <?php echo $selected_category === $category ? 'is-active' : ''; ?>"
                href="<?php echo sparrow_escape(sparrow_url('/shop.php?' . http_build_query(['category' => $category]))); ?>"
            ><?php echo sparrow_escape($category); ?></a>
        <?php endforeach; ?>
    </div>
</section>

<?php if (!$products): ?>
    <section class="public-card shop-section-space">
        <h2>No shop products yet</h2>

        <p class="shop-empty-note">
            Premade shop items will show here once they are added in the Backyard.
        </p>
    </section>
<?php else: ?>
    <section class="shop-product-grid shop-section-space">
        <?php foreach ($products as $product): ?>
            <article class="shop-product-card">
                <a
    class="shop-product-image-link"
    href="<?php echo sparrow_escape(sparrow_url('/product.php?id=' . (int) $product['id'])); ?>"
>
    <?php if (!empty($product['image_path'])): ?>
        <img
            class="shop-product-image"
            src="<?php echo sparrow_escape(sparrow_url($product['image_path'])); ?>"
            alt="<?php echo sparrow_escape($product['product_name']); ?>"
        >
    <?php else: ?>
        <div class="shop-product-image">
            Product image coming soon
        </div>
    <?php endif; ?>
</a>

                <div class="shop-product-meta">
                    <span class="shop-price-pill">
                        $<?php echo sparrow_escape(number_format((float) $product['price'], 2)); ?>
                    </span>

                    <span class="shop-stock-pill">
                        Qty: <?php echo (int) $product['quantity_available']; ?>
                    </span>

                    <?php if (!empty($product['category'])): ?>
                        <span class="shop-category-small-pill">
                            <?php echo sparrow_escape($product['category']); ?>
                        </span>
                    <?php endif; ?>
                </div>

                <h2>
    <a
        class="shop-product-title-link"
        href="<?php echo sparrow_escape(sparrow_url('/product.php?id=' . (int) $product['id'])); ?>"
    >
        <?php echo sparrow_escape($product['product_name']); ?>
    </a>
</h2>

<a
    class="shop-soft-button"
    href="<?php echo sparrow_escape(sparrow_url('/product.php?id=' . (int) $product['id'])); ?>"
>
    View Details
</a>
            </article>
        <?php endforeach; ?>
    </section>

    <?php if ($total_pages > 1): ?>
        <nav class="shop-pagination" aria-label="Shop pages">
            <?php for ($i = 1; $i <= $total_pages; $i++): ?>
                <?php $query = array_filter(['category' => $selected_category, 'page' => $i]); ?>
                <a
                    class="shop-category-pill <?php echo $i === $page ? 'is-active' : ''; ?>"
                    href="<?php echo sparrow_escape(sparrow_url('/shop.php?' . http_build_query($query))); ?>"
                ><?php echo $i; ?></a>
            <?php endfor; ?>
        </nav>
    <?php endif; ?>
<?php endif; ?>

<section class="public-card shop-section-space">
    <h2>Looking for something custom?</h2>

    <p>
        If you do not see what you are looking for, you can still send a custom request with your idea,
        size, color, wording, and any inspiration details.
    </p>

    <a class="shop-soft-button" href="<?php echo sparrow_escape(sparrow_url('/order.php')); ?>">
        Start a Custom Request
    </a>
</section>

<?php sparrow_public_footer(); ?>
