<script setup lang="ts">
import MainLayout from "@/Layouts/MainLayout.vue";
import { Head } from '@inertiajs/vue3';
import {Flight, User} from "@/Types/types";
import ProfileViewSwitcher from "@/Components/FlightsGoneBy/ProfileViewSwitcher.vue";
import ProfileLayout from "@/Components/FlightsGoneBy/ProfileLayout.vue";
import FlightMapAndCharts from "@/Components/FlightsGoneBy/FlightMapAndCharts.vue";

defineOptions({
    layout: MainLayout
})

defineProps<{
    user: User
    flights: Flight[]
    canEdit: boolean
}>()
</script>

<template>
    <Head :title="`${user.name}'s Flights`" />
    <ProfileLayout :flights="flights" :user="user">
        <ProfileViewSwitcher active-view="map" :user="user" />
        <FlightMapAndCharts :flights="flights" :canEdit="canEdit" />
    </ProfileLayout>
</template>

<style scoped>

</style>
