<?php
/**
 * Template part for displaying posts in the blog archive.
 *
 * @package pawwell
 */

$categories       = get_the_category();
$primary_category = ! empty( $categories ) ? $categories[0] : null;
$category_slugs   = array();
if ( ! empty( $categories ) ) {
    foreach ( $categories as $cat ) {
        $category_slugs[] = $cat->slug;
    }
}
$reading_time   = pawwell_estimated_reading_time( get_the_content() );
$author_id      = get_the_author_meta( 'ID' );
$author_name    = get_the_author_meta( 'display_name' );
$author_initial = $author_name ? strtoupper( substr( $author_name, 0, 1 ) ) : 'P';
?>

<article class="blog-card" data-category="<?php echo esc_attr( implode( ',', $category_slugs ) ); ?>">
    <div class="blog-card-image">
        <?php if ( $primary_category ) : ?>
        <span class="blog-card-category"><?php echo esc_html( $primary_category->name ); ?></span>
        <?php endif; ?>
        <?php if ( has_post_thumbnail() ) : ?>
        <img class="blog-card-image-img" src="<?php echo esc_url( get_the_post_thumbnail_url( get_the_ID(), 'large' ) ); ?>" alt="<?php echo esc_attr( get_the_title() ); ?>" loading="lazy">
        <?php else : ?>
        <div class="blog-card-image-placeholder"></div>
        <?php endif; ?>
    </div>
    <div class="blog-card-body">
        <div class="blog-card-meta">
            <span class="blog-card-meta-item">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 9h18M8 3v4M16 3v4"/></svg>
                <?php echo esc_html( get_the_date() ); ?>
            </span>
            <span class="blog-card-meta-dot"></span>
            <span class="blog-card-meta-item">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg>
                <?php echo esc_html( $reading_time ); ?> <?php esc_html_e( 'min', 'pawwell' ); ?>
            </span>
        </div>
        <h3 class="blog-card-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
        <p class="blog-card-excerpt"><?php echo wp_trim_words( get_the_excerpt(), 18, '...' ); ?></p>
        <div class="blog-card-footer">
            <div class="blog-card-author">
                <?php echo get_avatar( $author_id, 32, '', $author_name, array( 'class' => 'blog-card-author-avatar' ) ); ?>
                <span class="blog-card-author-name"><?php echo esc_html( $author_name ); ?></span>
            </div>
            <a href="<?php the_permalink(); ?>" class="blog-card-read">
                <?php esc_html_e( 'Read', 'pawwell' ); ?>
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14m-6-6 6 6-6 6"/></svg>
            </a>
        </div>
    </div>
</article>
