import { ArrowLeft, Search } from 'lucide-react'; import { Head, Link } from '@inertiajs/react'; import { Badge } from '@/Components/ui/badge'; import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, } from '@/Components/ui/breadcrumb'; import { Button } from '@/Components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/Components/ui/card'; import AdminLayout from '@/Layouts/AdminLayout'; import { getAdminStatusVariant } from '@/lib/adminStatusBadge'; import { formatDateTime } from '@/lib/format'; interface SerpSnapshotDetail { id: number; site_id: number; site_name: string | null; site_domain: string | null; keyword: string; target_url: string | null; status: string; language_code: string | null; location_code: number | null; error: string | null; result_count: number; nlp_term_count: number; top_nlp_terms: unknown[]; fetched_at: string | null; expires_at: string | null; created_at: string; } interface Props { snapshot: SerpSnapshotDetail; } export default function AdminSerpSnapshotShow({ snapshot }: Props) { return (

Admin SERP Snapshots #{snapshot.id}

SERP Snapshot #{snapshot.id}

{snapshot.status}

{snapshot.keyword}

Details

Site

{snapshot.site_name ?? '—'} {snapshot.site_domain && (

{snapshot.site_domain}

)}

{snapshot.target_url && (

Target URL

{snapshot.target_url}

)}

Language

{snapshot.language_code ?? '—'}

{snapshot.location_code != null && (

Location Code

{snapshot.location_code}

)}

Created

{formatDateTime(snapshot.created_at)}

Fetched

{formatDateTime(snapshot.fetched_at) || '—'}

Expires

{formatDateTime(snapshot.expires_at) || '—'}

Data Summary

SERP Results {snapshot.result_count}

NLP Terms {snapshot.nlp_term_count}

{snapshot.error && ( Error

                  {snapshot.error}

)} {snapshot.top_nlp_terms.length > 0 && ( Top NLP Terms (first 20 of {snapshot.nlp_term_count})

                  {JSON.stringify(snapshot.top_nlp_terms, null, 2)}

)}

); }