Featured tours working

resources/js/pages/Home.vue

@@ -1,9 +1,7 @@
 <template>
     <Hero />
-    <!-- About Section -->
     <About />
-    <!-- Featured Tours Section -->
-    <FeaturedTours />
+    <FeaturedTours :featured-tours="featured_tours" />
 </template>
 
 <style>
@@ -11,15 +9,21 @@
 </style>
 
 <script setup lang="ts">
-
-
-
 import { onMounted } from 'vue';
+import {usePage} from "@inertiajs/vue3";
+import {Tour} from "@/types";
+
+interface Properties {
+    featured_tours: Tour[]
+}
+
+const { featured_tours } = usePage().props as unknown as Properties
 
 import AppLayout from '../layouts/AppLayout.vue'
 import Hero from "@/components/home/Hero.vue";
 import About from "@/components/home/About.vue";
 import FeaturedTours from "@/components/home/FeaturedTours.vue";
+
 defineOptions({
     layout: AppLayout
 })