Updated logo API

app/Http/Controllers/Api/LogoController.php

@@ -39,12 +39,6 @@ class LogoController extends ApiController
         ]);
     }
 
-    public function getLogoById($id){
-        $airline = Airline::where('id', $id)
-            ->first();
-
-        return $this->getAirlineLogo($airline);
-    }
 
     public function getLogoByInternalName(string $internalName){
         $airline = Airline::where('internal_name', $internalName)
@@ -53,26 +47,4 @@ class LogoController extends ApiController
         return $this->getAirlineLogo($airline);
     }
 
-
-    public function getLogoByCode(string $code){
-
-        $column = strlen($code) == 2
-            ? 'IATA_code'
-            : 'ICAO_code';
-
-        $airline = Airline::where($column, strtoupper($code))
-            ->whereNotNull('logo')
-            ->where('active', true)
-            ->latest('id')
-            ->first();
-
-        if (!$airline) {
-            $airline = Airline::where($column, strtoupper($code))
-                ->whereNotNull('logo')
-                ->latest('id')
-                ->first();
-        }
-
-        return $this->getAirlineLogo($airline);
-    }
 }

app/Http/Controllers/Api/UserController.php

@@ -40,7 +40,7 @@ class UserController extends ApiController
             'flightNumber'         => $flight->flight_number,
             'airlineName'          => $flight->airline->name,
             'aircraftType'         => $flight->aircraft->manufacturer_code . ' ' . $flight->aircraft->model_full_name,
-            'logoUrl' => config('app.logo_api_url') . "/airlines/logos/tail/name/{$flight->airline->internal_name}"
+            'logoUrl' => $flight->airline->logo_url,
         ];
     }
 

app/Http/Controllers/SearchController.php

@@ -26,10 +26,11 @@ class SearchController extends Controller
                 }
             })
             ->limit(50)
-            ->get(['id', 'name', 'IATA_code', 'ICAO_code', 'logo'])
+            ->get()
             ->map(fn($airline) => [
                 'value' => $airline->id,
                 'title' => $airline->display_name,
+                'logo_url' => $airline->logo_url,
             ])
             ->values();
     }

app/Models/Aircraft.php

@@ -23,6 +23,7 @@ class Aircraft extends Model
 
     protected $appends = [
         'display_name',
+        'display_name_short'
     ];
 
     protected function displayName() : Attribute{
@@ -32,4 +33,14 @@ class Aircraft extends Model
             }
         );
     }
+
+    protected function displayNameShort(): Attribute
+    {
+        return Attribute::make(
+            get: function () {
+                $name = "{$this->manufacturer_code} {$this->model_full_name}";
+                return trim(preg_replace('/\s*\(.*?\)/', '', $name));
+            }
+        );
+    }
 }

app/Models/Airline.php

@@ -29,6 +29,7 @@ class Airline extends Model
     public $timestamps = false;
     protected $appends = [
         'display_name',
+        'logo_url',
     ];
 
     protected function displayName() : Attribute{
@@ -41,6 +42,14 @@ class Airline extends Model
         );
     }
 
+    protected function logoUrl() : Attribute{
+        return Attribute::make(
+            get: function () {
+                return config('app.logo_api_url') . "/airline/$this->internal_name/logo/tail/";
+            }
+        );
+    }
+
     public function country(): BelongsTo
     {
         return $this->belongsTo(Country::class);

database/migrations/2026_04_22_060923_update_aircraft_table.php

@@ -0,0 +1,24 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        //
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        //
+    }
+};

resources/js/Components/FlightsGoneBy/AirlineLogo.vue

@@ -10,8 +10,7 @@ const props = defineProps<{
     size?: number | string;
 }>();
 
-const page = usePage<SharedProps>().props;
+const logoUrl = computed(() => `url('${props.airline?.logo_url}')`);
-const logoUrl = computed(() => `url('${page.logo_api_url}/airlines/logos/tail/name/${props.airline?.internal_name}')`);
 const logoStyle = computed(() => ({
     width: size.value,
     height: size.value,

resources/js/Components/FlightsGoneBy/AirlineSearchBox.vue

@@ -5,13 +5,13 @@ import {usePage} from "@inertiajs/vue3";
 import type {SharedProps} from "@/Types/types";
 
 const props = defineProps<{
-    prefilledOptions: { value: number, title: string }[]
+    prefilledOptions: { value: number, title: string, logo_url: string }[]
     errorMessages?: string[] | string
 }>()
 
 const page = usePage<SharedProps>().props
 
-const model = defineModel<{ value: number, title: string } | null>()
+const model = defineModel<{ value: number, title: string, logo_url: string } | null>()
 
 const airlineOptions = ref(props.prefilledOptions ?? [])
 const autocompleteRef = ref<any>(null)
@@ -58,13 +58,13 @@ const searchAirlines = async (query: string) => {
                 style="padding: 0.25em"
                 width="40"
                 height="40"
-                :src="`${page.logo_api_url}/airlines/logos/tail/id/${model.value}`"
+                :src="`${model.logo_url}`"
             />
         </template>
         <template #item="{ item, props: itemProps }">
             <v-list-item v-bind="itemProps">
                 <template #prepend>
-                    <img style="padding:0.25em" width="40" height="40" :src="`${page.logo_api_url}/airlines/logos/tail/id/${item.value}`"  alt=""/>
+                    <img style="padding:0.25em" width="40" height="40" :src="`${item.logo_url}`"  alt=""/>
                 </template>
 
             </v-list-item>

resources/js/Components/FlightsGoneBy/Charts/TopAircraftChart.vue

@@ -0,0 +1,64 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { FlightStats } from "@/Composables/useFlightStats"
+import { useChartTooltip } from '@/Composables/useChartTooltip'
+import ScrollingHorizontalBarChart from "@/Components/FlightsGoneBy/Charts/ChartTypes/ScrollingHorizontalBarChart.vue"
+import ChartTooltip from "@/Components/FlightsGoneBy/Charts/ChartTooltip.vue"
+import InlineBadge from "@/Components/FlightsGoneBy/InlineBadge.vue"
+
+interface AircraftItem {
+    label: string
+    id: number
+    past: number
+    upcoming: number
+    designator: string
+}
+
+const props = defineProps<{
+    flightStats: FlightStats
+}>()
+
+const { tooltipItem, onMouseMove, onMouseLeave } = useChartTooltip<AircraftItem>()
+
+const aircraft = computed(() => props.flightStats.topAircraft.value.aircraft)
+
+const chartEvents = computed(() => ({
+    mouseMove: (_e: MouseEvent, _chart: unknown, config: { dataPointIndex: number }) => {
+        if (config.dataPointIndex < 0) { tooltipItem.value = null; return }
+        tooltipItem.value = aircraft.value[config.dataPointIndex] ?? null
+    },
+    mouseLeave: () => { tooltipItem.value = null },
+}))
+</script>
+
+<template>
+    <ScrollingHorizontalBarChart
+        title="Top aircraft"
+        :series="flightStats.topAircraft.value.series"
+        :categories="aircraft.map(a => a.label)"
+        :footer-value="aircraft.length"
+        footer-label="total aircraft"
+        :events="chartEvents"
+        @mousemove="onMouseMove"
+        @mouseleave="onMouseLeave"
+    >
+        <template #tooltip="{ visible, x, y, index }">
+            <ChartTooltip :visible="visible" :x="x" :y="y">
+                <div class="ct-name">
+                    {{ index !== null ? aircraft[index].label : '' }}
+                </div>
+                <div class="ct-row">
+                    <InlineBadge v-if="index !== null" variant="generic">{{ aircraft[index].designator }}</InlineBadge>
+                </div>
+                <div class="ct-row">
+                    <span class="ct-label">Flights</span>
+                    <span class="ct-val">{{ index !== null ? aircraft[index].past : '' }}</span>
+                </div>
+                <div v-if="index !== null && aircraft[index].upcoming" class="ct-row">
+                    <span class="ct-label">Upcoming</span>
+                    <span class="ct-val">{{ aircraft[index].upcoming }}</span>
+                </div>
+            </ChartTooltip>
+        </template>
+    </ScrollingHorizontalBarChart>
+</template>

resources/js/Components/FlightsGoneBy/Charts/TopAirlinesChart.vue

@@ -12,6 +12,7 @@ interface AirlineItem {
     past: number
     upcoming: number
     id: number
+    logo_url: string
 }
 
 const props = defineProps<{
@@ -46,7 +47,7 @@ const chartEvents = computed(() => ({
         <template #tooltip="{ visible, x, y, index }">
             <ChartTooltip :visible="visible" :x="x" :y="y">
                 <div class="ct-name">
-                    <img :src="`${page.logo_api_url}/airlines/logos/tail/id/${index !== null ? airlines[index].id : ''}`" width="24" height="24"/>
+                    <img :src="`${index !== null ? airlines[index].logo_url : ''}`" width="24" height="24"/>
                     {{ index !== null ? airlines[index].name : '' }}
                 </div>
                 <div class="ct-row">

resources/js/Components/FlightsGoneBy/Charts/TopRoutesChart.vue

@@ -30,7 +30,7 @@ const series = computed(() => props.flightStats.topRoutes.value.series)
         :categories="routes.map(r => r.label)"
         :footer-value="routes.length"
         footer-label="total routes"
-        :max-visible="18"
+        :max-visible="12"
     >
         <template #tooltip="{ visible, x, y, index }">
             <ChartTooltip :visible="visible" :x="x" :y="y">

resources/js/Components/FlightsGoneBy/FlightCharts.vue

@@ -14,6 +14,7 @@ import TopAirportsChart from '@/Components/FlightsGoneBy/Charts/TopAirportsChart
 import TopRoutesChart from '@/Components/FlightsGoneBy/Charts/TopRoutesChart.vue'
 import FlightTypeChart from '@/Components/FlightsGoneBy/Charts/FlightTypeChart.vue'
 import {FlightStats} from "@/Composables/useFlightStats";
+import TopAircraftChart from "@/Components/FlightsGoneBy/Charts/TopAircraftChart.vue";
 
 defineProps<{
     flightStats: FlightStats
@@ -61,6 +62,7 @@ defineProps<{
         <!-- Routes + International vs Domestic -->
         <div class="flight-charts glass charts-row">
             <TopRoutesChart :flight-stats="flightStats" />
+            <TopAircraftChart :flight-stats="flightStats" />
         </div>
     </div>
 </template>

resources/js/Components/FlightsGoneBy/FlightFilter.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { Flight } from '@/Types/types'
+import type {Airline, Flight} from '@/Types/types'
 import { ref } from 'vue'
 import { usePage } from '@inertiajs/vue3'
 
@@ -20,9 +20,11 @@ const emit = defineEmits<{
 
 // ── Available options ─────────────────────────────────────────────────────────
 
+type AirlineData = { id: number; name: string, airline: Airline }
+
 function buildOptions(flights: Flight[]) {
     const years      = new Set<number>()
-    const airlines   = new Map<number, { id: number; name: string }>()
+    const airlines   = new Map<number, AirlineData>()
     const countries  = new Map<string, { code: string; name: string }>()
     const continents = new Map<string, { code: string; name: string }>()
     const classes    = new Map<number, { id: number; name: string }>()
@@ -31,8 +33,8 @@ function buildOptions(flights: Flight[]) {
     flights.forEach(f => {
         years.add(new Date(f.departure_date).getFullYear())
 
-        if (f.airline?.id && f.airline?.name)
+        if (f.airline)
-            airlines.set(f.airline.id, { id: f.airline.id, name: f.airline.name })
+            airlines.set(f.airline.id, { id: f.airline.id, name: f.airline.name, airline: f.airline })
 
         const dep = f.departure_airport.region
         const arr = f.arrival_airport.region
@@ -82,8 +84,6 @@ function emitFilters() {
 
 // ── Helpers ───────────────────────────────────────────────────────────────────
 const page = usePage()
-const airlineLogoUrl = (internal_name: string) =>
-    `${page.props.logo_api_url}/airlines/logos/tail/name/${internal_name}`
 
 const countryFlagClass = (code: string) =>
     `fi fi-${code.toLowerCase()}`
@@ -123,7 +123,7 @@ const countryFlagClass = (code: string) =>
                     </template>
                     <template #title>
                         <img
-                            :src="airlineLogoUrl((item as any).internal_name)"
+                            :src="(item as AirlineData).airline.logo_url"
                             width="32" height="32"
                             style="object-fit: contain; margin-right: 8px; vertical-align: middle;"
                             alt=""

resources/js/Components/FlightsGoneBy/FlightMap.vue

@@ -115,7 +115,7 @@ function routePopupHTML(historical: Flight[], future: Flight[]): string {
             const label = `${f.departure_airport.municipality} to ${f.arrival_airport.municipality}`
             if (!dirs.has(key)) dirs.set(key, { label, airlines: [] })
             const airline = f.airline ? `<span style="display:inline-flex;align-items:center;gap:6px;">
-                <img src="${logoApiUrl}/airlines/logos/tail/id/${f.airline?.id}" width="24" height="24" alt="${f.airline?.IATA_code}" style="flex-shrink:0;" />
+                <img src="${f.airline?.logo_url}" width="24" height="24" alt="${f.airline?.IATA_code}" style="flex-shrink:0;" />
                 ${f.airline?.name}
             </span>` : ''
             if (airline && !dirs.get(key)!.airlines.includes(airline)) {

resources/js/Composables/useFlightStats.ts

@@ -202,11 +202,11 @@ export function getContinents(flights: Flight[]) {
 // ── Airlines ──────────────────────────────────────────────────────────────────
 
 function countAirlines(flights: Flight[]) {
-    const counts = new Map<string, { count: number; id: number }>()
+    const counts = new Map<string, { count: number; id: number, logo_url: string }>()
     flights.forEach(f => {
         const airline = f.airline
         if (!airline?.name) return
-        const existing = counts.get(airline.name) ?? { count: 0, id: airline.id }
+        const existing = counts.get(airline.name) ?? { count: 0, id: airline.id, logo_url: airline.logo_url }
         existing.count++
         counts.set(airline.name, existing)
     })
@@ -225,6 +225,7 @@ export function getTopAirlines(flights: Flight[], upcomingFlights: Flight[]) {
             id:       (past.get(name) ?? upcoming.get(name))!.id,
             past:     past.get(name)?.count ?? 0,
             upcoming: upcoming.get(name)?.count ?? 0,
+            logo_url:  (past.get(name) ?? upcoming.get(name))!.logo_url,
         }))
         .sort((a, b) => (b.past + b.upcoming) - (a.past + a.upcoming))
 
@@ -323,17 +324,17 @@ interface AircraftItem {
     id: number
     past: number
     upcoming: number
+    designator: string
 }
 
 export function getTopAircraft(flights: Flight[], upcomingFlights: Flight[]) {
-    console.time('getTopAircraft')
 
     function countAircraft(list: Flight[]) {
-        const counts = new Map<string, { count: number; id: number }>()
+        const counts = new Map<string, { count: number; id: number; displayName: string; designator: string }>()
         list.forEach(f => {
             const aircraft = f.aircraft
             if (!aircraft?.designator) return
-            const existing = counts.get(aircraft.designator) ?? { count: 0, id: aircraft.id }
+            const existing = counts.get(aircraft.designator) ?? { count: 0, id: aircraft.id, displayName: aircraft.display_name_short, designator: aircraft.designator }
             existing.count++
             counts.set(aircraft.designator, existing)
         })
@@ -346,7 +347,8 @@ export function getTopAircraft(flights: Flight[], upcomingFlights: Flight[]) {
 
     const sorted: AircraftItem[] = [...allNames]
         .map(name => ({
-            label:    name,
+            label:    (past.get(name) ?? upcoming.get(name))!.displayName,
+            designator: (past.get(name) ?? upcoming.get(name))!.designator,
             id:       (past.get(name) ?? upcoming.get(name))!.id,
             past:     past.get(name)?.count ?? 0,
             upcoming: upcoming.get(name)?.count ?? 0,
@@ -360,7 +362,6 @@ export function getTopAircraft(flights: Flight[], upcomingFlights: Flight[]) {
             { name: 'Upcoming', data: sorted.map(s => s.upcoming) },
         ],
     }
-    console.timeEnd('getTopAircraft')
     return result
 }
 

resources/js/Types/types.d.ts

@@ -81,17 +81,16 @@ export interface Airline {
     id: number
     IATA_code: string | null
     ICAO_code: string | null
-    name: string | null
+    name: string
-    internal_name: string | null
+    internal_name: string
     active: boolean
     logo: string | null
     country_id: number
     country?: Country
     display_name: string
+    logo_url: string
 }
 
-
-
 export interface Aircraft {
     id: number
     designator: string
@@ -104,6 +103,7 @@ export interface Aircraft {
     created_at: string | null
     updated_at: string | null
     display_name: string
+    display_name_short: string
 }
 
 export interface SeatType {

routes/web.php

@@ -91,8 +91,7 @@ Route::domain(config('app.api_domain'))->group(function () {
         return response()->json(['message' => 'Welcome to the FlightsGoneBy API']);
     });
 
-    Route::get('airlines/logos/tail/id/{id}', [App\Http\Controllers\Api\LogoController::class, 'getLogoById'])->where('id', '[0-9]+');
+    Route::get('airline/{internalName}/logo/tail', [App\Http\Controllers\Api\LogoController::class, 'getLogoByInternalName']);
-    Route::get('airlines/logos/tail/name/{internalName}', [App\Http\Controllers\Api\LogoController::class, 'getLogoByInternalName']);
     Route::get('user/{username}/next-flight', [App\Http\Controllers\Api\UserController::class, 'nextFlight']);
 
 });