components/Searching/SearchResult.tsx

import Link from "@/components/Navigation/Link";
import { SearchResultItem } from "./SearchModal";

type SearchResultProps = {
    result: SearchResultItem;
    query: string;
    onClick: () => void;
};

function SearchResult({ result, query, onClick }: SearchResultProps) {
    return (
        <Link
            href={result.url}
            onClick={onClick}
            className="p-2 shadow-[0_0_1px_1px_rgba(255,255,255,0.1)] block rounded my-2 bg-[rgba(0,0,0,0.2)] hover:bg-[rgba(0,0,0,0.3)]"
        >
            <h3 className="text-lg lg:text-xl">{result.title}</h3>

            <p className="text-[#999]">
                May include information related to{" "}
                <strong className="text-white">{query}</strong>
            </p>
        </Link>
    );
}

export default SearchResult;
1	rakinar2	575	import Link from "@/components/Navigation/Link";
2			import { SearchResultItem } from "./SearchModal";
3
4			type SearchResultProps = {
5			result: SearchResultItem;
6			query: string;
7			onClick: () => void;
8			};
9
10			function SearchResult({ result, query, onClick }: SearchResultProps) {
11			return (
12			<Link
13			href={result.url}
14			onClick={onClick}
15			className="p-2 shadow-[0_0_1px_1px_rgba(255,255,255,0.1)] block rounded my-2 bg-[rgba(0,0,0,0.2)] hover:bg-[rgba(0,0,0,0.3)]"
16			>
17			<h3 className="text-lg lg:text-xl">{result.title}</h3>
18
19			<p className="text-[#999]">
20			May include information related to{" "}
21			<strong className="text-white">{query}</strong>
22			</p>
23			</Link>
24			);
25			}
26
27			export default SearchResult;