convert file match container to link

packages/web/src/app/[domain]/search/components/searchResultsPanel/fileMatch.tsx

@@ -1,27 +1,22 @@
 'use client';
 
-import { useCallback } from "react";
 import { SearchResultFile, SearchResultChunk } from "@/features/search/types";
 import { LightweightCodeHighlighter } from "@/app/[domain]/components/lightweightCodeHighlighter";
+import Link from "next/link";
+import { getBrowsePath } from "@/app/[domain]/browse/hooks/useBrowseNavigation";
+import { useDomain } from "@/hooks/useDomain";
 
 
 interface FileMatchProps {
     match: SearchResultChunk;
     file: SearchResultFile;
-    onOpen: (startLineNumber: number, endLineNumber: number, isCtrlKeyPressed: boolean) => void;
 }
 
 export const FileMatch = ({
     match,
     file,
-    onOpen: _onOpen,
 }: FileMatchProps) => {
-    const onOpen = useCallback((isCtrlKeyPressed: boolean) => {
+    const domain = useDomain();
-        const startLineNumber = match.contentStart.lineNumber;
-        const endLineNumber = match.content.trimEnd().split('\n').length + startLineNumber - 1;
-
-        _onOpen(startLineNumber, endLineNumber, isCtrlKeyPressed);
-    }, [match.content, match.contentStart.lineNumber, _onOpen]);
 
     // If it's just the title, don't show a code preview
     if (match.matchRanges.length === 0) {
@@ -29,19 +24,24 @@ export const FileMatch = ({
     }
 
     return (
-        <div
+        <Link
             tabIndex={0}
             className="cursor-pointer focus:ring-inset focus:ring-4 bg-background hover:bg-editor-lineHighlight"
-            onKeyDown={(e) => {
+            href={getBrowsePath({
-                if (e.key !== "Enter") {
+                repoName: file.repository,
-                    return;
+                revisionName: file.branches?.[0] ?? 'HEAD',
+                path: file.fileName.text,
+                pathType: 'blob',
+                domain,
+                highlightRange: {
+                    start: {
+                        lineNumber: match.contentStart.lineNumber,
+                    },
+                    end: {
+                        lineNumber: match.content.trimEnd().split('\n').length + match.contentStart.lineNumber - 1,
                     }
-
+                }
-                onOpen(e.metaKey || e.ctrlKey);
+            })}
-            }}
-            onClick={(e) => {
-                onOpen(e.metaKey || e.ctrlKey);
-            }}
             title="open file: click, open file preview: cmd/ctrl + click"
         >
             <LightweightCodeHighlighter
@@ -53,6 +53,6 @@ export const FileMatch = ({
             >
                 {match.content}
             </LightweightCodeHighlighter>
-        </div>
+        </Link>
     );
 }

packages/web/src/app/[domain]/search/components/searchResultsPanel/fileMatchContainer.tsx

@@ -7,7 +7,6 @@ import { useMemo } from "react";
 import { FileMatch } from "./fileMatch";
 import { RepositoryInfo, SearchResultFile } from "@/features/search/types";
 import { Button } from "@/components/ui/button";
-import { useBrowseNavigation } from "@/app/[domain]/browse/hooks/useBrowseNavigation";
 
 export const MAX_MATCHES_TO_PREVIEW = 3;
 
@@ -33,7 +32,6 @@ export const FileMatchContainer = ({
     const matchCount = useMemo(() => {
         return file.chunks.length;
     }, [file]);
-    const { navigateToPath } = useBrowseNavigation();
 
     const matches = useMemo(() => {
         const sortedMatches = file.chunks.sort((a, b) => {
@@ -123,29 +121,6 @@ export const FileMatchContainer = ({
                     <FileMatch
                         match={match}
                         file={file}
-                        onOpen={(startLineNumber, endLineNumber, isCtrlKeyPressed) => {
-                            if (isCtrlKeyPressed) {
-                                const matchIndex = matches.slice(0, index).reduce((acc, match) => {
-                                    return acc + match.matchRanges.length;
-                                }, 0);
-                                onOpenFilePreview(matchIndex);
-                            } else {
-                                navigateToPath({
-                                    repoName: file.repository,
-                                    revisionName: file.branches?.[0] ?? 'HEAD',
-                                    path: file.fileName.text,
-                                    pathType: 'blob',
-                                    highlightRange: {
-                                        start: {
-                                            lineNumber: startLineNumber,
-                                        },
-                                        end: {
-                                            lineNumber: endLineNumber,
-                                        }
-                                    }
-                                });
-                            }
-                        }}
                     />
                     {(index !== matches.length - 1 || isMoreContentButtonVisible) && (
                         <Separator className="bg-accent" />