32 lines
1010 B
TypeScript
32 lines
1010 B
TypeScript
import { NavLink } from "react-router-dom";
|
|
|
|
import type { components } from "../api/schema";
|
|
import { VisibilityBadge } from "../objects/visibility-badge";
|
|
import { Highlight } from "./highlight";
|
|
|
|
type SearchHitView = components["schemas"]["SearchHitView"];
|
|
|
|
export function SearchResultRow({ hit }: { hit: SearchHitView }) {
|
|
return (
|
|
<li>
|
|
<NavLink
|
|
to={`/search/${hit.id}`}
|
|
className={({ isActive }) =>
|
|
`block border-b px-3 py-2 ${isActive ? "bg-indigo-50" : "hover:bg-neutral-50"}`
|
|
}
|
|
>
|
|
<div className="text-sm font-semibold">{hit.object_name}</div>
|
|
<div className="mt-0.5 flex items-center gap-2 text-xs text-neutral-500">
|
|
<span>{hit.object_number}</span>
|
|
<VisibilityBadge visibility={hit.visibility} />
|
|
</div>
|
|
{hit.snippet && (
|
|
<p className="mt-1 line-clamp-2 text-xs text-neutral-600">
|
|
<Highlight text={hit.snippet} />
|
|
</p>
|
|
)}
|
|
</NavLink>
|
|
</li>
|
|
);
|
|
}
|