Added Support and Analytics for Release

This commit is contained in:
2026-07-10 21:59:35 +10:00
parent d765161b9a
commit 85eeba982f
24 changed files with 673 additions and 320 deletions
@@ -0,0 +1,35 @@
<?php
namespace App\Http\Controllers;
use App\Notifications\SupportRequestSubmitted;
use Illuminate\Http\RedirectResponse;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Notification;
use Inertia\Inertia;
class SupportFormController extends Controller
{
public function view()
{
return Inertia::render('Contact/Support');
}
public function store(Request $request): RedirectResponse
{
$validated = $request->validate([
'reason' => ['required', 'string', 'in:bug_report,general_feedback,missing_data'],
'message' => ['required', 'string', 'max:5000'],
]);
Notification::route('mail', config('mail.support_address', 'hello@flightsgoneby.com'))
->notify(new SupportRequestSubmitted(
name: $request->user()->name,
email: $request->user()->email,
reason: $validated['reason'],
message: $validated['message'],
));
return back()->with('success', 'Your message has been sent.');
}
}
+3
View File
@@ -2,12 +2,15 @@
namespace App\Models;
use App\Observers\AirlineObserver;
use Illuminate\Database\Eloquent\Attributes\ObservedBy;
use Illuminate\Database\Eloquent\Builder;
use Illuminate\Database\Eloquent\Casts\Attribute;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\Relations\BelongsTo;
use Illuminate\Database\Eloquent\Relations\HasMany;
#[ObservedBy(AirlineObserver::class)]
class Airline extends Model
{
protected $table = 'airlines';
+3
View File
@@ -2,6 +2,8 @@
namespace App\Models;
use App\Observers\NotificationObserver;
use Illuminate\Database\Eloquent\Attributes\ObservedBy;
use Illuminate\Database\Eloquent\Builder;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\Relations\BelongsTo;
@@ -26,6 +28,7 @@ use Illuminate\Database\Eloquent\Relations\BelongsTo;
* @method static Builder active()
* @method static Builder forAchievements()
*/
#[ObservedBy(NotificationObserver::class)]
class Notification extends Model
{
protected $fillable = [
+5 -1
View File
@@ -2,10 +2,13 @@
namespace App\Models;
use App\Observers\UserObserver;
use App\Settings\SettingsRegistry;
use Database\Factories\UserFactory;
use Illuminate\Contracts\Auth\MustVerifyEmail;
use Illuminate\Database\Eloquent\Attributes\Fillable;
use Illuminate\Database\Eloquent\Attributes\Hidden;
use Illuminate\Database\Eloquent\Attributes\ObservedBy;
use Illuminate\Database\Eloquent\Casts\Attribute;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Relations\BelongsToMany;
@@ -24,7 +27,8 @@ use App\Notifications\ResetPasswordNotification;
#[Fillable(['name', 'email', 'password', 'distance_unit', 'settings'])]
#[Hidden(['password', 'remember_token'])]
class User extends Authenticatable
#[ObservedBy(UserObserver::class)]
class User extends Authenticatable implements MustVerifyEmail
{
/** @use HasFactory<UserFactory> */
+11
View File
@@ -3,6 +3,8 @@
namespace App\Models;
use App\Http\Controllers\Api\AirlineApiController;
use App\Observers\FlightObserver;
use Illuminate\Database\Eloquent\Attributes\ObservedBy;
use Illuminate\Database\Eloquent\Casts\Attribute;
use Carbon\Carbon;
use Illuminate\Database\Eloquent\Model;
@@ -10,6 +12,7 @@ use Illuminate\Database\Eloquent\Relations\BelongsTo;
use Illuminate\Support\Collection;
use Illuminate\Support\Facades\Storage;
#[ObservedBy(FlightObserver::class)]
class UserFlight extends Model
{
protected $table = 'user_flights';
@@ -56,6 +59,7 @@ class UserFlight extends Model
'scope',
'range',
'region_range',
'class_seat_combined'
];
protected static function booted(): void
@@ -95,6 +99,13 @@ class UserFlight extends Model
);
}
protected function classSeatCombined(): Attribute
{
return Attribute::make(
get: fn() => $this->flightClass?->name
);
}
protected function departureTimeDisplay(): Attribute
{
return Attribute::make(
@@ -0,0 +1,47 @@
<?php
namespace App\Notifications;
use Illuminate\Bus\Queueable;
use Illuminate\Contracts\Queue\ShouldQueue;
use Illuminate\Notifications\Messages\MailMessage;
use Illuminate\Notifications\Notification;
class SupportRequestSubmitted extends Notification implements ShouldQueue
{
use Queueable;
public function __construct(
public string $name,
public string $email,
public string $reason,
public string $message,
) {}
public function via($notifiable): array
{
return ['mail'];
}
public function toMail($notifiable): MailMessage
{
return (new MailMessage)
->theme('flightsgoneby')
->subject('New Support Request: ' . $this->reasonLabel())
->replyTo($this->email, $this->name)
->greeting('New Support Request')
->line('Reason: ' . $this->reasonLabel())
->line('From: ' . $this->name . ' (' . $this->email . ')')
->line($this->message);
}
protected function reasonLabel(): string
{
return match ($this->reason) {
'bug_report' => 'Bug Report',
'general_feedback' => 'General Feedback',
'missing_data' => 'Missing Data',
default => $this->reason,
};
}
}
+24
View File
@@ -0,0 +1,24 @@
<?php
namespace App\Observers;
use App\Models\Notification;
use App\Models\User;
class UserObserver
{
public function created(User $user): void
{
User::role('admin')
->where('id', '!=', $user->id)
->get(['id'])
->each(fn (User $admin) => Notification::create([
'user_id' => $admin->id,
'title' => 'New user registered',
'body' => "{$user->name} just signed up.",
'url' => null,
'is_achievement' => false,
'achievement_id' => null,
]));
}
}
-3
View File
@@ -34,9 +34,6 @@ class AppServiceProvider extends ServiceProvider
Mail::alwaysTo(config('app.test_email'));
}
Vite::prefetch(concurrency: 3);
UserFlight::observe(FlightObserver::class);
Airline::observe(AirlineObserver::class);
Notification::observe(NotificationObserver::class);
RateLimiter::for('api', function (Request $request) {
return $request->user('sanctum')
? Limit::perMinute(60)->by($request->user('sanctum')->id)
+13 -2
View File
@@ -110,7 +110,10 @@ class SettingsRegistry
'label' => 'Which columns to show on the Departure Board',
'default' => ['airline', 'flight_number', 'departure_airport', 'arrival_airport', 'departure_date', 'departure_time', 'arrival_time', 'duration', 'distance', 'aircraft', 'registration', 'class_seat_combined'],
'options' => [
['value' => 'airline', 'label' => 'Airline'],
['value' => 'airline', 'label' => 'Airline Logo w/ Info Popup'],
['value' => 'airline.name', 'label' => 'Airline Name'],
['value' => 'airline.iata_code', 'label' => 'Airline IATA Code'],
['value' => 'airline.icao_code', 'label' => 'Airline ICAO Code'],
['value' => 'flight_number', 'label' => 'Flight Number'],
['value' => 'departure_airport', 'label' => 'From'],
['value' => 'arrival_airport', 'label' => 'To'],
@@ -119,8 +122,16 @@ class SettingsRegistry
['value' => 'arrival_time', 'label' => 'Arrival Time'],
['value' => 'duration', 'label' => 'Duration'],
['value' => 'distance', 'label' => 'Distance'],
['value' => 'aircraft', 'label' => 'Aircraft'],
['value' => 'aircraft', 'label' => 'Aircraft Designator w/ Info Popup'],
['value' => 'registration', 'label' => 'Aircraft Registration'],
['value' => 'aircraft.manufacturer_code', 'label' => 'Aircraft Manufacturer'],
['value' => 'aircraft.model_full_name', 'label' => 'Aircraft Model'],
['value' => 'flight_class', 'label' => 'Class'],
['value' => 'seat_type_id', 'label' => 'Seat Type'],
['value' => 'seat_number', 'label' => 'Seat Number'],
['value' => 'flight_reason_id', 'label' => 'Reason'],
['value' => 'aircraft.display_name_short', 'label' => 'Aircraft Full Name'],
['value' => 'class_seat_combined', 'label' => 'Class/Seat Type/Seat Number Combined'],
],
],
+1
View File
@@ -42,6 +42,7 @@ return [
'debug' => (bool) env('APP_DEBUG', false),
'verify_ssl' => env('VERIFY_SSL', true),
'test_email' => env('TEST_EMAIL', ''),
'contact_email' => env('CONTACT_EMAIL', ''),
/*
|--------------------------------------------------------------------------
| Application URL
@@ -22,8 +22,11 @@ const columnsToShow = computed(() => page.auth.user?.resolved_settings?.departur
const showColumn = (column: string) => columnsToShow.value.includes(column)
const allHeaders = [
{ title: '', key: 'airline', sortable: true },
{ title: '', key: 'airline', sortable: true, resizable: false},
{ title: 'FLIGHT', key: 'flight_number', sortable: true },
{ title: 'AIRLINE', key: 'airline.name', sortable: true},
{ title: 'IATA', key: 'airline.iata_code', sortable: true},
{ title: 'ICAO', key: 'airline.icao_code', sortable: true},
{ title: 'FROM', key: 'departure_airport', sortable: true },
{ title: 'TO', key: 'arrival_airport', sortable: true },
{ title: 'DATE', key: 'departure_date', sortable: true },
@@ -31,9 +34,16 @@ const allHeaders = [
{ title: 'ARRIVE', key: 'arrival_time', sortable: false },
{ title: 'DURATION', key: 'duration', sortable: true },
{ title: 'DISTANCE', key: 'distance', sortable: true },
{ title: 'MANUFACTURER', key: 'aircraft.manufacturer_code', sortable: true },
{ title: 'MODEL', key: 'aircraft.model_full_name', sortable: true },
{ title: 'AIRCRAFT', key: 'aircraft.display_name_short', sortable: true },
{ title: 'AIRCRAFT', key: 'aircraft', sortable: true },
{ title: 'REG', key: 'registration', sortable: true },
{ title: 'CLASS', key: 'flight_class', sortable: true },
{ title: 'CLASS', key: 'class_seat_combined', sortable: true },
{ title: 'SEAT TYPE', key: 'seat_type_id', sortable: true },
{ title: 'SEAT NO.', key: 'seat_number', sortable: true },
{ title: 'REASON', key: 'flight_reason_id', sortable: true },
{ title: '', key: 'actions', sortable: false },
]
@@ -43,16 +53,18 @@ const headers = computed(() =>
const CLASS_ORDER: Record<string, number> = {
'Unspecified': 0,
'Economy': 1,
'Premium Economy': 2,
'Business': 3,
'First': 4,
'Private': 5,
'Crew' : 6,
'General Aviation': 1,
'Economy': 2,
'Premium Economy': 3,
'Business': 4,
'First': 5,
'Private': 6,
'Crew' : 7,
}
const customKeySort = {
class_seat_combined: (a: Flight['flight_class'], b: Flight['flight_class']) => (CLASS_ORDER[a?.name ?? ''] ?? -1) - (CLASS_ORDER[b?.name ?? ''] ?? -1),
flight_class: (a: Flight['flight_class'], b: Flight['flight_class']) => (CLASS_ORDER[a?.name ?? ''] ?? -1) - (CLASS_ORDER[b?.name ?? ''] ?? -1),
class_seat_combined: (a: Flight['class_seat_combined'], b: Flight['class_seat_combined']) => (CLASS_ORDER[a] ?? -1) - (CLASS_ORDER[b] ?? -1),
airline: (a: Flight['airline'], b: Flight['airline']) => (a?.iata_code ?? '').localeCompare(b?.iata_code ?? ''),
aircraft: (a: Flight['aircraft'], b: Flight['aircraft']) => (a?.designator ?? '').localeCompare(b?.designator ?? ''),
duration: (a: any, b: any) => (a ?? 0) - (b ?? 0),
@@ -25,6 +25,21 @@ const props = defineProps<{
const page = usePage<SharedProps>()
const reasonBadgeVariant = (reason: string) => {
switch (reason) {
case 'No Particular Reason':
return 'economy'
case 'Pleasure':
return 'generic'
case 'Business':
return 'business'
case 'Crew':
return 'crew'
case 'Visiting Friends / Relatives':
return 'general_aviation'
}
}
const showColumn = (column: string) => props.columnsToShow.includes(column)
</script>
@@ -50,6 +65,19 @@ const showColumn = (column: string) => props.columnsToShow.includes(column)
</div>
</td>
<td v-if="showColumn('airline.name')" class="v-data-table__td">
<Mono >{{ flight.airline?.name }}</Mono>
</td>
<td v-if="showColumn('airline.iata_code')" class="v-data-table__td ">
<Mono muted small >{{ flight.airline?.iata_code }}</Mono>
</td>
<td v-if="showColumn('airline.icao_code')" class="v-data-table__td ">
<Mono muted small>{{ flight.airline?.icao_code }}</Mono>
</td>
<td v-if="showColumn('departure_airport')" class="v-data-table__td">
<AirportToolTip :airport="flight.departure_airport">
<Mono class="iata">{{ flight.departure_airport.display_code }}</Mono><br/>
@@ -89,6 +117,21 @@ const showColumn = (column: string) => props.columnsToShow.includes(column)
</Mono>
</td>
<td v-if="showColumn('aircraft.manufacturer_code')" class="v-data-table__td aircraft-cell">
<Mono muted small>{{ flight.aircraft?.manufacturer_code }}</Mono>
</td>
<td v-if="showColumn('aircraft.model_full_name')" class="v-data-table__td aircraft-cell">
<Mono muted small>{{ flight.aircraft?.model_full_name }}</Mono>
</td>
<td v-if="showColumn('aircraft.display_name_short')" class="v-data-table__td aircraft-cell">
<AircraftToolTip v-if="flight.aircraft" :aircraft="flight.aircraft" :flight="flight">
<Mono muted small>{{ flight.aircraft?.display_name_short }}</Mono>
</AircraftToolTip>
</td>
<td v-if="showColumn('aircraft')" class="v-data-table__td aircraft-cell">
<AircraftToolTip v-if="flight.aircraft" :aircraft="flight.aircraft" :flight="flight">
<Mono muted small>{{ flight.aircraft?.designator }}</Mono>
@@ -99,6 +142,22 @@ const showColumn = (column: string) => props.columnsToShow.includes(column)
<Mono muted smaller v-if="flight.aircraft_registration">{{ flight.aircraft_registration }}</Mono>
</td>
<td v-if="showColumn('flight_class')" class="v-data-table__td class-badges-cell">
<FlightClassBadge :flight="flight" />
</td>
<td v-if="showColumn('seat_type_id')" class="v-data-table__td class-badges-cell">
<InlineBadge v-if="flight.seat_type?.name && flight.seat_type?.name !== 'Unassigned'" variant="economy">{{ flight.seat_type?.name }}</InlineBadge>
</td>
<td v-if="showColumn('seat_number')" class="v-data-table__td class-badges-cell">
<InlineBadge v-if="flight.seat_number" variant="economy">{{ flight.seat_number }}</InlineBadge>
</td>
<td v-if="showColumn('flight_reason_id')" class="v-data-table__td class-badges-cell">
<InlineBadge v-if="flight.flight_reason" :variant="reasonBadgeVariant(flight.flight_reason.name)">{{ flight.flight_reason?.name.replace('Visiting Friends / Relatives', 'VFR') }}</InlineBadge>
</td>
<td v-if="showColumn('class_seat_combined')" class="v-data-table__td class-badges-cell">
<span class="class-cell">
<CrewTooltip v-if="flight.flight_reason?.name == 'Crew'" :crew-type="flight.crew_type!">
@@ -89,6 +89,7 @@ function timeAgo(dateStr: string): string {
overflow: hidden;
}
.card-top {
display: flex;
align-items: center;
@@ -1,10 +1,22 @@
<script setup lang="ts">
import { Link, usePage } from "@inertiajs/vue3"
import { SharedProps } from "@/Types/types"
const page = usePage<SharedProps>().props
const year = new Date().getFullYear()
</script>
<template>
<footer class="glass">
&copy; FlightsGoneBy. All rights reserved.
<span class="footer-copyright">
&copy; {{ year }} FlightsGoneBy
</span>
<span class="footer-links">
<Link v-if="page.auth.user" :href="route('support')" class="footer-link">
Support
</Link>
</span>
</footer>
</template>
@@ -15,6 +27,50 @@ footer {
min-height: 32px;
display: flex;
align-items: center;
justify-content: center;
justify-content: space-between;
padding: 0 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.footer-copyright {
font-family: 'Share Tech Mono', monospace;
font-size: 0.68rem;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #556;
}
.footer-links {
display: flex;
align-items: center;
gap: 1rem;
}
.footer-link {
font-family: 'Share Tech Mono', monospace;
font-size: 0.68rem;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #778;
text-decoration: none;
transition: color 0.15s ease;
}
.footer-link:hover {
color: #ffc107;
}
@media (max-width: 600px) {
footer {
padding: 0 1rem;
}
.footer-copyright {
font-size: 0.6rem;
}
.footer-link {
font-size: 0.6rem;
}
}
</style>
@@ -35,17 +35,36 @@ onUnmounted(() => document.removeEventListener('click', handleClickOutside))
<!-- Desktop nav -->
<nav class="nav-desktop">
<template v-if="!page.props.auth?.user">
<Link :href="route('login')" class="nav-link">Log In</Link>
<Link :href="route('register')" class="nav-link nav-link--highlight">Register</Link>
<Link :href="route('login')" class="nav-link">
<i class="mdi mdi-login" aria-hidden="true" />
Log In
</Link>
<Link :href="route('register')" class="nav-link nav-link--highlight">
<i class="mdi mdi-account-plus" aria-hidden="true" />
Register
</Link>
</template>
<template v-else>
<Link :href="route('flights.add')" class="nav-link">Add Flight</Link>
<Link :href="route('profile.view', { user: page.props.auth?.user.name })" class="nav-link">Profile</Link>
<Link :href="route('feed')" class="nav-link">Feed</Link>
<Link v-if="page.props.auth.roles.includes('admin')" :href="route('admin.dashboard')" class="nav-link">Admin</Link>
<Link :href="route('flights.add')" class="nav-link">
<i class="mdi mdi-airplane-plus" aria-hidden="true" />
Add Flight
</Link>
<Link :href="route('profile.view', { user: page.props.auth?.user.name })" class="nav-link">
<i class="mdi mdi-account" aria-hidden="true" />
Profile
</Link>
<Link :href="route('feed')" class="nav-link">
<i class="mdi mdi-timeline-text" aria-hidden="true" />
Feed
</Link>
<Link v-if="page.props.auth.roles.includes('admin')" :href="route('admin.dashboard')" class="nav-link">
<i class="mdi mdi-shield-account" aria-hidden="true" />
Admin
</Link>
<div class="dropdown" ref="dropdownRef">
<button class="nav-link dropdown-trigger" @click.stop="dropdownOpen = !dropdownOpen">
<i class="mdi mdi-account-circle" aria-hidden="true" />
{{ page.props.auth.user.name }}
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
@@ -53,10 +72,24 @@ onUnmounted(() => document.removeEventListener('click', handleClickOutside))
</svg>
</button>
<div v-if="dropdownOpen" class="dropdown-menu">
<Link :href="route('import.fr24')" class="dropdown-item">Import from FR24</Link>
<Link :href="route('user.settings')" class="dropdown-item">Settings</Link>
<Link :href="route('import.fr24')" class="dropdown-item">
<i class="mdi mdi-cloud-download" aria-hidden="true" />
Import from FR24
</Link>
<Link :href="route('user.settings')" class="dropdown-item">
<i class="mdi mdi-cog" aria-hidden="true" />
Settings
</Link>
<div class="dropdown-divider" />
<button class="dropdown-item dropdown-item--danger" @click="logout">Log Out</button>
<Link :href="route('support')" class="dropdown-item">
<i class="mdi mdi-lifebuoy" aria-hidden="true" />
Support
</Link>
<div class="dropdown-divider" />
<button class="dropdown-item dropdown-item--danger" @click="logout">
<i class="mdi mdi-logout" aria-hidden="true" />
Log Out
</button>
</div>
</div>
</template>
@@ -71,18 +104,47 @@ onUnmounted(() => document.removeEventListener('click', handleClickOutside))
<Transition name="slide">
<nav v-if="menuOpen" class="nav-mobile" @click.stop>
<template v-if="!page.props.auth?.user">
<Link :href="route('login')" class="nav-link" @click="menuOpen = false">Log In</Link>
<Link :href="route('register')" class="nav-link nav-link--highlight" @click="menuOpen = false">Register</Link>
<Link :href="route('login')" class="nav-link" @click="menuOpen = false">
<i class="mdi mdi-login" aria-hidden="true" />
Log In
</Link>
<Link :href="route('register')" class="nav-link nav-link--highlight" @click="menuOpen = false">
<i class="mdi mdi-account-plus" aria-hidden="true" />
Register
</Link>
</template>
<template v-else>
<span class="nav-greeting">Welcome, {{ page.props.auth.user.name }}</span>
<Link :href="route('flights.add')" class="nav-link" @click="menuOpen = false">Add Flight</Link>
<Link :href="route('profile.view', { user: page.props.auth.user.name })" class="nav-link" @click="menuOpen = false">Profile</Link>
<Link :href="route('feed')" class="nav-link nav-link" @click="menuOpen = false">Feed</Link>
<Link :href="route('import.fr24')" class="nav-link" @click="menuOpen = false">Import from FR24</Link>
<Link :href="route('user.settings')" class="nav-link" @click="menuOpen = false">Settings</Link>
<Link :href="route('flights.add')" class="nav-link" @click="menuOpen = false">
<i class="mdi mdi-airplane-plus" aria-hidden="true" />
Add Flight
</Link>
<Link :href="route('profile.view', { user: page.props.auth.user.name })" class="nav-link" @click="menuOpen = false">
<i class="mdi mdi-account" aria-hidden="true" />
Profile
</Link>
<Link :href="route('feed')" class="nav-link nav-link" @click="menuOpen = false">
<i class="mdi mdi-timeline-text" aria-hidden="true" />
Feed
</Link>
<Link :href="route('import.fr24')" class="nav-link" @click="menuOpen = false">
<i class="mdi mdi-cloud-download" aria-hidden="true" />
Import from FR24
</Link>
<Link :href="route('user.settings')" class="nav-link" @click="menuOpen = false">
<i class="mdi mdi-cog" aria-hidden="true" />
Settings
</Link>
<div class="dropdown-divider" />
<button class="nav-link nav-link--danger" @click="logout">Log Out</button>
<Link :href="route('support')" class="dropdown-item">
<i class="mdi mdi-lifebuoy" aria-hidden="true" />
Support
</Link>
<div class="dropdown-divider" />
<button class="nav-link nav-link--danger" @click="logout">
<i class="mdi mdi-logout" aria-hidden="true" />
Log Out
</button>
</template>
</nav>
</Transition>
@@ -121,7 +183,7 @@ header {
.nav-link {
display: flex;
align-items: center;
gap: 0.3em;
gap: 0.4em;
height: 100%;
padding: 0.3em 0.75em;
font-size: 0.875rem;
@@ -136,6 +198,12 @@ header {
transition: color 0.15s ease, background 0.15s ease;
}
.nav-link .mdi {
font-size: 1rem;
line-height: 1;
opacity: 0.8;
}
.nav-link:visited {
color: var(--text);
}
@@ -193,7 +261,9 @@ header {
}
.dropdown-item {
display: block;
display: flex;
align-items: center;
gap: 0.5em;
width: 100%;
padding: 0.4em 0.75em;
font-size: 0.875rem;
@@ -209,6 +279,12 @@ header {
transition: color 0.15s ease, background 0.15s ease;
}
.dropdown-item .mdi {
font-size: 1rem;
line-height: 1;
opacity: 0.8;
}
.dropdown-item:hover {
color: var(--accent);
background: rgba(56, 189, 248, 0.07);
@@ -0,0 +1,11 @@
<script setup lang="ts">
</script>
<template>
</template>
<style scoped>
</style>
+228
View File
@@ -0,0 +1,228 @@
<script setup lang="ts">
import {Head, Link, useForm, usePage} from '@inertiajs/vue3'
import MainLayout from "@/Layouts/MainLayout.vue";
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 {SharedProps} from "@/Types/types";
import {computed} from "vue";
defineOptions({ layout: MainLayout })
const page = usePage<SharedProps>().props;
const REASONS = [
{ value: 'general_feedback', label: 'General Feedback' },
{ value: 'bug_report', label: 'Bug Report' },
{ value: 'missing_data', label: 'Missing Data' },
]
const form = useForm({
reason: null as string | null,
name: page.auth.user?.name ?? '',
email: page.auth.user?.email ?? '',
message: '',
})
const rules = {
required: (v: string) => !!v || 'Required',
email: (v: string) => /.+@.+\..+/.test(v) || 'Enter a valid email',
}
const submitted = computed(() => !!page.flash.success)
const submit = () => {
form.post(route('support.store'), {
preserveScroll: true,
onSuccess: () => form.reset(),
})
}
</script>
<template>
<Panel>
<Head title="Support" />
<PanelHeader centered>Technical Support</PanelHeader>
<template v-if="!submitted">
<PanelSubHeader centered>
Please fill out this form or email <Link href="mailto:hello@flightsgoneby.com">hello@flightsgoneby.com</Link> for any feedback or technical support needed.
</PanelSubHeader>
<PanelSubHeader centered>
For missing airlines or airports, please include a link to Wikipedia page or airlines website if available.
</PanelSubHeader>
<v-form class="contact-form" @submit.prevent="submit">
<v-text-field
v-model="form.name"
label="Name"
:error-messages="form.errors.name"
variant="outlined"
class="contact-field"
/>
<v-text-field
v-model="form.email"
label="Email"
type="email"
readonly
:error-messages="form.errors.email"
variant="outlined"
class="contact-field"
/>
<v-select
v-model="form.reason"
:items="REASONS"
item-title="label"
item-value="value"
label="Contact Reason"
:rules="[rules.required]"
:error-messages="form.errors.reason"
variant="outlined"
class="contact-field"
/>
<v-textarea
v-model="form.message"
label="Message"
:rules="[rules.required]"
:error-messages="form.errors.message"
variant="outlined"
rows="5"
auto-grow
class="contact-field"
/>
<div class="contact-form-actions">
<v-btn
type="submit"
:loading="form.processing"
class="contact-form-submit"
elevation="0"
>
Send Message
</v-btn>
</div>
</v-form>
</template>
<div v-else class="contact-form-sent">
<i class="mdi mdi-check-circle-outline contact-form-sent-icon" aria-hidden="true" />
<p class="contact-form-sent-title">Message Sent</p>
<p class="contact-form-sent-body">
{{ page.flash.success }} We'll get back to you as soon as we can.
</p>
</div>
</Panel>
</template>
<style scoped>
.contact-form {
color: #c8cdd8;
}
.contact-form-header {
margin-bottom: 1.75rem;
}
.contact-form-eyebrow {
display: block;
font-family: 'Share Tech Mono', monospace;
font-size: 0.68rem;
letter-spacing: 0.22em;
color: #ffc107;
margin-bottom: 0.4rem;
}
.contact-form-title {
font-family: 'Barlow', sans-serif;
font-weight: 600;
font-size: 1.5rem;
color: #e6e9f0;
margin: 0;
}
.contact-field {
margin-bottom: 0.25rem;
}
:deep(.contact-field .v-field) {
background: rgba(255, 255, 255, 0.02);
border-radius: 4px;
}
:deep(.contact-field .v-field__outline) {
color: rgba(255, 255, 255, 0.12) !important;
}
:deep(.contact-field.v-input--focused .v-field__outline) {
color: #ffc107 !important;
}
:deep(.contact-field .v-label) {
font-family: 'Share Tech Mono', monospace;
font-size: 0.75rem;
letter-spacing: 0.08em;
color: #778 !important;
}
:deep(.contact-field .v-field__input) {
color: #c8cdd8 !important;
font-family: 'Barlow', sans-serif;
}
.contact-form-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 1rem;
margin-top: 1rem;
}
.contact-form-submit {
background: #ffc107 !important;
color: #14161c !important;
font-family: 'Share Tech Mono', monospace;
font-size: 0.72rem;
letter-spacing: 0.14em;
text-transform: uppercase;
border-radius: 4px;
padding: 0 1.5rem !important;
}
.contact-form-submit:hover {
background: #ffcd38 !important;
}
.contact-form-sent {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
padding: 3rem 1rem;
color: #c8cdd8;
}
.contact-form-sent-icon {
font-size: 2.5rem;
color: #6fbf73;
margin-bottom: 1rem;
}
.contact-form-sent-title {
font-family: 'Share Tech Mono', monospace;
font-size: 0.85rem;
letter-spacing: 0.16em;
text-transform: uppercase;
color: #e6e9f0;
margin: 0 0 0.75rem;
}
.contact-form-sent-body {
max-width: 360px;
font-size: 0.9rem;
color: #9099ab;
margin: 0;
}
</style>
+9 -2
View File
@@ -93,6 +93,7 @@ const { data: following, loading: followingLoading } = useApiResource<User[]>('/
@media (max-width: 768px) {
.feed-page {
width: 100%;
padding: 0;
}
}
@@ -152,17 +153,23 @@ const { data: following, loading: followingLoading } = useApiResource<User[]>('/
/* GRID: following sidebar + condensed feed */
.feed-grid {
display: grid;
grid-template-columns: 240px 1fr;
grid-template-columns: 240px minmax(0, 1fr);
gap: 2rem;
align-items: start;
min-width: 0;
}
@media (max-width: 768px) {
.feed-grid {
grid-template-columns: 1fr;
grid-template-columns: minmax(0, 1fr);
}
}
.following-box,
.feed-condensed {
min-width: 0;
}
.following-box {
border: 1px solid rgba(255, 255, 255, 0.1);
padding: 1rem;
@@ -84,9 +84,9 @@ const generationGroups = computed(() =>
</p>
<ul>
<li><b>-100</b> - It was never that popular, and is no longer in commercial service anywhere. This is what renders the challenge impossible today.</li>
<li><b>-200</b> - Retired from Western fleets. A handful still fly in Africa and parts of Latin America on gravel-strip routes.</li>
<li><b>-300 / 737-400 / 737-500</b> - Rare but doable with some creative routing.</li>
<li><b>-600</b> - Much like it's Airbus A318 Equivalent, it sold poorly but is still in operation in Algeria and Canada.</li>
<li><b>-200</b> - Retired from Western fleets. A handful still fly in Zimbabwe, Venezuela and maybe Canada</li>
<li><b>-300 / -400 / -500</b> - Rare but doable with some creative routing.</li>
<li><b>-600</b> - Much like it's Airbus A318 Equivalent, it sold poorly but is still in operation. Air Algerie is probably your best bet..</li>
<li><b>Max 7</b> - Not possible to fly yet due to lack of certification but should hopefully become common soon enough!</li>
</ul>
</Panel>
@@ -62,8 +62,8 @@ const unlocked = computed(() => {
<VAlert type="info" v-if="loggedInUser?.id !== user.id && loggedInUser">
You are viewing {{user.name}}'s progress in this achievement. If you would like to see your progress,
<Link :href="route('profile.achievement', {user: loggedInUser.name, achievement: achievement.internal_name})">please click here</Link>.
You are viewing {{user.name}}'s progress in this achievement. If you would like to see your progress, please
<Link :href="route('profile.achievement', {user: loggedInUser.name, achievement: achievement.internal_name})"><VBtn variant="flat">click here.</VBtn></Link>
</VAlert>
+1
View File
@@ -307,6 +307,7 @@ export interface Flight {
region_range: RegionRange
livery_url?: string
user?: User | null
class_seat_combined: number
}
+1
View File
@@ -17,6 +17,7 @@
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="FlightsGoneBy">
<script defer src="https://stats.dredgy.au/script.js" data-website-id="70a7276c-bdd3-4833-b286-4962ab28b5b5"></script>
<link rel="apple-touch-startup-image" media="screen and (device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/img/logos/apple-splash-portrait-2048x2732.png">
<link rel="apple-touch-startup-image" media="screen and (device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="/img/logos/apple-splash-landscape-2732x2048.png">
<link rel="apple-touch-startup-image" media="screen and (device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/img/logos/apple-splash-portrait-1668x2388.png">
+33 -275
View File
@@ -1,297 +1,55 @@
/* Base */
body,
body *:not(html):not(style):not(br):not(tr):not(code) {
box-sizing: border-box;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif,
'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
position: relative;
}
/* Body */
body {
-webkit-text-size-adjust: none;
background-color: #ffffff;
color: #52525b;
height: 100%;
line-height: 1.4;
margin: 0;
padding: 0;
width: 100% !important;
}
p,
ul,
ol,
blockquote {
line-height: 1.4;
text-align: start;
}
a {
color: #18181b;
}
a img {
border: none;
}
/* Typography */
h1 {
color: #18181b;
font-size: 18px;
font-weight: bold;
margin-top: 0;
text-align: start;
}
h2 {
font-size: 16px;
font-weight: bold;
margin-top: 0;
text-align: start;
}
h3 {
font-size: 14px;
font-weight: bold;
margin-top: 0;
text-align: left;
}
p {
font-size: 16px;
line-height: 1.5em;
margin-top: 0;
text-align: left;
}
p.sub {
font-size: 12px;
}
img {
max-width: 100%;
}
/* Layout */
.wrapper {
-premailer-cellpadding: 0;
-premailer-cellspacing: 0;
-premailer-width: 100%;
background-color: #fafafa;
margin: 0;
padding: 0;
width: 100%;
}
.content {
-premailer-cellpadding: 0;
-premailer-cellspacing: 0;
-premailer-width: 100%;
margin: 0;
padding: 0;
width: 100%;
background-color: #f4f6fb;
color: #4a5568;
}
/* Header */
.header {
padding: 25px 0;
background-color: rgb(0, 12, 41);
padding: 32px 24px;
text-align: center;
border-radius: 8px 8px 0 0;
}
.header a {
color: #18181b;
font-size: 19px;
font-weight: bold;
text-decoration: none;
}
/* Logo */
.logo {
height: 75px;
margin-top: 15px;
margin-bottom: 10px;
max-height: 75px;
width: 75px;
}
/* Body */
.body {
-premailer-cellpadding: 0;
-premailer-cellspacing: 0;
-premailer-width: 100%;
background-color: #fafafa;
border-bottom: 1px solid #fafafa;
border-top: 1px solid #fafafa;
margin: 0;
padding: 0;
width: 100%;
}
.inner-body {
-premailer-cellpadding: 0;
-premailer-cellspacing: 0;
-premailer-width: 570px;
/* Content wrapper */
.wrapper {
background-color: #ffffff;
border-color: #e4e4e7;
border-radius: 4px;
border-width: 1px;
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
margin: 0 auto;
padding: 0;
width: 570px;
}
.inner-body a {
word-break: break-all;
}
/* Subcopy */
.subcopy {
border-top: 1px solid #e4e4e7;
margin-top: 25px;
padding-top: 25px;
}
.subcopy p {
font-size: 14px;
}
/* Footer */
.footer {
-premailer-cellpadding: 0;
-premailer-cellspacing: 0;
-premailer-width: 570px;
margin: 0 auto;
padding: 0;
text-align: center;
width: 570px;
}
.footer p {
color: #a1a1aa;
font-size: 12px;
text-align: center;
}
.footer a {
color: #a1a1aa;
text-decoration: underline;
}
/* Tables */
.table table {
-premailer-cellpadding: 0;
-premailer-cellspacing: 0;
-premailer-width: 100%;
margin: 30px auto;
width: 100%;
}
.table th {
border-bottom: 1px solid #e4e4e7;
margin: 0;
padding-bottom: 8px;
}
.table td {
color: #52525b;
font-size: 15px;
line-height: 18px;
margin: 0;
padding: 10px 0;
border: 1px solid #e2e8f0;
border-top: none;
border-radius: 0 0 8px 8px;
}
.content-cell {
max-width: 100vw;
padding: 32px;
}
/* Buttons */
.action {
-premailer-cellpadding: 0;
-premailer-cellspacing: 0;
-premailer-width: 100%;
margin: 30px auto;
padding: 0;
text-align: center;
width: 100%;
float: unset;
}
.button {
-webkit-text-size-adjust: none;
border-radius: 4px;
color: #fff;
display: inline-block;
overflow: hidden;
text-decoration: none;
}
/* Button — outlined so it reads on light or dark backgrounds */
.button-blue,
.button,
.button-primary {
background-color: #18181b;
border-bottom: 8px solid #18181b;
border-left: 18px solid #18181b;
border-right: 18px solid #18181b;
border-top: 8px solid #18181b;
background-color: transparent;
border: 2px solid #38bdf8;
border-radius: 6px;
color: #0c4a6e !important;
display: inline-block;
font-weight: 600;
padding: 12px 24px;
text-align: center;
text-decoration: none;
white-space: nowrap;
}
.button-green,
.button-success {
background-color: #16a34a;
border-bottom: 8px solid #16a34a;
border-left: 18px solid #16a34a;
border-right: 18px solid #16a34a;
border-top: 8px solid #16a34a;
/* Footer */
.footer {
background-color: rgb(0, 12, 41);
color: #94a3b8;
padding: 24px;
border-radius: 8px;
margin-top: 24px;
}
.button-red,
.button-error {
background-color: #dc2626;
border-bottom: 8px solid #dc2626;
border-left: 18px solid #dc2626;
border-right: 18px solid #dc2626;
border-top: 8px solid #dc2626;
}
/* Panels */
.panel {
border-left: #18181b solid 4px;
margin: 21px 0;
}
.panel-content {
background-color: #fafafa;
color: #52525b;
padding: 16px;
}
.panel-content p {
color: #52525b;
}
.panel-item {
padding: 0;
}
.panel-item p:last-of-type {
margin-bottom: 0;
padding-bottom: 0;
}
/* Utilities */
.break-all {
word-break: break-all;
.footer p {
color: #94a3b8;
font-size: 12px;
}
+9 -2
View File
@@ -6,6 +6,7 @@ use App\Http\Controllers\FlightController;
use App\Http\Controllers\FlightImportController;
use App\Http\Controllers\FollowerController;
use App\Http\Controllers\HomePageController;
use App\Http\Controllers\SupportFormController;
use App\Http\Controllers\UserProfileController;
use App\Http\Controllers\NotificationController;
use App\Http\Controllers\SearchController;
@@ -43,7 +44,7 @@ use Inertia\Inertia;
Route::middleware('auth')->group(function () {
Route::middleware(['auth', 'verified'])->group(function () {
Route::post('/push-subscriptions', function (Illuminate\Http\Request $request) {
$request->user()->updatePushSubscription(
@@ -71,6 +72,8 @@ use Inertia\Inertia;
Route::get('/import/fr24', [FlightImportController::class, 'showFr24Import'])->name('import.fr24');
Route::post('/import/save', [FlightImportController::class, 'save'])->name('import.save');
Route::get('/reconcile', [FlightImportController::class, 'reconcile'])->name('reconcile');;
Route::get('/settings/{category?}', [UserController::class, 'settings'])->name('user.settings');
@@ -91,7 +94,11 @@ use Inertia\Inertia;
});
Route::post('/import/save', [FlightImportController::class, 'save'])->name('import.save');
Route::middleware(['auth'])->group(function () {
Route::get('/support', [SupportFormController::class, 'view'])->name('support');
Route::post('/support', [SupportFormController::class, 'store'])->name('support.store');
});
//Search Routes