rhl-lieferscheine/components/search/SearchResultsTable.jsx

"use client";

import React from "react";
import Link from "next/link";
import { Eye, FolderOpen } from "lucide-react";

import { dayPath } from "@/lib/frontend/routes";
import { buildPdfUrl } from "@/lib/frontend/explorer/pdfUrl";
import { formatSearchItemDateDe } from "@/lib/frontend/search/resultsSorting";
import { SEARCH_SCOPE } from "@/lib/frontend/search/urlState";

import { Button } from "@/components/ui/button";
import {
	Table,
	TableBody,
	TableCaption,
	TableCell,
	TableHead,
	TableHeader,
	TableRow,
} from "@/components/ui/table";

export default function SearchResultsTable({ routeBranch, scope, items }) {
	const showBranchColumn =
		scope === SEARCH_SCOPE.ALL || scope === SEARCH_SCOPE.MULTI;

	const list = Array.isArray(items) ? items : [];

	return (
		<Table>
			<TableCaption>
				Hinweis: PDFs werden in einem neuen Tab geöffnet.
			</TableCaption>

			<TableHeader>
				<TableRow>
					{showBranchColumn ? <TableHead>Niederlassung</TableHead> : null}
					<TableHead>Datum</TableHead>
					<TableHead>Datei</TableHead>
					<TableHead className="hidden md:table-cell">Pfad</TableHead>
					<TableHead className="text-right">Aktion</TableHead>
				</TableRow>
			</TableHeader>

			<TableBody>
				{list.map((it) => {
					const itemBranch = String(it?.branch || routeBranch);
					const year = String(it?.year || "");
					const month = String(it?.month || "");
					const day = String(it?.day || "");
					const filename = String(it?.filename || "");
					const relativePath = String(it?.relativePath || "");
					const snippet =
						typeof it?.snippet === "string" && it.snippet.trim()
							? it.snippet.trim()
							: null;

					const pdfUrl = buildPdfUrl({
						branch: itemBranch,
						year,
						month,
						day,
						filename,
					});

					const dayHref = dayPath(itemBranch, year, month, day);

					const key =
						relativePath || `${itemBranch}/${year}/${month}/${day}/${filename}`;

					return (
						<TableRow key={key}>
							{showBranchColumn ? (
								<TableCell>
									<span className="text-sm">{itemBranch}</span>
								</TableCell>
							) : null}

							<TableCell>
								<span className="text-sm">{formatSearchItemDateDe(it)}</span>
							</TableCell>

							<TableCell className="min-w-0">
								<div className="min-w-0">
									<p className="truncate font-medium">{filename}</p>

									{snippet ? (
										<p className="mt-0.5 line-clamp-2 text-xs text-muted-foreground">
											{snippet}
										</p>
									) : null}

									<p className="truncate text-xs text-muted-foreground md:hidden">
										{relativePath}
									</p>
								</div>
							</TableCell>

							<TableCell className="hidden md:table-cell">
								<span className="text-xs text-muted-foreground">
									{relativePath}
								</span>
							</TableCell>

							<TableCell className="text-right">
								<div className="flex justify-end gap-2">
									<Button variant="outline" size="sm" asChild>
										<a
											href={pdfUrl}
											target="_blank"
											rel="noopener noreferrer"
											aria-label={`PDF öffnen: ${filename}`}
											title={`PDF öffnen: ${filename}`}
										>
											<Eye className="h-4 w-4" />
											Öffnen
										</a>
									</Button>

									<Button variant="outline" size="sm" asChild>
										<Link href={dayHref} title="Zum Tag">
											<FolderOpen className="h-4 w-4" />
											Zum Tag
										</Link>
									</Button>
								</div>
							</TableCell>
						</TableRow>
					);
				})}
			</TableBody>
		</Table>
	);
}