<?php
get_header();
global $post;
$post_id = get_the_ID();
$post_title = get_the_title($post_id);
$prompt_text = get_field('prompt_text', $post_id);
$featured_image = \Theme\Helpers::get_image(get_field('featured_image', $post_id), 'img-600-300');
$prompt_category = wp_get_post_terms($post_id, 'prompt-category');
$view_count = get_post_meta($post_id, 'view_count', true);
if (!$view_count) {
  $view_count = 0;
}
?>
<?php if (have_posts()): the_post(); ?>
  <div class="single-prompts-wrapper">
    <div class="container">
      <section class="single_prompts_page"
               data-section-class="single_prompts_page">
        <div class="container">
          <div class="prompt-wrapper iv-st-from-bottom">
            <?php if (!empty($prompt_category) && !is_wp_error($prompt_category)) {
              $first_category = $prompt_category[0];
              ?>
              <span class="cta-button active category-btn"><?= $first_category->name ?></span>
            <?php } ?>
            <h2 class="main-title"><?= $post_title ?></h2>
            <div class="icons-wrapper">
              <div class="icon-wrapper">
                <?php if (is_user_logged_in()) {
                  $user_id = get_current_user_id();
                  $favorites_users = get_post_meta($post_id, 'favorites_users', true);
                  $favorites_users = json_decode($favorites_users, true);
                  ?>
                  <button class="fav-icon favorite-button <?= isset($favorites_users[$user_id]) ? 'favorite' : '' ?>" aria-label="add to favorite" data-post-id="<?= $post_id ?>"
                          data-user-id="<?= $user_id ?>">
                    <svg viewBox="0 0 20 18">
                      <path
                        d="M19,5.7c0,3.4-3.1,6.2-7.7,10.4L10,17.3,8.7,16.1C4.1,11.9,1,9.1,1,5.7a5,5,0,0,1,5-5,5.3,5.3,0,0,1,4,1.9A5.3,5.3,0,0,1,14,.7,5,5,0,0,1,19,5.7Z"
                        fill="#FFFFFF" stroke="#a1a1aa" stroke-miterlimit="10"
                        stroke-width="1.5"/>
                    </svg>
                  </button>
                <?php } ?>
                <div class="like-icon">
                  <svg width="21" height="17" viewBox="0 0 21 17" fill="none"
                       xmlns="http://www.w3.org/2000/svg">
                    <path
                      d="M1 8.5C1 8.5 4.45455 1.5 10.5 1.5C16.5455 1.5 20 8.5 20 8.5C20 8.5 16.5455 15.5 10.5 15.5C4.45455 15.5 1 8.5 1 8.5Z"
                      stroke="#8690A2" stroke-width="1.5" stroke-linecap="round"
                      stroke-linejoin="round"/>
                    <path
                      d="M10.5 11.125C11.9309 11.125 13.0909 9.94975 13.0909 8.5C13.0909 7.05025 11.9309 5.875 10.5 5.875C9.06908 5.875 7.90909 7.05025 7.90909 8.5C7.90909 9.94975 9.06908 11.125 10.5 11.125Z"
                      stroke="#8690A2" stroke-width="1.5" stroke-linecap="round"
                      stroke-linejoin="round"/>
                  </svg>
                  <span><?= $view_count ?></span>
                </div>
              </div>

              <button class="cta-button active click-btn">
                <?= __('Copy prompt', 'webofai') ?>
              </button>
            </div>
            <?php if ($featured_image): ?>
              <div class="img-wrapper">
                <picture class="aspect-ratio">
                  <?= $featured_image ?>
                </picture>
              </div>
            <?php endif; ?>
            <?php if ($prompt_text): ?>
              <div class="prompt-text" id="text-to-copy">
                <?= $prompt_text ?>
              </div>
            <?php endif; ?>
          </div>
        </div>
      </section>
    </div>
  </div>
<?php endif; ?>
<?php
get_footer();