<?php
/**
 * Hyvä Themes - https://hyva.io
 * Copyright © Hyvä Themes. All rights reserved.
 * See COPYING.txt for license details.
 */

use Magento\ConfigurableProduct\Model\Product\Type\Configurable;
use Magento\Framework\Escaper;
use Magento\GiftMessage\Helper\Message as GiftMessageHelper;
use Magento\Sales\Block\Order\Items;

// phpcs:disable Magento2.Templates.ThisInTemplate.FoundThis
// phpcs:disable Magento2.Templates.ThisInTemplate.FoundHelper

/** @var Items $block */
/** @var Escaper $escaper */

$helper = $this->helper(GiftMessageHelper::class);
$cols = $block->getData('is_context_shipment') ? 3 : 5;
?>
<div class="order-items">
    <?php if ($block->isPagerDisplayed()): ?>
        <?= $block->getPagerHtml() ?>
    <?php endif ?>
    <div class="hidden lg:grid grid-cols-<?= $escaper->escapeHtmlAttr($cols) ?> text-sm mt-2">
        <div class="p-2 col-span-2"><?= $escaper->escapeHtml(__('Product Name')) ?></div>
        <?php if (!$block->getData('is_context_shipment')): ?>
            <div class="p-2"><?= $escaper->escapeHtml(__('Price')) ?></div><?php endif; ?>
        <div class="p-2"><?= $escaper->escapeHtml(__('Qty')) ?></div>
        <?php if (!$block->getData('is_context_shipment')): ?>
            <div class="p-2 text-right"><?= $escaper->escapeHtml(__('Subtotal')) ?></div><?php endif; ?>
    </div>
    <?php $items = $block->getOrder()->getAllItems(); ?>
    <?php $giftMessage = '' ?>
    <?php foreach ($items as $item): ?>
        <?php
        $parentItem = $item->getParentItem();
        if ($parentItem && $parentItem->getData('product_type') === Configurable::TYPE_CODE) {
            continue;
        }
        ?>
        <div class="<?= ($parentItem) ?
            'child-item ml-2 px-4 mb-2 border-l-4 border-gray-300 text-sm' :
            'parent-item mb-2'
        ?>">
            <?= $block->getItemHtml($item) ?>
        </div>
        <?php if ($helper->isMessagesAllowed('order_item', $item) && $item->getGiftMessageId()): ?>
            <?php $giftMessage = $helper->getGiftMessageForEntity($item); ?>
            <div class="col options mb-2" x-data="{ open: false }">
                <button type="button"
                        @click="open = !open"
                        class="text-blue-600 hover:text-blue-800 underline cursor-pointer inline-flex items-center gap-1"
                        :aria-expanded="open">
                    <span x-text="open ? '<?= $escaper->escapeJs(__('Hide Gift Message')) ?>' : '<?= $escaper->escapeJs(__('Gift Message')) ?>'"></span>
                    <svg class="w-4 h-4 transition-transform duration-200" :class="{ 'rotate-180': open }" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
                        <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd" />
                    </svg>
                </button>
                <div x-show="open"
                     x-transition:enter="transition ease-out duration-200"
                     x-transition:enter-start="opacity-0 transform -translate-y-2"
                     x-transition:enter-end="opacity-100 transform translate-y-0"
                     x-transition:leave="transition ease-in duration-150"
                     x-transition:leave-start="opacity-100 transform translate-y-0"
                     x-transition:leave-end="opacity-0 transform -translate-y-2"
                     x-cloak
                     class="order-gift-message mt-3 p-4 bg-gray-50 border border-gray-200 rounded-lg"
                     id="order-item-gift-message-<?= (int)$item->getId() ?>"
                     role="region">
                    <div class="flex justify-between items-start mb-3">
                        <h4 class="font-semibold text-gray-700"><?= $escaper->escapeHtml(__('Gift Message')) ?></h4>
                        <button type="button"
                                @click="open = false"
                                title="<?= $escaper->escapeHtmlAttr(__('Close')) ?>"
                                class="text-gray-400 hover:text-gray-600 transition-colors">
                            <svg class="w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
                                <path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" />
                            </svg>
                            <span class="sr-only"><?= $escaper->escapeHtml(__('Close')) ?></span>
                        </button>
                    </div>
                    <dl class="item-options space-y-2">
                        <div class="flex gap-2">
                            <dt class="item-sender font-medium text-gray-600">
                                <?= $escaper->escapeHtml(__('From')) ?>:
                            </dt>
                            <dd class="text-gray-800"><?= $escaper->escapeHtml($giftMessage->getSender()) ?></dd>
                        </div>
                        <div class="flex gap-2">
                            <dt class="item-recipient font-medium text-gray-600">
                                <?= $escaper->escapeHtml(__('To')) ?>:
                            </dt>
                            <dd class="text-gray-800"><?= $escaper->escapeHtml($giftMessage->getRecipient()) ?></dd>
                        </div>
                        <div class="pt-2 border-t border-gray-200">
                            <dt class="font-medium text-gray-600 mb-1"><?= $escaper->escapeHtml(__('Message')) ?>:</dt>
                            <dd class="item-message text-gray-800 italic">
                                <?= /* @noEscape */ $helper->getEscapedGiftMessage($item) ?>
                            </dd>
                        </div>
                    </dl>
                </div>
            </div>
        <?php endif ?>
    <?php endforeach; ?>
    <?php if ($block->isPagerDisplayed()): ?>
        <?= $block->getPagerHtml() ?>
    <?php endif ?>
</div>
<div class="flex justify-end border-t border-gray-300 mt-2">
    <div class="lg:w-1/3">
        <div class="grid grid-cols-2 text-right p-2 gap-2">
            <?= $block->getChildHtml('order_totals') ?>
        </div>
    </div>
</div>
