Add authentication, a public landing page, and guest data preview
Hand-rolled login/register/logout on Laravel's built-in Auth facade rather than Breeze/Jetstream, which scaffold Tailwind v3 config and would fight our existing Tailwind v4 CSS-first setup. Login/Register are Livewire components; logout is a plain POST route (auth-gated, CSRF-protected). Routing: "/" is now a public landing page describing the project; the sites list moved from "/" to "/sites" to make room for it. Data gating: App\Support\GuestPreview::paginate() forces page 1 and a 5-row page size for unauthenticated visitors on Sites, Discover, and a site's Pages/Backlinks tables, while total() still reflects the real match count — authenticated users get the existing full pagination unchanged. A shared guest-preview-notice component shows "N of M results, sign in to see all" and only renders when something is actually being hidden. Testing: pointed the test suite at a dedicated MySQL database (huginn_testing) instead of the default in-memory SQLite, since the existing fulltext index migration isn't SQLite-compatible — this app is MySQL-specific by now regardless. Added AuthFlowTest (register, login, wrong-password rejection, logout) and GuestPreviewTest (guest capped to a preview, authenticated sees everything), all passing. Also fixed a real bug the tests caught: request()->session() isn't reliably attached during Livewire's in-process test action calls; switched Login/Register to the session() helper, which resolves the session store directly and works in both contexts.
This commit is contained in:
m105
@@ -0,0 +1,11 @@
|
||||
@props(['paginator'])
|
||||
|
||||
@if ($paginator->total() > $paginator->count())
|
||||
<p class="mt-4 rounded-md bg-blue-50 px-4 py-3 text-sm text-blue-800 dark:bg-blue-950 dark:text-blue-300">
|
||||
Showing a preview ({{ $paginator->count() }} of {{ number_format($paginator->total()) }} results).
|
||||
<a href="{{ route('login') }}" class="font-medium underline">Sign in</a>
|
||||
or
|
||||
<a href="{{ route('register') }}" class="font-medium underline">create a free account</a>
|
||||
to see everything.
|
||||
</p>
|
||||
@endif
|
||||
@@ -12,11 +12,23 @@
|
||||
<body class="min-h-screen bg-white text-neutral-900 antialiased dark:bg-neutral-950 dark:text-neutral-100">
|
||||
<header class="border-b border-neutral-200 dark:border-neutral-800">
|
||||
<div class="mx-auto flex max-w-5xl items-center gap-6 px-4 py-4">
|
||||
<a href="{{ route('sites.index') }}" class="text-lg font-semibold">Huginn</a>
|
||||
<nav class="flex gap-4 text-sm">
|
||||
<a href="{{ route('home') }}" class="text-lg font-semibold">Huginn</a>
|
||||
<nav class="flex flex-1 gap-4 text-sm">
|
||||
<a href="{{ route('sites.index') }}" class="text-neutral-600 hover:text-neutral-900 dark:text-neutral-400 dark:hover:text-neutral-100">Sites</a>
|
||||
<a href="{{ route('discover') }}" class="text-neutral-600 hover:text-neutral-900 dark:text-neutral-400 dark:hover:text-neutral-100">Discover</a>
|
||||
</nav>
|
||||
<nav class="flex items-center gap-4 text-sm">
|
||||
@auth
|
||||
<span class="text-neutral-500">{{ auth()->user()->name }}</span>
|
||||
<form method="POST" action="{{ route('logout') }}">
|
||||
@csrf
|
||||
<button type="submit" class="text-neutral-600 hover:text-neutral-900 dark:text-neutral-400 dark:hover:text-neutral-100">Log out</button>
|
||||
</form>
|
||||
@else
|
||||
<a href="{{ route('login') }}" class="text-neutral-600 hover:text-neutral-900 dark:text-neutral-400 dark:hover:text-neutral-100">Log in</a>
|
||||
<a href="{{ route('register') }}" class="rounded-md bg-neutral-900 px-3 py-1.5 font-medium text-white hover:bg-neutral-700 dark:bg-white dark:text-neutral-900 dark:hover:bg-neutral-200">Sign up</a>
|
||||
@endauth
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -0,0 +1,27 @@
|
||||
<x-layouts.app>
|
||||
<div class="mx-auto max-w-3xl px-4 py-20 text-center">
|
||||
<h1 class="text-4xl font-bold tracking-tight">Find out who you're really competing with</h1>
|
||||
<p class="mt-4 text-lg text-neutral-600 dark:text-neutral-400">
|
||||
Huginn indexes the web using Common Crawl's public archive and helps you find competitors
|
||||
by product, location, and even the platform they're built on — e.g. "who sells honey with a
|
||||
<span class="whitespace-nowrap">.es</span> domain," or "which of my competitors run WordPress."
|
||||
</p>
|
||||
|
||||
<div class="mt-8 flex justify-center gap-4">
|
||||
@auth
|
||||
<a href="{{ route('discover') }}" class="rounded-md bg-neutral-900 px-5 py-2.5 text-sm font-medium text-white hover:bg-neutral-700 dark:bg-white dark:text-neutral-900 dark:hover:bg-neutral-200">Go to Discover</a>
|
||||
<a href="{{ route('sites.index') }}" class="rounded-md border border-neutral-300 px-5 py-2.5 text-sm font-medium hover:bg-neutral-50 dark:border-neutral-700 dark:hover:bg-neutral-900">Browse sites</a>
|
||||
@else
|
||||
<a href="{{ route('register') }}" class="rounded-md bg-neutral-900 px-5 py-2.5 text-sm font-medium text-white hover:bg-neutral-700 dark:bg-white dark:text-neutral-900 dark:hover:bg-neutral-200">Sign up free</a>
|
||||
<a href="{{ route('login') }}" class="rounded-md border border-neutral-300 px-5 py-2.5 text-sm font-medium hover:bg-neutral-50 dark:border-neutral-700 dark:hover:bg-neutral-900">Log in</a>
|
||||
@endauth
|
||||
</div>
|
||||
|
||||
@guest
|
||||
<p class="mt-10 text-sm text-neutral-500">
|
||||
Browsing without an account shows a limited preview of results —
|
||||
<a href="{{ route('register') }}" class="text-blue-600 hover:underline dark:text-blue-400">create a free account</a> to see everything.
|
||||
</p>
|
||||
@endguest
|
||||
</div>
|
||||
</x-layouts.app>
|
||||
@@ -0,0 +1,46 @@
|
||||
<div class="mx-auto max-w-sm px-4 py-16">
|
||||
<h1 class="text-2xl font-semibold">Log in</h1>
|
||||
|
||||
<form wire:submit="login" class="mt-6 space-y-4">
|
||||
<div>
|
||||
<label for="email" class="block text-sm font-medium text-neutral-700 dark:text-neutral-300">Email</label>
|
||||
<input
|
||||
type="email"
|
||||
id="email"
|
||||
wire:model="email"
|
||||
autofocus
|
||||
autocomplete="username"
|
||||
class="mt-1 w-full rounded-md border border-neutral-300 px-3 py-2 text-sm focus:border-neutral-500 focus:outline-none dark:border-neutral-700 dark:bg-neutral-900"
|
||||
>
|
||||
@error('email') <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="password" class="block text-sm font-medium text-neutral-700 dark:text-neutral-300">Password</label>
|
||||
<input
|
||||
type="password"
|
||||
id="password"
|
||||
wire:model="password"
|
||||
autocomplete="current-password"
|
||||
class="mt-1 w-full rounded-md border border-neutral-300 px-3 py-2 text-sm focus:border-neutral-500 focus:outline-none dark:border-neutral-700 dark:bg-neutral-900"
|
||||
>
|
||||
@error('password') <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
|
||||
</div>
|
||||
|
||||
<label class="flex items-center gap-2 text-sm text-neutral-600 dark:text-neutral-400">
|
||||
<input type="checkbox" wire:model="remember" class="rounded border-neutral-300 dark:border-neutral-700">
|
||||
Remember me
|
||||
</label>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
class="w-full rounded-md bg-neutral-900 px-4 py-2 text-sm font-medium text-white hover:bg-neutral-700 dark:bg-white dark:text-neutral-900 dark:hover:bg-neutral-200"
|
||||
>
|
||||
Log in
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<p class="mt-6 text-sm text-neutral-500">
|
||||
Don't have an account? <a href="{{ route('register') }}" class="text-blue-600 hover:underline dark:text-blue-400">Sign up</a>.
|
||||
</p>
|
||||
</div>
|
||||
@@ -0,0 +1,64 @@
|
||||
<div class="mx-auto max-w-sm px-4 py-16">
|
||||
<h1 class="text-2xl font-semibold">Create an account</h1>
|
||||
|
||||
<form wire:submit="register" class="mt-6 space-y-4">
|
||||
<div>
|
||||
<label for="name" class="block text-sm font-medium text-neutral-700 dark:text-neutral-300">Name</label>
|
||||
<input
|
||||
type="text"
|
||||
id="name"
|
||||
wire:model="name"
|
||||
autofocus
|
||||
autocomplete="name"
|
||||
class="mt-1 w-full rounded-md border border-neutral-300 px-3 py-2 text-sm focus:border-neutral-500 focus:outline-none dark:border-neutral-700 dark:bg-neutral-900"
|
||||
>
|
||||
@error('name') <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="email" class="block text-sm font-medium text-neutral-700 dark:text-neutral-300">Email</label>
|
||||
<input
|
||||
type="email"
|
||||
id="email"
|
||||
wire:model="email"
|
||||
autocomplete="username"
|
||||
class="mt-1 w-full rounded-md border border-neutral-300 px-3 py-2 text-sm focus:border-neutral-500 focus:outline-none dark:border-neutral-700 dark:bg-neutral-900"
|
||||
>
|
||||
@error('email') <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="password" class="block text-sm font-medium text-neutral-700 dark:text-neutral-300">Password</label>
|
||||
<input
|
||||
type="password"
|
||||
id="password"
|
||||
wire:model="password"
|
||||
autocomplete="new-password"
|
||||
class="mt-1 w-full rounded-md border border-neutral-300 px-3 py-2 text-sm focus:border-neutral-500 focus:outline-none dark:border-neutral-700 dark:bg-neutral-900"
|
||||
>
|
||||
@error('password') <p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p> @enderror
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="password_confirmation" class="block text-sm font-medium text-neutral-700 dark:text-neutral-300">Confirm password</label>
|
||||
<input
|
||||
type="password"
|
||||
id="password_confirmation"
|
||||
wire:model="password_confirmation"
|
||||
autocomplete="new-password"
|
||||
class="mt-1 w-full rounded-md border border-neutral-300 px-3 py-2 text-sm focus:border-neutral-500 focus:outline-none dark:border-neutral-700 dark:bg-neutral-900"
|
||||
>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
class="w-full rounded-md bg-neutral-900 px-4 py-2 text-sm font-medium text-white hover:bg-neutral-700 dark:bg-white dark:text-neutral-900 dark:hover:bg-neutral-200"
|
||||
>
|
||||
Sign up
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<p class="mt-6 text-sm text-neutral-500">
|
||||
Already have an account? <a href="{{ route('login') }}" class="text-blue-600 hover:underline dark:text-blue-400">Log in</a>.
|
||||
</p>
|
||||
</div>
|
||||
@@ -69,6 +69,12 @@
|
||||
</div>
|
||||
|
||||
<div class="mt-4">
|
||||
{{ $sites->links() }}
|
||||
@auth
|
||||
{{ $sites->links() }}
|
||||
@else
|
||||
@if ($hasQuery)
|
||||
<x-guest-preview-notice :paginator="$sites" />
|
||||
@endif
|
||||
@endauth
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -41,6 +41,10 @@
|
||||
</div>
|
||||
|
||||
<div class="mt-4">
|
||||
{{ $sites->links() }}
|
||||
@auth
|
||||
{{ $sites->links() }}
|
||||
@else
|
||||
<x-guest-preview-notice :paginator="$sites" />
|
||||
@endauth
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -62,7 +62,11 @@
|
||||
</div>
|
||||
|
||||
<div class="mt-4">
|
||||
{{ $pages->links() }}
|
||||
@auth
|
||||
{{ $pages->links() }}
|
||||
@else
|
||||
<x-guest-preview-notice :paginator="$pages" />
|
||||
@endauth
|
||||
</div>
|
||||
|
||||
<h2 class="mt-10 text-lg font-medium">
|
||||
@@ -127,7 +131,11 @@
|
||||
</div>
|
||||
|
||||
<div class="mt-4">
|
||||
{{ $backlinks->links() }}
|
||||
@auth
|
||||
{{ $backlinks->links() }}
|
||||
@else
|
||||
<x-guest-preview-notice :paginator="$backlinks" />
|
||||
@endauth
|
||||
</div>
|
||||
</div>
|
||||
</x-layouts.app>
|
||||
|
||||
Reference in New Issue
Block a user