CartId Missing When Reloading Customer Data Section in Alpine JS Hyva theme

I Hope My Question will not be marked as Irrevlant as Hyva is grown highly in market

in My Custom Component, I want to add a Product to the cart
so I created a graphl request to create an empty cart and save cartId in data.cart.cartId
It works fine but i add the product to the cart and reload customer data to refresh the cart the cartId gets Empty Is there any way that I can refresh cart without empty cartId
or is there any way to refresh only cart section

receiveCustomerData: function receiveCustomerData(data){
    if (data.cart) {
        this.cart = data.cart;
    }
    if (data.customer) {
        this.customer = data.customer;
    }
},


getcartid() {
    fetch('<?= $escaper->escapeUrl($block->getBaseUrl()) ?>graphql', {
        headers: {
            'Content-Type': 'application/json',
            'X-Requested-With': 'XMLHttpRequest'
        },
        body: JSON.stringify({
            query: <?= /** @noEscape */ json_encode($fittingViewModel->getCartIdQuery()) ?>,
            operationName : "myCartIdQuery",
        }),
        method: "POST",
        mode: "cors",
        credentials: "include",
    }).then((response) =>  response.json())
        .then((data) => {
            this.isLoading = false;
            this.cart.cartId = data.data.createEmptyCart;
        })
        .finally(() => {
            this.loading = false;
        });
},


addFittingToCart(sku) {
    this.isLoading = true;
    let cartItems = [];
    cartItems.push({
        quantity : 1,
        sku : sku
    });
    fetch('<?= $escaper->escapeUrl($block->getBaseUrl()) ?>graphql', {
        headers: {
            'Content-Type': 'application/json',
            'X-Requested-With': 'XMLHttpRequest'
        },
        body: JSON.stringify({
            query: <?= /** @noEscape */ json_encode($ViewModel->getAddToCartMutation()) ?>,
            operationName : "addFittingProductToCart",
            variables: {
                cartId: this.cart.cartId,
                cartItems: cartItems
            }
        }),
        method: "POST",
        mode: "cors",
        credentials: "include",
        timeout: 3000,
    }).then((response) =>  response.json())
        .then((data) => {
            this.isLoading = false;
            var reloadCustomerDataEvent = new CustomEvent("reload-customer-section-data");
            window.dispatchEvent(reloadCustomerDataEvent);
        })
        .finally(() => {
            this.loading = false;
        });

Need Help if anyone have idea of it (edited)