<?php

	if ( ! defined( 'ABSPATH' ) ) {
		exit;
	}

	$current_post_id = get_the_ID();

	/**
	 * Current post categories
	 */
	$categories   = get_the_category( $current_post_id );
	$category_ids = [];

	if ( ! empty( $categories ) ) {
		$category_ids = wp_list_pluck(
			$categories,
			'term_id'
		);
	}

	/**
	 * Base query args
	 */
	$query_args = [
		'post_type'      => 'post',
		'post_status'    => 'publish',
		'posts_per_page' => 5,
		'post__not_in'   => [ $current_post_id ],
		'orderby'        => 'rand',
	];

	/**
	 * If categories exist —
	 * prioritize same category posts
	 */
	if ( ! empty( $category_ids ) ) {
		$query_args['category__in'] = $category_ids;
	}

	$recommended_posts = get_posts( $query_args );

	/**
	 * If not enough posts found —
	 * fill with random posts
	 */
	if ( count( $recommended_posts ) < 5 ) {
		$existing_ids      = wp_list_pluck(
			$recommended_posts,
			'ID'
		);
		$existing_ids[]    = $current_post_id;
		$additional_posts  = get_posts(
			[
				'post_type'      => 'post',
				'post_status'    => 'publish',
				'posts_per_page' => 5 - count( $recommended_posts ),
				'post__not_in'   => $existing_ids,
				'orderby'        => 'rand',
			]
		);
		$recommended_posts = array_merge(
			$recommended_posts,
			$additional_posts
		);
	}

?>
<?php if ( ! empty( $recommended_posts ) ) : ?>
	<section
		class="g-565e4322"
		aria-labelledby="recommended-posts-title"
		data-analytics-e2e="a47d67d216" data-mui-selected="83a93485" data-mui-metric="99fdda" data-analytics-interval="40793d6" data-bs-wrap="0d1ab540"
	>
		<div class="g-63e2c1ff" id="elem-416b1a63eb969b05">
			<div class="g-9eb1d911" data-module-handler="041a08fad09" data-bs-disabled="d5219ee13e6">
				<h2
					id="recommended-posts-title"
					class="g-19103a36 g-4d7b4f87"
				>
				You may also like
				</h2>
			</div>
			<div class="g-b974b7d5" id="elem-9d9a91ddbf6c0d4a">
				<div class="swiper g-12469a56 g-4d976e7e" data-block-theme="auto" data-element-size="xs" data-analytics-toggle="modal">
					<div class="swiper-wrapper">
						<?php
							foreach ( $recommended_posts as $post ) :
								setup_postdata( $post );
								?>
								<div class="swiper-slide">
									<?php
										get_template_part(
											'templates/post-card',
											null,
										);
									?>
								</div>
							<?php
							endforeach;
							wp_reset_postdata();
						?>
					</div>
				</div>
				<div class="g-7f6b9303" data-section-type="tertiary" data-module-variant="contained" data-widget-action="focus" data-mui-cy="582a5da51" data-test-elevation="6d29d5e">
					<button
						class="g-9b89a5e7 g-82188105"
						type="button"
						aria-label="<?php esc_attr_e( 'Previous posts', 'theme' ); ?>"
					>
						<svg width="13" height="23" viewBox="0 0 13 23" fill="none" xmlns="http://www.w3.org/2000/svg">
							<path
								d="M12.1066 0.43934C11.5208 -0.146447 10.5713 -0.146447 9.98546 0.43934L0.439566 9.98524C-0.146221 10.571 -0.146221 11.5205 0.439566 12.1063L9.98546 21.6522C10.5713 22.238 11.5208 22.238 12.1066 21.6522C12.6923 21.0664 12.6923 20.1169 12.1066 19.5311L3.62121 11.0458L12.1066 2.56043C12.6923 1.97465 12.6923 1.02513 12.1066 0.43934Z"
								fill="currentColor"/>
						</svg>
					</button>
					<button
						class="g-9b89a5e7 g-bd183bfd"
						type="button"
						aria-label="<?php esc_attr_e( 'Next posts', 'theme' ); ?>"
					>
						<svg width="13" height="23" viewBox="0 0 13 23" fill="none" xmlns="http://www.w3.org/2000/svg">
							<path
								d="M0.43934 0.43934C1.02513 -0.146447 1.97465 -0.146447 2.56043 0.43934L12.1063 9.98524C12.6921 10.571 12.6921 11.5205 12.1063 12.1063L2.56043 21.6522C1.97465 22.238 1.02513 22.238 0.43934 21.6522C-0.146447 21.0664 -0.146447 20.1169 0.43934 19.5311L8.92469 11.0458L0.43934 2.56043C-0.146447 1.97465 -0.146447 1.02513 0.43934 0.43934Z"
								fill="currentColor"/>
						</svg>
					</button>
				</div>
			</div>
		</div>
	</section>
	<script>
        document.addEventListener('DOMContentLoaded', () => {

            const sliderWrapper = document.querySelector(
                '.g-b974b7d5'
            );

            const slider = document.querySelector(
                '.g-12469a56'
            );

            if (!slider) {
                return;
            }

            new Swiper(slider, {
                loop: true,
                speed: 700,
                slidesPerView: 3,
                spaceBetween: 24,
                grabCursor: true,
                navigation: {
                    nextEl: sliderWrapper.querySelector(
                        '.g-bd183bfd'
                    ),
                    prevEl: sliderWrapper.querySelector(
                        '.g-82188105'
                    ),
                },
                breakpoints: {
                    1024: {
                        slidesPerView: 3,
                        spaceBetween: 24,
                    },
                    768: {
                        slidesPerView: 2.3,
                        spaceBetween: 16,
                    },
                    0: {
                        slidesPerView: 1.3,
                        spaceBetween: 16,
                    },
                },
            });
        });
	</script>
<?php endif; ?>