minicart mixin doesn't read customerData

Question

i'm trying to create custom popup modal when click on "Go to checkout" button from Minicart.

i have write this code to open custom modal if the guest checkout is disabled, and redirect the customer to checkout if the customer is logged in.

this is my minicart mixin

define([
    'jquery',
    'Magento_Customer/js/model/authentication-popup',
    'Magento_Customer/js/customer-data'
], function ($, authenticationPopup, customerData) {
    'use strict';
    
    return function (Component) {
        return Component.extend({

            /**
             * @override
             */
            getCartParam: function (name) {
                var self = this;

               if (name === 'possible_onepage_checkout') {
                    $('#top-cart-btn-checkout').click(function (event) {
                        event.preventDefault();
                        var customer = customerData.get('customer');
                        if (!customer().firstname) {
                            $('.mobile-sendotp-popup').modal('openModal');
                            console.log("hello guest open poup");
                            return false;
                        } else {
                            console.log("hello customer checkout");
                            location.href = window.checkout.checkoutUrl;
                        }
                    });
               }
                return this._super(name);
            },
        });
    }
});

it's working fine when i'm browsing as guest, but when trying to go to checkout after logged in, then the button is not clickable at all and print this in log

                    hello guest open poup

so after lot of investigation i see that it doesn't read customerData at all!

kindly advise.