<?php
declare(strict_types=1);

/**
 * @var \Magento\Framework\View\Element\Template $block
 * @var \Magento\Framework\Escaper $escaper
 * @var \ClawRock\Debug\Model\View\Profiler $viewModel
 * @var \ClawRock\Debug\Model\Collector\TranslationCollector $collector
 */
$viewModel = $block->getViewModel();
$collector = $block->getCollector();
?>
<h2><?= $escaper->escapeHtml(__('Translation Metrics')) ?></h2>
<div class="metrics">
    <div class="metric">
        <span class="value"><?= count($collector->getDefinedTranslations()); ?></span>
        <span class="label"><?= $escaper->escapeHtml(__('Defined translations')) ?></span>
    </div>
    <div class="metric">
        <span class="value"><?= count($collector->getMissingTranslations()); ?></span>
        <span class="label"><?= $escaper->escapeHtml(__('Missing translations')) ?></span>
    </div>
</div>

<h2><?= $escaper->escapeHtml(__('Translation Messages')) ?></h2>
<div class="sf-tabs">
    <div class="tab">
        <h3 class="tab-title">
            <?= $escaper->escapeHtml(__('Defined')) ?>
            <span class="badge"><?= count($collector->getDefinedTranslations()) ?></span>
        </h3>
        <div class="tab-content">
            <p class="help">
                <?= $escaper->escapeHtml(__('These messages are correctly translated into the given locale.')) ?>
            </p>
            <?php if (!count($collector->getDefinedTranslations())): ?>
                <div class="empty">
                    <p>
                        <?= $escaper->escapeHtml(
                            __('None of the used translation messages are defined for the given locale.')
                        ) ?>
                    </p>
                </div>
            <?php else: ?>
                <?= /* @noEscape */ $viewModel->renderTable($collector->getDefinedTranslations(), [
                    'Phrase',
                    'Translation',
                ]); ?>
            <?php endif ?>
        </div>
    </div>
    <div class="tab">
        <h3 class="tab-title">
            <?= $escaper->escapeHtml(__('Missing')) ?>
            <span class="badge"><?= count($collector->getMissingTranslations()); ?></span>
        </h3>
        <div class="tab-content">
            <p class="help">
                <?= $escaper->escapeHtml(__('These messages aren\'t translated into the given locale.')) ?>
            </p>
            <?php if (!count($collector->getMissingTranslations())): ?>
                <div class="empty">
                    <p><?= $escaper->escapeHtml(__('There are no messages of this category.')) ?></p>
                </div>
            <?php else: ?>
                <table>
                    <thead>
                        <tr>
                            <th scope="col"><?= $escaper->escapeHtml(__('Phrase')) ?></th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php foreach ($collector->getMissingTranslations() as $translation): ?>
                            <tr>
                                <td><?= /* @noEscape */$translation; ?></td>
                            </tr>
                        <?php endforeach;?>
                    </tbody>
                </table>
            <?php endif ?>
        </div>
    </div>
</div>
<style>
    tr.sf-toggle-content.sf-toggle-visible {
        display: table-row !important;
    }
</style>
