<?php
add_action('wp_ajax_nopriv_posts_ajax', 'posts_ajax');
add_action('wp_ajax_posts_ajax', 'posts_ajax');

function posts_ajax() {

    $category = $_POST['category'];
    $page = (isset($_POST['postPage'])) ? $_POST['postPage'] : 0;

    $args = array(
        'post_type' => 'post',
        'orderby' => 'date',
        'post_status' =>'publish',
        'order' => 'DESC',
        'posts_per_page' => get_option( 'posts_per_page' ),
        'paged'    => $page,
        'category_name' =>  $category
    );

    $the_query = new WP_Query($args);
    ?>
    <?php if ($the_query->max_num_pages == 1 || $page >= $the_query->max_num_pages) : ?>
        <style>
            .blog-posts__loadmore {
                display: none;
            }
        </style>
    <?php else: ?>
        <style>
            .blog-posts__loadmore {
                display: flex;
            }
        </style>
    <?php endif; ?>

    <?php if ($the_query->have_posts()) : ?>
        <?php while ($the_query->have_posts()) : $the_query->the_post(); ?>
            <article class="blog-posts__items-wrap">
                <div class="blog-posts__item">
                    <a class="blog-posts__link" href="<?php the_permalink(); ?>" ></a>
                    <div class="blog-posts__left">
                        <div class="blog-posts__image-wrap">
                            <div class="blog-posts__image">
                                <div class="inner"
                                     style="background-image: url(<?php echo get_the_post_thumbnail_url(get_the_ID(), 'post-img'); ?>)"></div>
                            </div>
                            <div class="round">
                                <svg width="22" height="12" viewBox="0 0 22 12" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M21.5303 6.53033C21.8232 6.23744 21.8232 5.76256 21.5303 5.46967L16.7574 0.696699C16.4645 0.403806 15.9896 0.403806 15.6967 0.696699C15.4038 0.989593 15.4038 1.46447 15.6967 1.75736L19.9393 6L15.6967 10.2426C15.4038 10.5355 15.4038 11.0104 15.6967 11.3033C15.9896 11.5962 16.4645 11.5962 16.7574 11.3033L21.5303 6.53033ZM0 6.75L21 6.75V5.25L0 5.25L0 6.75Z" fill="white"/>
                                </svg>
                            </div>
                        </div>

                        <div class="blog-posts__date">
                            <span class="number"><?php echo get_the_date("d"); ?></span>
                            <span><?php echo get_the_date("F"); ?></span>
                            <span><?php echo get_the_date("Y"); ?></span>
                        </div>
                    </div>

                    <div class="blog-posts__right">
                        <div class="blog-posts__category"><?php the_category(', ')?></div>
                        <h3 class="blog-posts__title"><?php the_title(); ?></h3>
                        <div class="blog-posts__excerpt"><?php echo wp_trim_words(get_the_excerpt(), 40, '...');?></div>
                    </div>
                </div>
            </article>
        <?php endwhile; ?>
        <?php wp_reset_postdata(); ?>
    <?php endif; ?>

    <?php

    die();
}