Merge remote-tracking branch 'origin/main' into add-missing-airline-check

app/Http/Controllers/AdminController.php

@@ -19,6 +19,7 @@ class AdminController extends Controller
     function staticAdminData(){
         return [
             'missingLiveryCount' => $this->adminService->getMissingLiveries()->count(),
+            'missingAirlineCount' => $this->adminService->getMissingAirlines()->count(),
         ];
     }
 
@@ -44,6 +45,16 @@ class AdminController extends Controller
         ]);
     }
 
+    function reconcileMissingAirlines(){
+        $missingAirlines = $this->adminService->getMissingAirlines()->values();
+
+        return Inertia::render('Admin/MissingAirlines', [
+            'title' => $missingAirlines->count() . ' Missing Airlines',
+            'missingAirlines' => $missingAirlines,
+            ...$this->staticAdminData(),
+        ]);
+    }
+
     public function ignoreMissingLivery(Request $request)
     {
         $validated = $request->validate([

app/Services/AdminService.php

@@ -5,6 +5,7 @@ namespace App\Services;
 use App\DTOs\MissingLivery;
 use App\Models\IgnoredMissingLivery;
 use App\Models\UserFlight;
+use Illuminate\Support\Enumerable;
 use Illuminate\Support\Facades\Storage;
 use Illuminate\Support\Collection;
 
@@ -45,4 +46,36 @@ class AdminService
             ->sortBy('airline_name')
             ->values();
     }
+
+    function getMissingAirlines(): Enumerable|Collection
+    {
+        $flights = UserFlight::whereNotNull('flight_number')
+            ->whereNull('airline_id')
+            ->with('user:id,name') // adjust to your actual user relation/columns
+            ->get(['id', 'flight_number', 'user_id']);
+
+        return $flights
+            ->map(function ($flight) {
+                // Extract the 2-character IATA-style prefix (letters and/or digits)
+                preg_match('/^([A-Za-z0-9]{2})\d+/', trim($flight->flight_number), $matches);
+
+                return [
+                    'code' => $matches[1] ?? null,
+                    'flight_number' => $flight->flight_number,
+                    'link' => "/u/{$flight->user->name}/flight/{$flight->id}",
+                ];
+            })
+            ->filter(fn ($f) => $f['code'] !== null) // drop any that didn't match the pattern
+            ->groupBy('code')
+            ->map(function ($group, $code) {
+                return [
+                    'code' => $code,
+                    'flights' => $group->map(fn ($f) => [
+                        'flight_number' => $f['flight_number'],
+                        'link' => $f['link'],
+                    ])->values()->all(),
+                ];
+            })
+            ->values();
+    }
 }

app/Settings/SettingsRegistry.php

@@ -13,13 +13,24 @@ class SettingsRegistry
             'AI Generated Content'   => 'Airline tail logos and liveries are AI generated with human cleanup. If you would rather not see any AI, then our blank aircraft templates are human created.',
             'Account & Privacy'   => 'Everything to do with your account.',
             'Notifications'   => 'What you want to hear about (or not!)',
-            'Localization'   => 'Units of measurement, date and time preferences.',
         ];
     }
 
     public static function schema(): array
     {
         return [
+            [
+                'key'     => 'distance_unit',
+                'type'    => 'select',
+                'label'   => 'Distance Units',
+                'category' => 'FlightsGoneBy Settings',
+                'default' => 'km',
+                'options' => [
+                    ['value' => 'km', 'label' => 'Kilometres (km)'],
+                    ['value' => 'mi', 'label' => 'Miles (mi)'],
+                    ['value' => 'nm', 'label' => 'Nautical miles (nm)'],
+                ],
+            ],
             [
                 'category' => 'Account & Privacy',
                 'key'     => 'profile_privacy',
@@ -31,29 +42,6 @@ class SettingsRegistry
                     ['value' => 'private', 'label' => 'Private Profile Viewable Only By You and Your Approved Followers'],
                 ]
             ],
-            [
-                'key'     => 'distance_unit',
-                'type'    => 'select',
-                'label'   => 'Distance Units',
-                'category' => 'Localization',
-                'default' => 'km',
-                'options' => [
-                    ['value' => 'km', 'label' => 'Kilometres (km)'],
-                    ['value' => 'mi', 'label' => 'Miles (mi)'],
-                    ['value' => 'nm', 'label' => 'Nautical miles (nm)'],
-                ],
-            ],
-            [
-                'key'     => 'time_format',
-                'type'    => 'select',
-                'label'   => 'Time Format',
-                'category' => 'Localization',
-                'default' => 'ampm',
-                'options' => [
-                    ['value' => 'ampm', 'label' => 'AM/PM'],
-                    ['value' => '24hr', 'label' => '24-Hour'],
-                ],
-            ],
             [
                 'key'     => 'default_login_page',
                 'type'    => 'select',

resources/js/Components/Admin/MissingAirlineCard.vue

@@ -0,0 +1,91 @@
+<script setup lang="ts">
+import { MissingAirline } from "@/Types/types"
+
+defineProps<{
+    airline: MissingAirline
+}>()
+</script>
+
+<template>
+    <div class="missing-airline-card">
+        <div class="card-header">
+            <span class="airline-code">{{ airline.code }}</span>
+            <span class="flight-count">{{ airline.flights.length }} flight{{ airline.flights.length === 1 ? '' : 's' }}</span>
+        </div>
+
+        <ul class="flight-list">
+            <li v-for="flight in airline.flights" :key="flight.link" class="flight-item">
+                <a :href="flight.link" class="flight-link" target="_blank" rel="noopener">
+                    {{ flight.flight_number }}
+                </a>
+            </li>
+        </ul>
+    </div>
+</template>
+
+<style scoped>
+.missing-airline-card {
+    background: rgba(255, 255, 255, 0.03);
+    border: 1px solid rgba(255, 255, 255, 0.08);
+    border-radius: 8px;
+    padding: 1rem 1.25rem;
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+}
+
+.card-header {
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
+    padding-bottom: 0.5rem;
+}
+
+.airline-code {
+    font-family: 'Share Tech Mono', monospace;
+    font-size: 1.1rem;
+    letter-spacing: 0.08em;
+    color: #ffc107;
+    font-weight: 700;
+}
+
+.flight-count {
+    font-family: 'Share Tech Mono', monospace;
+    font-size: 0.68rem;
+    letter-spacing: 0.1em;
+    text-transform: uppercase;
+    color: #778;
+}
+
+.flight-list {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.5rem;
+    list-style: none;
+    padding: 0;
+    margin: 0;
+}
+
+.flight-item {
+    display: flex;
+}
+
+.flight-link {
+    font-family: 'Share Tech Mono', monospace;
+    font-size: 0.72rem;
+    letter-spacing: 0.06em;
+    color: #9fb3c8;
+    text-decoration: none;
+    background: rgba(255, 255, 255, 0.04);
+    border: 1px solid rgba(255, 255, 255, 0.06);
+    border-radius: 4px;
+    padding: 0.25rem 0.5rem;
+    transition: color 0.15s ease, border-color 0.15s ease;
+}
+
+.flight-link:hover {
+    color: #ffc107;
+    border-color: rgba(255, 193, 7, 0.4);
+}
+</style>

resources/js/Components/FlightsGoneBy/DepartureBoardTableRow.vue

@@ -12,7 +12,6 @@ import { usePage } from "@inertiajs/vue3";
 import { User } from "@/Types/types";
 import Mono from "@/Components/FlightsGoneBy/Mono.vue";
 import DayDifference from "@/Components/FlightsGoneBy/DayDifference.vue";
-import Time from "@/Components/FlightsGoneBy/Time.vue";
 
 const props = defineProps<{
     flight: Flight
@@ -99,12 +98,12 @@ const showColumn = (column: string) => props.columnsToShow.includes(column)
 
         <td v-if="showColumn('departure_time')" class="v-data-table__td">
             <span class="time-cell">
-                <Mono small><Time :value="flight.departure_time_display" /></Mono>
+                <Mono small>{{ flight.departure_time_display }}</Mono>
             </span>
         </td>
 
         <td v-if="showColumn('arrival_time')" class="v-data-table__td arrival-time-cell">
-            <Mono small><Time :value="flight.arrival_time_display" /></Mono>
+            <Mono small>{{ flight.arrival_time_display }}</Mono>
             <DayDifference :value="flight.arrival_day_difference" />
         </td>
 

resources/js/Components/FlightsGoneBy/Time.vue

@@ -1,42 +0,0 @@
-<script setup lang="ts">
-import {computed} from "vue";
-import {usePage} from "@inertiajs/vue3";
-import {SharedProps} from "@/Types/types";
-
-const props = defineProps<{
-    value: string; //Time in g:iA format
-}>()
-
-const page = usePage<SharedProps>().props;
-const timeFormatString = page.auth.user?.resolved_settings?.time_format
-
-const formattedTime = computed(() => {
-    if (timeFormatString !== "24hr") {
-        return props.value;
-    }
-
-    const match = props.value.match(/^(\d{1,2}):(\d{2})(AM|PM)$/i);
-    if (!match) {
-        return props.value;
-    }
-
-    let [, hourStr, minuteStr, meridiem] = match;
-    let hour = parseInt(hourStr, 10);
-
-    if (meridiem.toUpperCase() === "PM" && hour !== 12) {
-        hour += 12;
-    } else if (meridiem.toUpperCase() === "AM" && hour === 12) {
-        hour = 0;
-    }
-
-    return `${hour.toString().padStart(2, "0")}${minuteStr}`;
-});
-</script>
-
-<template>
-    <span>{{ formattedTime }}</span>
-</template>
-
-<style scoped>
-
-</style>

resources/js/Pages/AddFlight.vue

@@ -1,16 +1,16 @@
 <script setup lang="ts">
 import MainLayout from '@/Layouts/MainLayout.vue'
 import GlassBox from '@/Components/FlightsGoneBy/GlassBox.vue'
-import {Head, useForm, usePage} from '@inertiajs/vue3'
+import { Head, useForm } from '@inertiajs/vue3'
 import AirlineSearchBox from '@/Components/FlightsGoneBy/AirlineSearchBox.vue'
 import AircraftSearchBox from '@/Components/FlightsGoneBy/AircraftSearchBox.vue'
 import AirportSearchBox from '@/Components/FlightsGoneBy/AirportSearchBox.vue'
-import type {SeatType, FlightReason, FlightClass, CrewType, SharedProps} from '@/Types/types'
+import type {SeatType, FlightReason, FlightClass, CrewType} from '@/Types/types'
 import { ref, watch, computed } from 'vue'
 import { VTimePicker, VDatePicker } from 'vuetify/components'
 
 defineOptions({ layout: MainLayout })
-const page = usePage<SharedProps>().props
+
 
 const props = defineProps<{
     flight?: {
@@ -39,97 +39,6 @@ const props = defineProps<{
 
 const isEdit = !!props.flight
 
-// ── User format preferences ─────────────────────────────────────────────────
-const timeFormat = computed(() => page.auth?.user?.resolved_settings?.time_format ?? 'ampm')
-// day.js/date-fns-style tokens, e.g. 'D MMM YYYY' -> "7 Dec 2026". Not user-configurable yet.
-const dateFormat = computed(() => 'DD-MM-YYYY')
-
-// ── Date token formatting/parsing helpers (D, DD, M, MM, MMM, MMMM, YY, YYYY) ──
-
-const pad = (n: number) => String(n).padStart(2, '0')
-
-const MONTHS_SHORT = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec']
-const MONTHS_LONG  = ['January','February','March','April','May','June','July','August','September','October','November','December']
-
-// Formats a Date according to a token format string. Tokens matched longest-first
-// so e.g. "YYYY" isn't partially consumed by a lone "Y"-style rule.
-function formatDateForFormat(d: Date | null, format: string): string {
-    if (!d) return ''
-    return format.replace(/YYYY|YY|MMMM|MMM|MM|M|DD|D/g, (token) => {
-        switch (token) {
-            case 'YYYY': return String(d.getFullYear())
-            case 'YY':   return String(d.getFullYear()).slice(-2)
-            case 'MMMM': return MONTHS_LONG[d.getMonth()]
-            case 'MMM':  return MONTHS_SHORT[d.getMonth()]
-            case 'MM':   return pad(d.getMonth() + 1)
-            case 'M':    return String(d.getMonth() + 1)
-            case 'DD':   return pad(d.getDate())
-            case 'D':    return String(d.getDate())
-            default:     return token
-        }
-    })
-}
-
-// Extracts the ordered list of D/M/Y tokens from a format string, e.g.
-// "D MMM YYYY" -> ['D', 'MMM', 'YYYY']
-function getFormatTokens(format: string): string[] {
-    return format.match(/YYYY|YY|MMMM|MMM|MM|M|DD|D/g) ?? ['D', 'MMM', 'YYYY']
-}
-
-// Parses user-typed text into a Date, following the token order of `format`.
-// Splits on any run of non-alphanumeric characters, so "/", "-", ".", and
-// spaces are all accepted as separators regardless of what the format uses.
-// Month tokens (MMM/MMMM) match against month names case-insensitively.
-function parseDateInputStr(input: string, format: string): Date | null {
-    const trimmed = input.trim()
-    if (!trimmed) return null
-
-    const parts = trimmed.split(/[^a-zA-Z0-9]+/).filter(Boolean)
-    const tokens = getFormatTokens(format)
-    if (parts.length !== tokens.length) return null
-
-    let day: number | null = null
-    let month: number | null = null // 0-indexed
-    let year: number | null = null
-
-    for (let i = 0; i < tokens.length; i++) {
-        const token = tokens[i]
-        const part = parts[i]
-
-        if (token === 'D' || token === 'DD') {
-            const val = parseInt(part, 10)
-            if (isNaN(val)) return null
-            day = val
-        } else if (token === 'M' || token === 'MM') {
-            const val = parseInt(part, 10)
-            if (isNaN(val)) return null
-            month = val - 1
-        } else if (token === 'MMM' || token === 'MMMM') {
-            const lower = part.toLowerCase()
-            const idx = MONTHS_LONG.findIndex(m => m.toLowerCase().startsWith(lower) || lower.startsWith(m.slice(0, 3).toLowerCase()))
-            if (idx === -1) return null
-            month = idx
-        } else if (token === 'YYYY') {
-            const val = parseInt(part, 10)
-            if (isNaN(val)) return null
-            year = val
-        } else if (token === 'YY') {
-            const val = parseInt(part, 10)
-            if (isNaN(val)) return null
-            year = val < 100 ? 2000 + val : val
-        }
-    }
-
-    if (day === null || month === null || year === null) return null
-
-    const date = new Date(year, month, day)
-    // Reject dates that overflowed (e.g. day 31 in a 30-day month)
-    if (date.getFullYear() !== year || date.getMonth() !== month || date.getDate() !== day) {
-        return null
-    }
-    return date
-}
-
 // ── Flight number lookup ──────────────────────────────────────────────────────
 
 const flightNumber   = ref(props.flight?.flight_number ?? '')
@@ -300,6 +209,8 @@ const aircraftOptionsData = ref<{ value: number; title: string }[]>(props.flight
 // on. These refs + watchers just give the template two separate pickers while
 // keeping those combined strings in sync — no server-side changes needed.
 
+const pad = (n: number) => String(n).padStart(2, '0')
+
 function parseDateTime(dt: string | null | undefined) {
     if (!dt) return { date: null as Date | null, time: null as string | null }
     const d = new Date(dt)
@@ -316,6 +227,23 @@ function combineDateTime(date: Date | null, time: string | null): string {
     return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}T${(hh ?? '00').padStart(2, '0')}:${(mm ?? '00').padStart(2, '0')}`
 }
 
+const formatDateDisplay = (d: Date | null) =>
+    d ? d.toLocaleDateString(undefined, { year: 'numeric', month: 'short', day: 'numeric' }) : ''
+
+// Time is stored internally as a 24hr "HH:mm" string (VTimePicker's model
+// value is always 24hr regardless of the `format` display prop). This just
+// formats it for display in the read-only text fields.
+function formatTimeDisplay(t: string | null): string {
+    if (!t) return ''
+    const [hStr, mStr] = t.split(':')
+    let h = parseInt(hStr, 10)
+    if (isNaN(h)) return ''
+    const ampm = h >= 12 ? 'PM' : 'AM'
+    h = h % 12
+    if (h === 0) h = 12
+    return `${h}:${mStr} ${ampm}`
+}
+
 function clearDepartureDate() { departureDatePart.value = null }
 function clearDepartureTime() { departureTimePart.value = null }
 function clearArrivalDate()   { arrivalDatePart.value = null }
@@ -396,135 +324,6 @@ const arrivalMax = computed(() => getArrivalBound(form, 3))
 
 const arrivalMinDate = computed(() => arrivalMin.value ? new Date(arrivalMin.value) : undefined)
 const arrivalMaxDate = computed(() => arrivalMax.value ? new Date(arrivalMax.value) : undefined)
-
-// ── Editable, format-aware date text inputs ─────────────────────────────────
-// departureDatePart / arrivalDatePart stay the source of truth as Date
-// objects. These input refs are what the text-fields actually bind to, so
-// the user can type freely; parsing only commits on blur/enter.
-
-const departureDateInput = ref(formatDateForFormat(departureDatePart.value, dateFormat.value))
-const arrivalDateInput   = ref(formatDateForFormat(arrivalDatePart.value, dateFormat.value))
-
-watch([departureDatePart, dateFormat], () => {
-    departureDateInput.value = formatDateForFormat(departureDatePart.value, dateFormat.value)
-})
-watch([arrivalDatePart, dateFormat], () => {
-    arrivalDateInput.value = formatDateForFormat(arrivalDatePart.value, dateFormat.value)
-})
-
-function commitDepartureDateInput() {
-    if (!departureDateInput.value.trim()) {
-        departureDatePart.value = null
-        return
-    }
-    const parsed = parseDateInputStr(departureDateInput.value, dateFormat.value)
-    if (parsed) {
-        departureDatePart.value = parsed
-    } else {
-        departureDateInput.value = formatDateForFormat(departureDatePart.value, dateFormat.value)
-    }
-}
-
-function commitArrivalDateInput() {
-    if (!arrivalDateInput.value.trim()) {
-        arrivalDatePart.value = null
-        return
-    }
-    const parsed = parseDateInputStr(arrivalDateInput.value, dateFormat.value)
-    if (parsed) {
-        arrivalDatePart.value = parsed
-    } else {
-        arrivalDateInput.value = formatDateForFormat(arrivalDatePart.value, dateFormat.value)
-    }
-}
-
-// ── Editable, format-aware time text fields ────────────────────────────────
-// departureTimePart / arrivalTimePart stay the source of truth as internal
-// "HH:mm" (24hr) strings. These input refs are what the text-fields actually
-// bind to, so the user can type freely; parsing only commits on blur/enter.
-
-function formatTimeForFormat(t: string | null, format: string): string {
-    if (!t) return ''
-    const [hStr, mStr] = t.split(':')
-    let h = parseInt(hStr, 10)
-    if (isNaN(h)) return ''
-
-    if (format === '24hr') {
-        return `${pad(h)}:${mStr}`
-    }
-
-    const ampm = h >= 12 ? 'PM' : 'AM'
-    let h12 = h % 12
-    if (h12 === 0) h12 = 12
-    return `${h12}:${mStr} ${ampm}`
-}
-
-function parseTimeInput(input: string): string | null {
-    const trimmed = input.trim()
-    if (!trimmed) return null
-
-    // ampm form: "2:30 PM", "2:30PM", "2 PM", "2PM"
-    let match = trimmed.match(/^(\d{1,2}):?(\d{2})?\s*([AaPp][Mm])$/)
-    if (match) {
-        let h = parseInt(match[1], 10)
-        const m = match[2] ? parseInt(match[2], 10) : 0
-        const ampm = match[3].toUpperCase()
-        if (h >= 1 && h <= 12 && m >= 0 && m <= 59) {
-            if (ampm === 'PM' && h !== 12) h += 12
-            if (ampm === 'AM' && h === 12) h = 0
-            return `${pad(h)}:${pad(m)}`
-        }
-        return null
-    }
-
-    // 24hr form: "14:30" or "1430"
-    match = trimmed.match(/^(\d{1,2}):?(\d{2})$/)
-    if (match) {
-        const h = parseInt(match[1], 10)
-        const m = parseInt(match[2], 10)
-        if (h >= 0 && h <= 23 && m >= 0 && m <= 59) {
-            return `${pad(h)}:${pad(m)}`
-        }
-    }
-
-    return null
-}
-
-const departureTimeInput = ref(formatTimeForFormat(departureTimePart.value, timeFormat.value))
-const arrivalTimeInput   = ref(formatTimeForFormat(arrivalTimePart.value, timeFormat.value))
-
-watch([departureTimePart, timeFormat], () => {
-    departureTimeInput.value = formatTimeForFormat(departureTimePart.value, timeFormat.value)
-})
-watch([arrivalTimePart, timeFormat], () => {
-    arrivalTimeInput.value = formatTimeForFormat(arrivalTimePart.value, timeFormat.value)
-})
-
-function commitDepartureTimeInput() {
-    if (!departureTimeInput.value.trim()) {
-        departureTimePart.value = null
-        return
-    }
-    const parsed = parseTimeInput(departureTimeInput.value)
-    if (parsed !== null) {
-        departureTimePart.value = parsed
-    } else {
-        departureTimeInput.value = formatTimeForFormat(departureTimePart.value, timeFormat.value)
-    }
-}
-
-function commitArrivalTimeInput() {
-    if (!arrivalTimeInput.value.trim()) {
-        arrivalTimePart.value = null
-        return
-    }
-    const parsed = parseTimeInput(arrivalTimeInput.value)
-    if (parsed !== null) {
-        arrivalTimePart.value = parsed
-    } else {
-        arrivalTimeInput.value = formatTimeForFormat(arrivalTimePart.value, timeFormat.value)
-    }
-}
 </script>
 
 <template>
@@ -573,17 +372,14 @@ function commitArrivalTimeInput() {
                             <template #activator="{ props: menuProps }">
                                 <v-text-field
                                     v-bind="menuProps"
-                                    v-model="departureDateInput"
+                                    :model-value="formatDateDisplay(departureDatePart)"
                                     label="Departure Date"
+                                    readonly
                                     clearable
                                     prepend-inner-icon="mdi-calendar"
-                                    :placeholder="dateFormat"
                                     :disabled="!lookupComplete"
                                     :error-messages="submitForm.errors.departure_date"
                                     @click:clear="clearDepartureDate"
-                                    @blur="commitDepartureDateInput"
-                                    @keydown.enter="commitDepartureDateInput"
-                                    autocomplete="false"
                                 />
                             </template>
                             <v-date-picker
@@ -597,21 +393,19 @@ function commitArrivalTimeInput() {
                             <template #activator="{ props: menuProps }">
                                 <v-text-field
                                     v-bind="menuProps"
-                                    v-model="departureTimeInput"
+                                    :model-value="formatTimeDisplay(departureTimePart)"
                                     label="Departure Time"
+                                    readonly
                                     clearable
                                     prepend-inner-icon="mdi-clock-outline"
-                                    :placeholder="timeFormat === '24hr' ? 'e.g. 1430' : 'e.g. 2:30 PM'"
                                     :disabled="!lookupComplete"
                                     @click:clear="clearDepartureTime"
-                                    @blur="commitDepartureTimeInput"
-                                    @keydown.enter="commitDepartureTimeInput"
                                 />
                             </template>
                             <v-card>
                                 <v-time-picker
                                     v-model="departureTimePart"
-                                    :format="timeFormat"
+                                    format="ampm"
                                     scrollable
                                 />
                                 <v-card-actions>
@@ -630,16 +424,14 @@ function commitArrivalTimeInput() {
                             <template #activator="{ props: menuProps }">
                                 <v-text-field
                                     v-bind="menuProps"
-                                    v-model="arrivalDateInput"
+                                    :model-value="formatDateDisplay(arrivalDatePart)"
                                     label="Arrival Date"
+                                    readonly
                                     clearable
                                     prepend-inner-icon="mdi-calendar"
-                                    :placeholder="dateFormat"
                                     :disabled="!lookupComplete"
                                     :error-messages="submitForm.errors.arrival_date"
                                     @click:clear="clearArrivalDate"
-                                    @blur="commitArrivalDateInput"
-                                    @keydown.enter="commitArrivalDateInput"
                                 />
                             </template>
                             <v-date-picker
@@ -655,21 +447,19 @@ function commitArrivalTimeInput() {
                             <template #activator="{ props: menuProps }">
                                 <v-text-field
                                     v-bind="menuProps"
-                                    v-model="arrivalTimeInput"
+                                    :model-value="formatTimeDisplay(arrivalTimePart)"
                                     label="Arrival Time"
+                                    readonly
                                     clearable
                                     prepend-inner-icon="mdi-clock-outline"
-                                    :placeholder="timeFormat === '24hr' ? 'e.g. 1430' : 'e.g. 2:30 PM'"
                                     :disabled="!lookupComplete"
                                     @click:clear="clearArrivalTime"
-                                    @blur="commitArrivalTimeInput"
-                                    @keydown.enter="commitArrivalTimeInput"
                                 />
                             </template>
                             <v-card>
                                 <v-time-picker
                                     v-model="arrivalTimePart"
-                                    :format="timeFormat"
+                                    format="ampm"
                                     scrollable
                                 />
                                 <v-card-actions>

resources/js/Pages/Admin/AdminLayout.vue

@@ -7,6 +7,7 @@ import {Head} from "@inertiajs/vue3";
 defineProps<{
     title: string;
     missingLiveryCount: number;
+    missingAirlineCount: number;
 
 }>()
 </script>
@@ -15,7 +16,7 @@ defineProps<{
     <MainLayout>
         <Head :title="title" />
         <div class="admin-container">
-            <AdminSidebar :missingLiveryCount="missingLiveryCount" />
+            <AdminSidebar :missingAirlineCount="missingAirlineCount" :missingLiveryCount="missingLiveryCount" />
             <div class="admin-content">
                 <GlassBox class="admin-page" :title="title">
                     <slot />

resources/js/Pages/Admin/AdminSidebar.vue

@@ -3,6 +3,7 @@ import {Link} from "@inertiajs/vue3";
 import {number} from "echarts";
 defineProps<{
     missingLiveryCount: number;
+    missingAirlineCount: number;
 }>()
 </script>
 
@@ -18,6 +19,11 @@ defineProps<{
             Reconcile Missing Liveries
             <v-chip  size="x-small" color="error" class="ml-1">{{ missingLiveryCount }}</v-chip>
         </Link>
+        <Link :href="route('admin.reconcile-missing-airlines')" class="sidebar-link">
+            <v-icon icon="mdi-airplane-takeoff" size="18" />
+            Reconcile Missing Airlines
+            <v-chip  size="x-small" color="error" class="ml-1">{{ missingAirlineCount }}</v-chip>
+        </Link>
     </aside>
 </template>
 

resources/js/Pages/Admin/MissingAirlines.vue

@@ -0,0 +1,72 @@
+<script setup lang="ts">
+import GlassBox from "@/Components/FlightsGoneBy/GlassBox.vue";
+import { Head } from "@inertiajs/vue3";
+import { MissingAirline } from "@/Types/types";
+import MissingAirlineCard from "@/Components/Admin/MissingAirlineCard.vue";
+import AdminLayout from "@/Pages/Admin/AdminLayout.vue";
+import Panel from "@/Components/FlightsGoneBy/Panels/Panel.vue";
+
+defineOptions({ layout: AdminLayout });
+
+defineProps<{
+    missingAirlines: MissingAirline[]
+}>()
+</script>
+
+<template>
+    <Head title="Missing Airlines" />
+
+    <Panel>
+        <template #header>
+            <h1 class="panel-title">Missing Airlines</h1>
+            <span class="panel-subtitle">
+                {{ missingAirlines.length }} unmatched code{{ missingAirlines.length === 1 ? '' : 's' }}
+            </span>
+        </template>
+
+        <div v-if="missingAirlines.length === 0" class="empty-state">
+            No missing airlines 🎉
+        </div>
+
+        <div v-else class="missing-airlines-grid">
+            <MissingAirlineCard
+                v-for="airline in missingAirlines"
+                :key="airline.code"
+                :airline="airline"
+            />
+        </div>
+    </Panel>
+</template>
+
+<style scoped>
+.panel-title {
+    font-family: 'Share Tech Mono', monospace;
+    font-size: 1.25rem;
+    letter-spacing: 0.06em;
+    text-transform: uppercase;
+    color: #e6e9ef;
+}
+
+.panel-subtitle {
+    font-family: 'Share Tech Mono', monospace;
+    font-size: 0.7rem;
+    letter-spacing: 0.1em;
+    text-transform: uppercase;
+    color: #778;
+}
+
+.missing-airlines-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+    gap: 1rem;
+    margin-top: 1rem;
+}
+
+.empty-state {
+    font-family: 'Share Tech Mono', monospace;
+    font-size: 0.85rem;
+    color: #778;
+    padding: 2rem 0;
+    text-align: center;
+}
+</style>

resources/js/Types/types.d.ts

@@ -30,8 +30,6 @@ export interface UserSettings {
     show_map_legend: boolean
     hide_impossible_achievements: boolean
     hide_map_filters: boolean
-    time_format: "ampm" | "24hr"
-    date_format: string
 }
 
 
@@ -328,6 +326,14 @@ export interface MissingLivery {
     clipboard_text: string;
 }
 
+export interface MissingAirline{
+    code: string;
+    flights: {
+        flight_number: string;
+        link: string;
+    }[]
+}
+
 declare module '@inertiajs/vue3' {
     interface PageProps extends SharedProps {}
 }

routes/web.php

@@ -40,6 +40,8 @@ use Inertia\Inertia;
         Route::get('/', [AdminController::class, 'dashboard'])->name('dashboard');
         Route::get('/missing-liveries', [AdminController::class, 'reconcileMissingLiveries'])->name('reconcile-missing-liveries')->middleware('permission:reconcile_missing_liveries');
         Route::post('/ignore-missing-livery', [AdminController::class, 'ignoreMissingLivery'])->name('ignore-missing-livery');
+
+        Route::get('/missing-airlines', [AdminController::class, 'reconcileMissingAirlines'])->name('reconcile-missing-airlines')->middleware('permission:reconcile_missing_liveries');
     });