<script setup lang="ts">
import { computed } from 'vue'
import { Achievement, Flight, User } from '@/Types/types'
import { useAircraftFamilies } from '@/Composables/useAircraftFamilies'
import Panel from '@/Components/FlightsGoneBy/Panels/Panel.vue'
import PanelHeader from '@/Components/FlightsGoneBy/Panels/PanelHeader.vue'
import PanelSubHeader from '@/Components/FlightsGoneBy/Panels/PanelSubHeader.vue'
import BadgeTable from '@/Components/FlightsGoneBy/GenericBadgeTable.vue'
import FlightBadge from '@/Components/FlightsGoneBy/FlightBadge.vue'
defineOptions({ inheritAttrs: false })
const props = defineProps<{
    achievement: Achievement
    user: User
    followStatus: string
    flights: Flight[]
    families: Record<string, string[]>
}>()

const flights = computed(() => props.flights)
const { entries, completedCount, totalCount } = useAircraftFamilies(flights, props.families)
</script>

<template>

    <Panel>
        <div class="table-toolbar">
            <PanelHeader>Families</PanelHeader>
        </div>

        <BadgeTable
            :rows="entries"
            :rowKey="entry => entry.family"
            :hasItems="entry => entry.flights.length > 0"
            labelWidth="8em"
        >
            <template #label="{ row: entry }">
                <div class="family-label">
                    <span class="family-name">Boeing {{ entry.family }}</span>
                </div>
            </template>

            <template #items="{ row: entry }">
                <FlightBadge
                    v-for="flight in entry.flights"
                    :key="flight.id"
                    :title="`${flight.departure_airport?.iata_code} → ${flight.arrival_airport?.iata_code}`"
                    :flight="flight"
                />
            </template>
        </BadgeTable>
    </Panel>

    <slot name="extra" />

    <Panel>
        <PanelHeader centered>Requirements</PanelHeader>
        <p>
            To complete this challenge you must fly on at least one aircraft from every
            Boeing 7x7 family — the 707, 717, 727, 737, 747, 757, 767, 777, and 787.
        </p>
        <p>
            Any variant within a family counts. For example, a Boeing 737-800 (B738) and
            a Boeing 737 MAX 8 (B38M) both satisfy the 737 family requirement.
        </p>
    </Panel>
    <Panel>
        <PanelHeader centered>Difficulty</PanelHeader>
        <p>
            If you are starting this challenge today, then this challenge is impossible to complete and will not count towards your achievement total. If you have historically completed it, it will.
        </p>
        <p>
            Difficult types to fly on
        </p>
        <ul>
            <li><b>Boeing 707</b> - Completely impossible to fly today. The US Military still operates some derivatives, but they do not count towards this challenge</li>
            <li><b>Boeing 727</b> - No commercial service. One operates as a vomit comet in the USA. Very expensive, but technically possible to fly on</li>
            <li><b>Boeing 717</b> - Still in service, mostly in the US, but being withdrawn rapidly.</li>
            <li><b>Boeing 747</b> - Being pulled from service rapidly. Almost no 747-400s left in service (just Lufthansa). 747-8s are still active with Korean Air, Air China and Lufthansa but the US Air Force has acquired a large number from these airlines and they are dwindling</li>
            <li><b>Boeing 757</b> - Still fairly common in the USA but quickly going extinct elsewhere.</li>
        </ul>
    </Panel>
</template>

<style scoped>

.family-name {
    font-size: 0.9rem;
    font-weight: 500;
}
</style>
