<?php
/**
 * Comments template
 * Place this file in your (child) theme root as comments.php
 */

if ( post_password_required() ) {
  return;
}

// Helpers (you can move these to functions.php if you prefer)
function museum_comment_callback($comment, $args, $depth) {
  $tag = ($args['style'] === 'div') ? 'div' : 'li';
  ?>
  <<?php echo $tag; ?> <?php comment_class('mb-3 border-bottom border-light-subtle pb-3'); ?> id="comment-<?php comment_ID(); ?>">
    <div id="div-comment-<?php comment_ID(); ?>" class="d-flex">
      <div class="me-3">
        <?php echo get_avatar( $comment, 56, '', '', ['class' => 'rounded-circle shadow-sm'] ); ?>
      </div>

      <div class="flex-grow-1">
        <div class="d-flex align-items-center gap-2 mb-1">
          <strong class="small"><?php comment_author_link(); ?></strong>
          <span class="text-muted small">•</span>
          <a href="<?php echo esc_url( get_comment_link( $comment->comment_ID ) ); ?>" class="text-muted small text-decoration-none">
            <?php printf( esc_html__( '%1$s در %2$s', 'textdomain' ), get_comment_date(), get_comment_time() ); ?>
          </a>
          <?php if ( $comment->comment_approved === '0' ) : ?>
            <span class="badge text-bg-warning-subtle border ms-auto"><?php esc_html_e( 'در انتظار تأیید', 'textdomain' ); ?></span>
          <?php endif; ?>
        </div>

        <div class="small mb-2">
          <?php comment_text(); ?>
        </div>

        <div class="d-flex gap-3 small">
          <?php
            comment_reply_link( array_merge( $args, [
              'reply_text' => esc_html__( 'پاسخ', 'textdomain' ),
              'depth'      => $depth,
              'max_depth'  => $args['max_depth'],
              'before'     => '<span>',
              'after'      => '</span>',
            ] ) );

            edit_comment_link( esc_html__( 'ویرایش', 'textdomain' ), '<span>', '</span>' );
          ?>
        </div>
      </div>
    </div>
  <?php
}

$comments_number = get_comments_number();
?>

<div id="comments" class="museum-label-box bg-white shadow-sm rounded-2 p-4 mt-5">

  <?php if ( $comments_number ) : ?>
    <h2 class="fs-6 fw-bold mb-3">
      <?php
        printf(
          /* translators: %s: number of comments */
          esc_html( _nx( 'یک دیدگاه', '%s دیدگاه', $comments_number, 'comments title', 'textdomain' ) ),
          number_format_i18n( $comments_number )
        );
      ?>
    </h2>

    <ol class="comment-list list-unstyled">
      <?php
        wp_list_comments( [
          'style'       => 'ol',
          'short_ping'  => true,
          'avatar_size' => 56,
          'callback'    => 'museum_comment_callback',
          'reply_text'  => esc_html__( 'پاسخ', 'textdomain' ),
        ] );
      ?>
    </ol>

    <?php if ( get_comment_pages_count() > 1 && get_option( 'page_comments' ) ) : ?>
      <nav class="comment-navigation my-3" aria-label="<?php esc_attr_e('Comment navigation','textdomain'); ?>">
        <ul class="pagination justify-content-center pagination-sm mb-0">
          <li class="page-item"><?php previous_comments_link( '<span class="page-link">&laquo; ' . esc_html__( 'قدیمی‌تر', 'textdomain' ) . '</span>' ); ?></li>
          <li class="page-item"><?php next_comments_link( '<span class="page-link">' . esc_html__( 'جدیدتر', 'textdomain' ) . ' &raquo;</span>' ); ?></li>
        </ul>
      </nav>
    <?php endif; ?>
  <?php endif; ?>

  <?php if ( comments_open() ) : ?>
    <div class="comment-respond mt-4">
      <?php
        $commenter = wp_get_current_commenter();
        $req       = get_option( 'require_name_email' );
        $aria_req  = $req ? " aria-required='true' required" : '';

        comment_form( [
          'class_form'         => 'comment-form',
          'class_submit'       => 'btn btn-dark rounded-2 shadow-sm',
          'title_reply'        => esc_html__( 'ارسال دیدگاه', 'textdomain' ),
          'title_reply_before' => '<h3 id="reply-title" class="fs-6 fw-bold mb-3">',
          'title_reply_after'  => '</h3>',

          'comment_field' => '<div class="mb-3">
            <label for="comment" class="form-label small">'. esc_html__( 'متن دیدگاه', 'textdomain' ) .'</label>
            <textarea id="comment" name="comment" class="form-control" rows="5" required></textarea>
          </div>',

          'fields' => [
            'author' => '<div class="mb-3">
              <label for="author" class="form-label small">'. esc_html__( 'نام', 'textdomain' ) . ($req ? ' *' : '') .'</label>
              <input id="author" name="author" type="text" class="form-control" value="'. esc_attr( $commenter['comment_author'] ) .'"'. $aria_req .' />
            </div>',
            'email'  => '<div class="mb-3">
              <label for="email" class="form-label small">'. esc_html__( 'ایمیل', 'textdomain' ) . ($req ? ' *' : '') .'</label>
              <input id="email" name="email" type="email" class="form-control" value="'. esc_attr(  $commenter['comment_author_email'] ) .'"'. $aria_req .' />
            </div>',
            'url'    => '<div class="mb-3">
              <label for="url" class="form-label small">'. esc_html__( 'وب‌سایت', 'textdomain' ) .'</label>
              <input id="url" name="url" type="url" class="form-control" value="'. esc_attr( $commenter['comment_author_url'] ) .'" />
            </div>',
          ],

          'submit_field' => '<div class="mt-2">%1$s %2$s</div>',
          'label_submit' => esc_html__( 'ثبت دیدگاه', 'textdomain' ),
          'comment_notes_before' => '',
          'comment_notes_after'  => '',
        ] );
      ?>
    </div>
  <?php elseif ( $comments_number ) : ?>
    <p class="text-muted small mt-3 mb-0"><?php esc_html_e( 'بخش دیدگاه‌ها بسته است.', 'textdomain' ); ?></p>
  <?php endif; ?>

</div>