spotters: fix random 404 on client navigation (random is a page load, not an endpoint shadowed by [slug]); square logo tiles everywhere
Some checks failed
Deploy production / deploy (push) Has been cancelled

This commit is contained in:
2026-10-25 13:07:26 +00:00
parent 45943543c2
commit cc34f5751b
19 changed files with 69 additions and 138 deletions

View File

@@ -45,20 +45,7 @@
</figure>
{/if}
<header class="mt-6 mb-8 flex items-center gap-5">
{#if b.logo}
<img
class="logo"
src={b.logo}
alt="{b.name} logo"
title="Logo: {b.logoAuthor ?? 'Wikimedia Commons'}{b.logoLicense
? ` (${b.logoLicense})`
: ''}"
width="72"
height="72"
/>
{:else}
<BrandBadge name={b.name} size="lg" />
{/if}
<BrandBadge name={b.name} logo={b.logo} size="lg" />
<div>
<h1 class="text-4xl font-semibold tracking-tight sm:text-5xl">{b.name}</h1>
<p class="mt-2 text-[var(--site-muted)]">
@@ -130,15 +117,6 @@
.hero figcaption a {
text-decoration: underline;
}
.logo {
width: 4.5rem;
height: 4.5rem;
object-fit: contain;
padding: 0.5rem;
border-radius: 1rem;
background: #fff;
border: 1px solid var(--site-border);
}
.grid {
display: grid;
gap: 0.75rem;

View File

@@ -0,0 +1,11 @@
import { redirect } from '@sveltejs/kit';
import { randomCar } from '#lib/server/cars.js';
import type { PageServerLoad } from './$types';
// A page load (not a +server.ts endpoint): the client router only knows page routes, so an
// endpoint here made client-side navigation fall through to the [brand] page and 404.
export const load: PageServerLoad = async ({ setHeaders }) => {
const car = await randomCar();
setHeaders({ 'cache-control': 'no-store' });
redirect(303, car ? `/trackers/cars/${car.brandSlug}/${car.slug}` : '/trackers/cars');
};

View File

@@ -0,0 +1 @@
<!-- Never rendered: the load always redirects to a random entry. -->

View File

@@ -1,9 +0,0 @@
import { redirect } from '@sveltejs/kit';
import { randomCar } from '#lib/server/cars.js';
import type { RequestHandler } from './$types';
export const GET: RequestHandler = async ({ setHeaders }) => {
const car = await randomCar();
setHeaders({ 'cache-control': 'no-store' });
redirect(303, car ? `/trackers/cars/${car.brandSlug}/${car.slug}` : '/trackers/cars');
};

View File

@@ -45,20 +45,7 @@
</figure>
{/if}
<header class="mt-6 mb-8 flex items-center gap-5">
{#if b.logo}
<img
class="logo"
src={b.logo}
alt="{b.name} logo"
title="Logo: {b.logoAuthor ?? 'Wikimedia Commons'}{b.logoLicense
? ` (${b.logoLicense})`
: ''}"
width="72"
height="72"
/>
{:else}
<BrandBadge name={b.name} size="lg" />
{/if}
<BrandBadge name={b.name} logo={b.logo} size="lg" />
<div>
<h1 class="text-4xl font-semibold tracking-tight sm:text-5xl">{b.name}</h1>
{#if b.fullName && b.fullName !== b.name}<p class="mt-1 text-sm text-[var(--site-muted)]">
@@ -134,15 +121,6 @@
.hero figcaption a {
text-decoration: underline;
}
.logo {
width: 4.5rem;
height: 4.5rem;
object-fit: contain;
padding: 0.5rem;
border-radius: 1rem;
background: #fff;
border: 1px solid var(--site-border);
}
.grid {
display: grid;
gap: 0.75rem;

View File

@@ -0,0 +1,11 @@
import { redirect } from '@sveltejs/kit';
import { randomPlane } from '#lib/server/planes.js';
import type { PageServerLoad } from './$types';
// A page load (not a +server.ts endpoint): the client router only knows page routes, so an
// endpoint here made client-side navigation fall through to the [maker] page and 404.
export const load: PageServerLoad = async ({ setHeaders }) => {
const plane = await randomPlane();
setHeaders({ 'cache-control': 'no-store' });
redirect(303, plane ? `/trackers/planes/${plane.makerSlug}/${plane.slug}` : '/trackers/planes');
};

View File

@@ -0,0 +1 @@
<!-- Never rendered: the load always redirects to a random entry. -->

View File

@@ -1,9 +0,0 @@
import { redirect } from '@sveltejs/kit';
import { randomPlane } from '#lib/server/planes.js';
import type { RequestHandler } from './$types';
export const GET: RequestHandler = async ({ setHeaders }) => {
const plane = await randomPlane();
setHeaders({ 'cache-control': 'no-store' });
redirect(303, plane ? `/trackers/planes/${plane.makerSlug}/${plane.slug}` : '/trackers/planes');
};

View File

@@ -45,20 +45,7 @@
</figure>
{/if}
<header class="mt-6 mb-8 flex items-center gap-5">
{#if b.logo}
<img
class="logo"
src={b.logo}
alt="{b.name} logo"
title="Logo: {b.logoAuthor ?? 'Wikimedia Commons'}{b.logoLicense
? ` (${b.logoLicense})`
: ''}"
width="72"
height="72"
/>
{:else}
<BrandBadge name={b.name} size="lg" />
{/if}
<BrandBadge name={b.name} logo={b.logo} size="lg" />
<div>
<h1 class="text-4xl font-semibold tracking-tight sm:text-5xl">{b.name}</h1>
{#if b.fullName && b.fullName !== b.name}<p class="mt-1 text-sm text-[var(--site-muted)]">
@@ -134,15 +121,6 @@
.hero figcaption a {
text-decoration: underline;
}
.logo {
width: 4.5rem;
height: 4.5rem;
object-fit: contain;
padding: 0.5rem;
border-radius: 1rem;
background: #fff;
border: 1px solid var(--site-border);
}
.grid {
display: grid;
gap: 0.75rem;

View File

@@ -44,20 +44,7 @@
</figure>
{/if}
<header class="mt-6 mb-8 flex items-center gap-5">
{#if b.logo}
<img
class="logo"
src={b.logo}
alt="{b.name} logo"
title="Logo: {b.logoAuthor ?? 'Wikimedia Commons'}{b.logoLicense
? ` (${b.logoLicense})`
: ''}"
width="72"
height="72"
/>
{:else}
<BrandBadge name={b.name} size="lg" />
{/if}
<BrandBadge name={b.name} logo={b.logo} size="lg" />
<div>
<h1 class="text-4xl font-semibold tracking-tight sm:text-5xl">{b.name}</h1>
{#if b.fullName && b.fullName !== b.name}<p class="mt-1 text-sm text-[var(--site-muted)]">
@@ -131,15 +118,6 @@
.hero figcaption a {
text-decoration: underline;
}
.logo {
width: 4.5rem;
height: 4.5rem;
object-fit: contain;
padding: 0.5rem;
border-radius: 1rem;
background: #fff;
border: 1px solid var(--site-border);
}
.grid {
display: grid;
gap: 0.75rem;

View File

@@ -0,0 +1,11 @@
import { redirect } from '@sveltejs/kit';
import { randomTrain } from '#lib/server/trains.js';
import type { PageServerLoad } from './$types';
// A page load (not a +server.ts endpoint): the client router only knows page routes, so an
// endpoint here made client-side navigation fall through to the [maker] page and 404.
export const load: PageServerLoad = async ({ setHeaders }) => {
const train = await randomTrain();
setHeaders({ 'cache-control': 'no-store' });
redirect(303, train ? `/trackers/trains/${train.makerSlug}/${train.slug}` : '/trackers/trains');
};

View File

@@ -0,0 +1 @@
<!-- Never rendered: the load always redirects to a random entry. -->

View File

@@ -1,9 +0,0 @@
import { redirect } from '@sveltejs/kit';
import { randomTrain } from '#lib/server/trains.js';
import type { RequestHandler } from './$types';
export const GET: RequestHandler = async ({ setHeaders }) => {
const train = await randomTrain();
setHeaders({ 'cache-control': 'no-store' });
redirect(303, train ? `/trackers/trains/${train.makerSlug}/${train.slug}` : '/trackers/trains');
};

View File

@@ -1,8 +1,10 @@
import { redirect } from '@sveltejs/kit';
import { randomSpecies } from '#lib/server/wildlife.js';
import type { RequestHandler } from './$types';
import type { PageServerLoad } from './$types';
export const GET: RequestHandler = async ({ setHeaders, url }) => {
// A page load (not a +server.ts endpoint): the client router only knows page routes, so an
// endpoint here made client-side navigation fall through to the [group] page and 404.
export const load: PageServerLoad = async ({ setHeaders, url }) => {
const group = (url.searchParams.get('group') ?? '').replace(/[^a-z0-9-]/g, '') || undefined;
const s = await randomSpecies(group);
setHeaders({ 'cache-control': 'no-store' });

View File

@@ -0,0 +1 @@
<!-- Never rendered: the load always redirects to a random entry. -->