Display product thumbnails on WooCommerce My account subscription table - php

Question

I am trying to display product thumbnails on the WooCommerce My account > subscription table, beside the subscription ID.
I have added product name next to subscription ID via below code, in the same column. It works fine.
function custom_add_subscription_name_to_table( $subscription ) {
foreach ( $subscription->get_items() as $item_id => $item ) {
$_product = apply_filters( 'woocommerce_subscriptions_order_item_product', $subscription->get_product_from_item( $item ), $item );
if ( apply_filters( 'woocommerce_order_item_visible', true, $item ) ) {
echo wp_kses_post( apply_filters( 'woocommerce_order_item_name', sprintf( '%s', get_permalink( $item['product_id'] ), $item['name'] ), $item ) );
}
}
}
add_action( 'woocommerce_my_subscriptions_after_subscription_id', 'custom_add_subscription_name_to_table', 35 );
And I want to add a new column next to subscription ID column, and then display the product thumbnails in the new column. I referenced this
display-product-thumbnails-on-woocommerce-my-account-orders-list code. But All efforts fail.
add_filter( 'woocommerce_my_account_subscriptions_columns', 'filter_woocommerce_my_subscriptions_columns', 10, 1 );
function filter_woocommerce_my_subscriptions_columns( $columns ) {
$new_column = array( 'subscription_id' => $columns['subscription_id']);
unset($columns['subscription_id']);
$new_column['subscription-thumbnails'] = '';
return array_merge($new_column, $columns);
}
add_action( 'woocommerce_my_subscriptions_column_order-thumbnails', 'filter_woocommerce_my_subscriptions_column_order', 10, 1 );
function filter_woocommerce_my_subscriptions_column_order( $order ) {
// Loop through order items
foreach ( $subscription->get_items() as $item_id => $item ) {
$_product = apply_filters( 'woocommerce_subscriptions_order_item_product', $subscription->get_product_from_item( $item ), $item );
$thumbnail = $_product->get_image(array( 60, 60)); // Get the product thumbnail (from product object)
if( $_product->get_image_id() > 0 ) {
echo ' ' . $thumbnail;
}
}
}
Right now, i can only put the thumbnails next to the subscription ID, in the same column. the thumbnails in the subscription ID column.
But on mobile screen, the display is very unfriendly
add_action( 'woocommerce_my_subscriptions_after_subscription_id', 'custom_add_subscription_thumbnails_to_table', 35 );
function custom_add_subscription_thumbnails_to_table( $subscription ) {
// Loop through order items
foreach ( $subscription->get_items() as $item_id => $item ) {
$_product = apply_filters( 'woocommerce_subscriptions_order_item_product', $subscription->get_product_from_item( $item ), $item );
$thumbnail = $_product->get_image(array(80, 80)); // Get the product thumbnail (from product object)
if( $_product->get_image_id() > 0 ) {
echo ' ' . $thumbnail;
}
}
}