<script setup>
const route = useRoute();
const { data: cars, refresh } = await useFetchCars(route.params.city, {
    minPrice: route.query.minPrice,
    maxPrice: route.query.maxPrice,
    make: route.params.make,
});

watch(() => route.query, () => {
    refresh(); // doesn't work -> bug in nuxt
    window.location.reload(true) // fix
});
</script>

<template>
    <div>
        <CarCards :cars="cars" v-if="cars.length" />
        <div v-else>
            <h1 class="text-red-600">no cars found</h1>
        </div>

    </div>
</template>
