Save user flights

resources/js/Layouts/MainLayout.vue

@@ -1,11 +1,16 @@
 <script setup lang="ts">
-import {Link} from "@inertiajs/vue3";
 import MainHeader from "@/Components/FlightsGoneBy/MainHeader.vue";
 import MainFooter from "@/Components/FlightsGoneBy/MainFooter.vue";
 import Radar from "@/Components/FlightsGoneBy/Radar.vue";
-import { usePage } from "@inertiajs/vue3";
-const page = usePage();
+import { usePage, router } from "@inertiajs/vue3";
+import { ref } from "vue";
 
+const page = usePage();
+const transitionKey = ref(0);
+
+router.on('success', () => {
+    transitionKey.value++;
+});
 </script>
 
 <template>
@@ -13,8 +18,8 @@ const page = usePage();
         <div class="layoutContainer">
             <MainHeader />
             <Transition name="fade" mode="out-in">
-                <main id="pageContainer" :key="page.url" >
-                        <slot />
+                <main id="pageContainer" :key="transitionKey">
+                    <slot />
                 </main>
             </Transition>
             <MainFooter />