<?php
/**
 * @author Amasty Team
 * @copyright Copyright (c) Amasty (https://www.amasty.com)
 * @package Blog Pro for Magento 2
 */
/**
 * @var \Amasty\Blog\Block\Comments\Message $block
 * @var \Magento\Framework\Escaper $escaper
 */

$svgLink = $block->getViewFileUrl('Amasty_Blog::images/sprite.svg');
$isReply = (bool)$block->getMessage()->getReplyTo();
$levelTopClass = !$isReply ? '-level-top' : '';
$colorThemeClass = $block->getColorClass();
?>

<div class="amblog-comment <?= /** @noEscape */ $levelTopClass; ?> <?= $escaper->escapeHtmlAttr($colorThemeClass); ?>"
     data-amblog-js="comment-item"
     id="am-blog-comment-<?= $escaper->escapeHtmlAttr($block->getMessageId()); ?>">
    <div class="amblog-comment-content <?= $block->isMyComment() ? 'my-comment' : ''; ?>">
        <div class="amblog-header">
            <div class="amblog-author">
                <svg class="amblog-svg user <?= $escaper->escapeHtmlAttr($colorThemeClass); ?>">
                    <use xlink:href="<?= $escaper->escapeUrl($svgLink); ?>#user"></use>
                </svg>
                <?= $escaper->escapeHtml($block->getAuthor()); ?>
            </div>
            <div class="amblog-date"
                <?php if ($block->isHumanized()): ?>
                    data-mage-init='{"amBlogDates": "<?= $escaper->escapeJs($block->getDate()) ?>"}'
                <?php endif; ?>>
                <?= $escaper->escapeHtml($block->isHumanized()
                    ? __('Loading...')
                    : $block->getDate()) ?>
            </div>
        </div>
        <?php if ($block->getNeedApproveMessage()): ?>
            <div class="amblog-thesis">
                <?= $escaper->escapeHtml($block->getContent()); ?>
            </div>
            <div class="amblog-willapprove">
                <?= $escaper->escapeHtml(__('This comment will become public after administrator approval.')); ?>
            </div>
        <?php endif; ?>
        <?php if (!$block->getNeedApproveMessage()): ?>
            <div class="amblog-thesis">
                <?= $escaper->escapeHtml($block->getContent()); ?>
            </div>
            <div class="amblog-reply">
                <a data-id="<?= $escaper->escapeHtmlAttr($block->getMessageId()); ?>"
                   class="amblog-button"
                   title="<?= $escaper->escapeHtmlAttr(__('Reply')); ?>"
                   aria-label="<?= $escaper->escapeHtmlAttr(__('Reply')); ?>"
                   data-amblog-js="reply-to"
                   href="#am-comment-form-<?= $escaper->escapeHtmlAttr($block->getMessageId()); ?>" >
                    <svg class="amblog-icon" width="12" height="8" fill="none">
                        <use xlink:href="<?= $escaper->escapeUrl($svgLink); ?>#reply"></use>
                    </svg>
                    <?= $escaper->escapeHtml(__('Reply')); ?>
                </a>
                <button class="amblog-button -toggle -clear"
                        title="<?= $escaper->escapeHtmlAttr(__('Show replies')); ?>"
                        aria-label="<?= $escaper->escapeHtmlAttr(__('Show replies')); ?>"
                        data-id="<?= $escaper->escapeHtmlAttr($block->getMessageId()); ?>"
                        data-amblog-js="toggle-replies">
                    <svg class="amblog-icon" width="9" height="5" fill="none">
                        <use xlink:href="<?= $escaper->escapeUrl($svgLink); ?>#comment"></use>
                    </svg>
                    <span class="amblog-count" data-amblog-js="comments-count"></span>
                </button>
            </div>
        <?php endif; ?>
    </div>
    <div class="amblog-replies-block <?= /** @noEscape */ $levelTopClass ?>"
        data-amblog-js="replies-block">
        <div class="amblog-comment-reply"
             id="am-comment-form-<?= $escaper->escapeHtmlAttr($block->getMessageId()); ?>"
             style="display: none;">
        </div>
        <div class="amblog-replies"
             data-amblog-js="replies"
             data-reply-id="<?= $escaper->escapeHtmlAttr($block->getMessageId()); ?>"><?= $block->getRepliesHtml(); ?>
        </div>
    </div>
</div>
