review-card.php
167 lines
| 1 | <?php |
| 2 | /** |
| 3 | * Tutor learning area review card. |
| 4 | * |
| 5 | * @package Tutor\Templates |
| 6 | * @author Themeum <support@themeum.com> |
| 7 | * @link https://themeum.com |
| 8 | * @since 4.0.0 |
| 9 | */ |
| 10 | |
| 11 | defined( 'ABSPATH' ) || exit; |
| 12 | |
| 13 | use TUTOR\Icon; |
| 14 | use Tutor\Components\Avatar; |
| 15 | use Tutor\Components\Badge; |
| 16 | use Tutor\Components\Button; |
| 17 | use Tutor\Components\Constants\Size; |
| 18 | use Tutor\Components\Constants\Variant; |
| 19 | use Tutor\Components\InputField; |
| 20 | use Tutor\Components\StarRating; |
| 21 | use Tutor\Components\StarRatingInput; |
| 22 | use Tutor\Components\SvgIcon; |
| 23 | |
| 24 | // Get global variables. |
| 25 | global $current_user_id; |
| 26 | |
| 27 | $form_id = "review-form-{$review->comment_ID}"; |
| 28 | $delete_modal_id = 'review-delete-modal'; |
| 29 | $review->comment_content = wp_kses_post( htmlspecialchars( stripslashes( $review->comment_content ?? '' ) ) ); |
| 30 | |
| 31 | ?> |
| 32 | <div x-data="tutorReviewCard('<?php echo esc_attr( $review->comment_ID ); ?>')" class="tutor-border-t tutor-p-6"> |
| 33 | <div x-show="!isEditMode"> |
| 34 | <div class="tutor-flex tutor-items-center tutor-justify-between"> |
| 35 | <div class="tutor-flex tutor-items-center tutor-gap-4"> |
| 36 | <?php Avatar::make()->user( (int) $review->user_id )->size( Size::SIZE_40 )->render(); ?> |
| 37 | <div class="tutor-flex tutor-flex-column"> |
| 38 | <div class="tutor-flex tutor-items-center tutor-gap-5"> |
| 39 | <div class="tutor-small"><?php echo esc_html( $review->display_name ?? '' ); ?></div> |
| 40 | <?php |
| 41 | if ( $current_user_id === (int) $review->user_id ) { |
| 42 | Badge::make()->label( __( 'Your Review', 'tutor' ) )->variant( Badge::INFO )->render(); |
| 43 | } |
| 44 | ?> |
| 45 | </div> |
| 46 | <div class="tutor-small tutor-text-subdued"> |
| 47 | <?php |
| 48 | /* translators: %s human-readable time difference. */ |
| 49 | echo esc_html( sprintf( __( '%s ago', 'tutor' ), human_time_diff( strtotime( $review->comment_date_gmt ) ) ) ); |
| 50 | ?> |
| 51 | </div> |
| 52 | </div> |
| 53 | </div> |
| 54 | |
| 55 | <div class="tutor-flex tutor-items-center tutor-gap-5"> |
| 56 | <?php |
| 57 | StarRating::make()->rating( (float) ( $review->rating ?? 0 ) )->render(); |
| 58 | |
| 59 | // Show pending badge for on hold reviews. |
| 60 | if ( 'hold' === $review->comment_status ) { |
| 61 | Badge::make()->label( __( 'Pending', 'tutor' ) )->variant( Badge::WARNING )->render(); |
| 62 | } |
| 63 | ?> |
| 64 | </div> |
| 65 | </div> |
| 66 | |
| 67 | <div class="tutor-p1 tutor-text-secondary tutor-mt-6"> |
| 68 | <?php echo esc_textarea( html_entity_decode( $review->comment_content ?? '' ) ); ?> |
| 69 | </div> |
| 70 | |
| 71 | <?php if ( $current_user_id === (int) $review->user_id ) : ?> |
| 72 | <div class="tutor-flex tutor-items-center tutor-gap-4 tutor-mt-6"> |
| 73 | <?php |
| 74 | Button::make() |
| 75 | ->variant( Variant::OUTLINE ) |
| 76 | ->size( Size::SMALL ) |
| 77 | ->label( __( 'Edit Review', 'tutor' ) ) |
| 78 | ->icon( Icon::EDIT_2 ) |
| 79 | ->attr( 'x-ref', 'edit' ) |
| 80 | ->render(); |
| 81 | |
| 82 | Button::make() |
| 83 | ->label( __( 'Delete Review', 'tutor' ) ) |
| 84 | ->variant( Variant::OUTLINE ) |
| 85 | ->size( Size::SMALL ) |
| 86 | ->icon( Icon::DELETE_2 ) |
| 87 | ->icon_only() |
| 88 | ->attr( 'onclick', 'TutorCore.modal.showModal(' . wp_json_encode( $delete_modal_id ) . ', { id: ' . esc_js( $review->comment_ID ) . ' })' ) |
| 89 | ->icon_only() |
| 90 | ->render(); |
| 91 | ?> |
| 92 | </div> |
| 93 | <?php endif; ?> |
| 94 | </div> |
| 95 | |
| 96 | <?php if ( $current_user_id === (int) $review->user_id ) : ?> |
| 97 | <div x-show="isEditMode" x-cloak class="tutor-flex tutor-flex-column tutor-gap-6"> |
| 98 | <form |
| 99 | class="tutor-flex tutor-flex-column tutor-gap-6" |
| 100 | id="<?php echo esc_attr( $form_id ); ?>" |
| 101 | x-data='tutorForm({ |
| 102 | id: "<?php echo esc_attr( $form_id ); ?>", |
| 103 | mode: "onChange", |
| 104 | defaultValues: <?php echo wp_json_encode( $review ); ?>, |
| 105 | })' |
| 106 | x-bind="getFormBindings()" |
| 107 | @submit.prevent="handleSubmit( |
| 108 | (data) => handleReviewSubmit(data), |
| 109 | )($event)" |
| 110 | > |
| 111 | <?php |
| 112 | StarRatingInput::make() |
| 113 | ->field_name( 'rating' ) |
| 114 | ->current_rating( $review->rating ?? 0 ) |
| 115 | ->render(); |
| 116 | ?> |
| 117 | |
| 118 | <?php |
| 119 | InputField::make() |
| 120 | ->type( 'textarea' ) |
| 121 | ->name( 'comment_content' ) |
| 122 | ->required() |
| 123 | ->clearable() |
| 124 | ->attr( 'x-bind', "register('comment_content', { required: '" . esc_js( __( 'Review content is required', 'tutor' ) ) . "' })" ) |
| 125 | ->attr( '@keydown.meta.enter.prevent', 'handleSubmit((data) => handleReviewSubmit(data))' ) |
| 126 | ->attr( '@keydown.ctrl.enter.prevent', 'handleSubmit((data) => handleReviewSubmit(data))' ) |
| 127 | ->render(); |
| 128 | ?> |
| 129 | </form> |
| 130 | <div class="tutor-flex tutor-justify-between tutor-gap-3 tutor-sm-justify-end"> |
| 131 | <div class="tutor-flex tutor-gap-3 tutor-tiny tutor-text-subdued tutor-items-center tutor-flex-wrap tutor-sm-hidden"> |
| 132 | <span> |
| 133 | <?php SvgIcon::make()->name( Icon::COMMAND )->size( 12 )->render(); ?> |
| 134 | </span> |
| 135 | <?php esc_html_e( 'Cmd/Ctrl +', 'tutor' ); ?> |
| 136 | <span> |
| 137 | <?php SvgIcon::make()->name( Icon::ENTER )->size( 12 )->render(); ?> |
| 138 | </span> |
| 139 | <?php esc_html_e( 'Enter to Save', 'tutor' ); ?> |
| 140 | </div> |
| 141 | <div class="tutor-flex tutor-gap-3"> |
| 142 | <?php |
| 143 | Button::make() |
| 144 | ->label( __( 'Cancel', 'tutor' ) ) |
| 145 | ->variant( Variant::GHOST ) |
| 146 | ->size( Size::X_SMALL ) |
| 147 | ->attr( 'x-ref', 'cancel' ) |
| 148 | ->attr( 'type', 'button' ) |
| 149 | ->render(); |
| 150 | ?> |
| 151 | <?php |
| 152 | Button::make() |
| 153 | ->label( __( 'Save and Continue', 'tutor' ) ) |
| 154 | ->variant( Variant::PRIMARY_SOFT ) |
| 155 | ->size( Size::X_SMALL ) |
| 156 | ->attr( 'type', 'submit' ) |
| 157 | ->attr( 'form', $form_id ) |
| 158 | ->attr( ':class', '{ \'tutor-btn-loading\': saveRatingMutation.isPending }' ) |
| 159 | ->attr( ':disabled', 'saveRatingMutation.isPending' ) |
| 160 | ->render(); |
| 161 | ?> |
| 162 | </div> |
| 163 | </div> |
| 164 | </div> |
| 165 | <?php endif; ?> |
| 166 | </div> |
| 167 |