Undefined passing data from laravel9 to vuejs 3

I have an issue when im trying to pass cartContent to vuejs I made a function in index.js like this

import axios from "axios";
import{ref} from 'vue';
export default function useProduct(){
    
    const products=ref([]);

    const getProducts = async() => {
        let response=await axios.get('/api/products');
        products.value = response.data.cartContent;

    }

    const add = async(productId)=>{
        let response = await axios.post('/api/products',{  
            productId: productId
            
    });
    return response.data.count;
    }

        const getCount = async() =>{

            let response = await axios.get('/api/products/count');

            return response.data.count;
        }
        



    return {
        add,
        getCount,
        getProducts,
    }
    
}

and in my componenet i have on my script

<script setup>
import { onMounted } from 'vue';
import useProduct from '../composables/products/index';

const{getProducts,products}=useProduct()

onMounted(async(products)=>{
    await getProducts(products);
     console.log(products)
})
</script>

im my template I passed data like this

<template v-for="product in products" v-bind:key="product.id">
           <tr>
						<p class="mb-2 md:ml-4" v-text="product.name"></p>
			</tr>
</template>

when I added console.log in my component I get Undefined and don't know why