How can I add the icon corresponding to each payment method that is saved in a WooCommerce user's account?

Question

I am looking for the saved payment methods section, to include the icon of each of the cards that users use (Visa, Master card, Amex) how could I add this to WooCommerce?

Current payment method section:

enter image description here

Final idea:

enter image description here

Answer 1

add_action('woocommerce_account_payment_methods_column_method', 'woocommerce_account_payment_methods_column_data', 10, 1);

function woocommerce_account_payment_methods_column_data($method) {

    if (!empty($method['method']['brand'])) {
        $card = strtolower($method['method']['brand']);
        $card_url = "https://woocommerce.com/wp-content/plugins/woocommerce-payments/assets/images/cards/$card.svg";
    }
    if (!empty($method['method']['last4']) && isset($card_url)) {
        /* translators: 1: credit card type 2: last 4 digits */
        echo '<span><p style="float:left;margin-right:5px;"><img height="40px" width="40px;" src=' . $card_url . ' /></p><p  style="float:left">' . sprintf(esc_html__('%1$s ending in %2$s', 'woocommerce'), esc_html(wc_get_credit_card_type_label($method['method']['brand'])), esc_html($method['method']['last4'])) . "</p></span>";
    } else {
        echo esc_html(wc_get_credit_card_type_label($method['method']['brand']));
    }
}