Add first pass of the web interface: Sites index + detail, via Livewire

Home page is now a Livewire-powered, searchable/paginated Site list (search by domain) instead of the stock Laravel welcome page. Clicking a site goes to a plain controller-rendered detail page listing its pages. Shared layout at resources/views/components/layouts/app.blade.php.
2026-07-22 21:16:17 +03:00
parent 4dd5a3c17d
commit f15eb5aec1
10 changed files with 1876 additions and 228 deletions
@@ -0,0 +1,16 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Models\Site;
+use Illuminate\Contracts\View\View;
+
+class SiteController extends Controller
+{
+    public function show(Site $site): View
+    {
+        $pages = $site->pages()->orderBy('url')->paginate(50);
+
+        return view('sites.show', ['site' => $site, 'pages' => $pages]);
+    }
+}
@@ -0,0 +1,38 @@
+<?php
+
+namespace App\Livewire\Sites;
+
+use App\Models\Site;
+use Illuminate\Contracts\View\View;
+use Livewire\Attributes\Layout;
+use Livewire\Attributes\Url;
+use Livewire\Component;
+use Livewire\WithPagination;
+
+#[Layout('components.layouts.app')]
+class Index extends Component
+{
+    use WithPagination;
+
+    #[Url(as: 'q', history: true)]
+    public string $search = '';
+
+    public function updatingSearch(): void
+    {
+        $this->resetPage();
+    }
+
+    public function render(): View
+    {
+        $sites = Site::query()
+            ->withCount('pages')
+            ->when(
+                $this->search !== '',
+                fn ($query) => $query->where('domain', 'like', '%'.$this->search.'%')
+            )
+            ->orderBy('domain')
+            ->paginate(25);
+
+        return view('livewire.sites.index', ['sites' => $sites]);
+    }
+}
@@ -8,7 +8,8 @@
    "require": {
        "php": "^8.3",
        "laravel/framework": "^13.8",
-        "laravel/tinker": "^3.0"
+        "laravel/tinker": "^3.0",
+        "livewire/livewire": "^4.3"
    },
    "require-dev": {
        "fakerphp/faker": "^1.23",
@@ -4,7 +4,7 @@
        "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
        "This file is @generated automatically"
    ],
-    "content-hash": "36793882908b6cbdd344b5a4840231db",
+    "content-hash": "15d459f8e83fdae144d5144f811f3d68",
    "packages": [
        {
            "name": "brick/math",
@@ -2032,6 +2032,82 @@
            ],
            "time": "2026-03-08T20:05:35+00:00"
        },
+        {
+            "name": "livewire/livewire",
+            "version": "v4.3.3",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/livewire/livewire.git",
+                "reference": "8021f2561865c4c297a3bfca37212a99034377e7"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/livewire/livewire/zipball/8021f2561865c4c297a3bfca37212a99034377e7",
+                "reference": "8021f2561865c4c297a3bfca37212a99034377e7",
+                "shasum": ""
+            },
+            "require": {
+                "illuminate/database": "^10.0|^11.0|^12.0|^13.0",
+                "illuminate/routing": "^10.0|^11.0|^12.0|^13.0",
+                "illuminate/support": "^10.0|^11.0|^12.0|^13.0",
+                "illuminate/validation": "^10.0|^11.0|^12.0|^13.0",
+                "laravel/prompts": "^0.1.24|^0.2|^0.3",
+                "league/mime-type-detection": "^1.9",
+                "php": "^8.1",
+                "symfony/console": "^6.0|^7.0|^8.0",
+                "symfony/http-kernel": "^6.2|^7.0|^8.0"
+            },
+            "require-dev": {
+                "calebporzio/sushi": "^2.1",
+                "laravel/framework": "^10.15.0|^11.0|^12.0|^13.0",
+                "mockery/mockery": "^1.3.1",
+                "orchestra/testbench": "^8.21.0|^9.0|^10.0|^11.0",
+                "orchestra/testbench-dusk": "^8.24|^9.1|^10.0|^11.0",
+                "phpunit/phpunit": "^10.4|^11.5|^12.5",
+                "psy/psysh": "^0.11.22|^0.12"
+            },
+            "type": "library",
+            "extra": {
+                "laravel": {
+                    "aliases": {
+                        "Livewire": "Livewire\\Livewire"
+                    },
+                    "providers": [
+                        "Livewire\\LivewireServiceProvider"
+                    ]
+                }
+            },
+            "autoload": {
+                "files": [
+                    "src/helpers.php"
+                ],
+                "psr-4": {
+                    "Livewire\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Caleb Porzio",
+                    "email": "calebporzio@gmail.com"
+                }
+            ],
+            "description": "A front-end framework for Laravel.",
+            "support": {
+                "issues": "https://github.com/livewire/livewire/issues",
+                "source": "https://github.com/livewire/livewire/tree/v4.3.3"
+            },
+            "funding": [
+                {
+                    "url": "https://github.com/livewire",
+                    "type": "github"
+                }
+            ],
+            "time": "2026-06-27T03:16:11+00:00"
+        },
        {
            "name": "monolog/monolog",
            "version": "3.10.0",
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
+    <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+
+        <title>{{ isset($title) ? $title.' — ' : '' }}{{ config('app.name', 'Huginn') }}</title>
+
+        @vite(['resources/css/app.css', 'resources/js/app.js'])
+        @livewireStyles
+    </head>
+    <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 px-4 py-4">
+                <a href="{{ route('sites.index') }}" class="text-lg font-semibold">Huginn</a>
+            </div>
+        </header>
+
+        <main>
+            {{ $slot }}
+        </main>
+
+        @livewireScripts
+    </body>
+</html>
@@ -0,0 +1,46 @@
+<div class="mx-auto max-w-5xl px-4 py-8">
+    <h1 class="text-2xl font-semibold">Sites</h1>
+    <p class="mt-1 text-sm text-neutral-500">{{ number_format(\App\Models\Site::count()) }} sites indexed from Common Crawl.</p>
+
+    <div class="mt-6">
+        <input
+            type="search"
+            wire:model.live.debounce.400ms="search"
+            placeholder="Search by domain…"
+            class="w-full max-w-sm 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>
+
+    <div class="mt-6 overflow-hidden rounded-lg border border-neutral-200 dark:border-neutral-800">
+        <table class="min-w-full divide-y divide-neutral-200 dark:divide-neutral-800">
+            <thead class="bg-neutral-50 dark:bg-neutral-900">
+                <tr>
+                    <th class="px-4 py-2 text-left text-xs font-medium uppercase tracking-wide text-neutral-500">Domain</th>
+                    <th class="px-4 py-2 text-left text-xs font-medium uppercase tracking-wide text-neutral-500">Title</th>
+                    <th class="px-4 py-2 text-right text-xs font-medium uppercase tracking-wide text-neutral-500">Pages</th>
+                </tr>
+            </thead>
+            <tbody class="divide-y divide-neutral-200 dark:divide-neutral-800">
+                @forelse ($sites as $site)
+                    <tr wire:key="site-{{ $site->id }}">
+                        <td class="px-4 py-2 text-sm">
+                            <a href="{{ route('sites.show', $site) }}" class="font-medium text-blue-600 hover:underline dark:text-blue-400">
+                                {{ $site->domain }}
+                            </a>
+                        </td>
+                        <td class="px-4 py-2 text-sm text-neutral-600 dark:text-neutral-400">{{ $site->title ?? '—' }}</td>
+                        <td class="px-4 py-2 text-right text-sm text-neutral-600 dark:text-neutral-400">{{ $site->pages_count }}</td>
+                    </tr>
+                @empty
+                    <tr>
+                        <td colspan="3" class="px-4 py-6 text-center text-sm text-neutral-500">No sites found.</td>
+                    </tr>
+                @endforelse
+            </tbody>
+        </table>
+    </div>
+
+    <div class="mt-4">
+        {{ $sites->links() }}
+    </div>
+</div>
@@ -0,0 +1,54 @@
+<x-layouts.app :title="$site->domain">
+    <div class="mx-auto max-w-5xl px-4 py-8">
+        <a href="{{ route('sites.index') }}" class="text-sm text-blue-600 hover:underline dark:text-blue-400">&larr; Back to sites</a>
+
+        <h1 class="mt-2 text-2xl font-semibold">{{ $site->domain }}</h1>
+
+        @if ($site->title)
+            <p class="mt-1 text-neutral-700 dark:text-neutral-300">{{ $site->title }}</p>
+        @endif
+
+        @if ($site->description)
+            <p class="mt-1 text-sm text-neutral-500">{{ $site->description }}</p>
+        @endif
+
+        @if ($site->url)
+            <p class="mt-1 text-sm">
+                <a href="{{ $site->url }}" target="_blank" rel="noopener" class="text-blue-600 hover:underline dark:text-blue-400">{{ $site->url }}</a>
+            </p>
+        @endif
+
+        <h2 class="mt-8 text-lg font-medium">Pages ({{ $pages->total() }})</h2>
+
+        <div class="mt-4 overflow-hidden rounded-lg border border-neutral-200 dark:border-neutral-800">
+            <table class="min-w-full divide-y divide-neutral-200 dark:divide-neutral-800">
+                <thead class="bg-neutral-50 dark:bg-neutral-900">
+                    <tr>
+                        <th class="px-4 py-2 text-left text-xs font-medium uppercase tracking-wide text-neutral-500">URL</th>
+                        <th class="px-4 py-2 text-left text-xs font-medium uppercase tracking-wide text-neutral-500">Title</th>
+                        <th class="px-4 py-2 text-right text-xs font-medium uppercase tracking-wide text-neutral-500">Status</th>
+                    </tr>
+                </thead>
+                <tbody class="divide-y divide-neutral-200 dark:divide-neutral-800">
+                    @forelse ($pages as $page)
+                        <tr>
+                            <td class="max-w-md truncate px-4 py-2 text-sm">
+                                <a href="{{ $page->url }}" target="_blank" rel="noopener" class="text-blue-600 hover:underline dark:text-blue-400">{{ $page->url }}</a>
+                            </td>
+                            <td class="px-4 py-2 text-sm text-neutral-600 dark:text-neutral-400">{{ $page->title ?? '—' }}</td>
+                            <td class="px-4 py-2 text-right text-sm text-neutral-600 dark:text-neutral-400">{{ $page->status ?? '—' }}</td>
+                        </tr>
+                    @empty
+                        <tr>
+                            <td colspan="3" class="px-4 py-6 text-center text-sm text-neutral-500">No pages found.</td>
+                        </tr>
+                    @endforelse
+                </tbody>
+            </table>
+        </div>
+
+        <div class="mt-4">
+            {{ $pages->links() }}
+        </div>
+    </div>
+</x-layouts.app>
@@ -1,7 +1,8 @@
 <?php

+use App\Http\Controllers\SiteController;
+use App\Livewire\Sites\Index as SitesIndex;
 use Illuminate\Support\Facades\Route;

-Route::get('/', function () {
-    return view('welcome');
-});
+Route::get('/', SitesIndex::class)->name('sites.index');
+Route::get('/sites/{site}', [SiteController::class, 'show'])->name('sites.show');