Display product thumbnail in existing product column in WooCommerce quick order preview window

Question

I'm trying to display WooCommerce product thumbnail to WooCommerce Quick order window, I tried using 'woocommerce_admin_order_preview_end' and 'woocommerce_admin_order_preview_get_order_details' in the below code but nothing changed, Can anyone point me in the right direction? thanks!

My Attempted codes

add_filter( 'woocommerce_admin_order_preview_end', 'display_product_image_in_order_item', 20, 3 );
function display_product_image_in_order_item( $item_name, $item, $is_visible ) {
    // Targeting view order pages only
    if( is_wc_endpoint_url( 'view-order' ) ) {
        $product   = $item->get_product();
        $thumbnail = $product->get_image(array( 60, 120));
        if( $product->get_image_id() > 0 )
            $item_name = '<div class="item-thumbnail">' . $thumbnail . '</div>' . $item_name;
    }
    return $item_name;
}

add_filter( 'woocommerce_admin_order_preview_get_order_details', 'display_product_image_in_order_item', 20, 3 );
function display_product_image_in_order_item( $item_name, $item, $is_visible ) {
    // Targeting view order pages only
    if( is_wc_endpoint_url( 'view-order' ) ) {
        $product   = $item->get_product();
        $thumbnail = $product->get_image(array( 60, 120));
        if( $product->get_image_id() > 0 )
            $item_name = '<div class="item-thumbnail">' . $thumbnail . '</div>' . $item_name;
    }
    return $item_name;
}

Answer 1

Via woocommerce_admin_order_preview_line_item_columns filter hook, we have the option to remove the existing product column and add a new column, for order preview.

Via woocommerce_admin_order_preview_line_item_column_' . sanitize_key( $column ), ' filter hook, we will then rewrite the content of the product column, and add the product thumbnail.

So you get:

function filter_woocommerce_admin_order_preview_line_item_columns( $columns, $order ) {
    $new_product = $columns['product'];
    unset($columns['product']);

    return array_merge( array( 'new_product' => $new_product ), $columns );
}
add_filter( 'woocommerce_admin_order_preview_line_item_columns', 'filter_woocommerce_admin_order_preview_line_item_columns', 10, 2 );

function filter_woocommerce_admin_order_preview_line_item_column_new_product( $html, $item, $item_id, $order ) {
    $hidden_order_itemmeta = apply_filters(
        'woocommerce_hidden_order_itemmeta',
        array(
            '_qty',
            '_tax_class',
            '_product_id',
            '_variation_id',
            '_line_subtotal',
            '_line_subtotal_tax',
            '_line_total',
            '_line_tax',
            'method_id',
            'cost',
            '_reduced_stock',
            '_restock_refunded_items',
        )
    );
    
    $product_object = is_callable( array( $item, 'get_product' ) ) ? $item->get_product() : null;
    
    $thumbnail = $product_object->get_image( array( 60, 60 ) );
    
    // Add thumbnail
    if ( $product_object->get_image_id() > 0 ) {
        $html .= '<div class="item-thumbnail">' . $thumbnail . '</div>';
    }
    
    $html .= wp_kses_post( $item->get_name() );

    if ( $product_object ) {
        $html .= '<div class="wc-order-item-sku">' . esc_html( $product_object->get_sku() ) . '</div>';
    }

    $meta_data = $item->get_formatted_meta_data( '' );

    if ( $meta_data ) {
        $html .= '<table cellspacing="0" class="wc-order-item-meta">';

        foreach ( $meta_data as $meta_id => $meta ) {
            if ( in_array( $meta->key, $hidden_order_itemmeta, true ) ) {
                continue;
            }
            $html .= '<tr><th>' . wp_kses_post( $meta->display_key ) . ':</th><td>' . wp_kses_post( force_balance_tags( $meta->display_value ) ) . '</td></tr>';
        }
        $html .= '</table>';
    }
  
    return $html;
}
add_filter( 'woocommerce_admin_order_preview_line_item_column_new_product', 'filter_woocommerce_admin_order_preview_line_item_column_new_product', 10, 4 );