(fix) Fix issue with match highlighting not appearing when first clicking on a search result. Fixes #255

This commit is contained in:
bkellam 2025-04-01 16:35:00 -07:00
parent e57a981030
commit 4f52494235
2 changed files with 15 additions and 10 deletions

View file

@ -7,6 +7,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
## [Unreleased]
## [3.0.1] - 2025-04-01
### Fixes
- Fix issue with match highlighting not appearing when first clicking on a search result. ([#255](https://github.com/sourcebot-dev/sourcebot/issues/255))
## [3.0.0] - 2025-04-01
Sourcebot v3 is here and brings a number of structural changes to the tool's foundation, including a SQL database, parallelized indexing, authentication support, multitenancy, and more. Checkout the [migration guide](https://docs.sourcebot.dev/self-hosting/upgrade/v2-to-v3-guide) for information on upgrading your instance to v3.

View file

@ -16,7 +16,7 @@ import { Scrollbar } from "@radix-ui/react-scroll-area";
import CodeMirror, { ReactCodeMirrorRef, SelectionRange } from '@uiw/react-codemirror';
import clsx from "clsx";
import { ArrowDown, ArrowUp } from "lucide-react";
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { useCallback, useEffect, useMemo, useState } from "react";
export interface CodePreviewFile {
content: string;
@ -42,13 +42,13 @@ export const CodePreview = ({
onSelectedMatchIndexChange,
onClose,
}: CodePreviewProps) => {
const editorRef = useRef<ReactCodeMirrorRef>(null);
const [editorRef, setEditorRef] = useState<ReactCodeMirrorRef | null>(null);
const [gutterWidth, setGutterWidth] = useState(0);
const theme = useCodeMirrorTheme();
const keymapExtension = useKeymapExtension(editorRef.current?.view);
const syntaxHighlighting = useSyntaxHighlightingExtension(file?.language ?? '', editorRef.current?.view);
const keymapExtension = useKeymapExtension(editorRef?.view);
const syntaxHighlighting = useSyntaxHighlightingExtension(file?.language ?? '', editorRef?.view);
const [currentSelection, setCurrentSelection] = useState<SelectionRange>();
const extensions = useMemo(() => {
@ -89,12 +89,12 @@ export const CodePreview = ({
}, [file]);
useEffect(() => {
if (!file || !editorRef.current?.view) {
if (!file || !editorRef?.view) {
return;
}
highlightRanges(selectedMatchIndex, ranges, editorRef.current.view);
}, [ranges, selectedMatchIndex, file]);
highlightRanges(selectedMatchIndex, ranges, editorRef.view);
}, [ranges, selectedMatchIndex, file, editorRef]);
const onUpClicked = useCallback(() => {
onSelectedMatchIndexChange(selectedMatchIndex - 1);
@ -174,7 +174,7 @@ export const CodePreview = ({
</div>
<ScrollArea className="h-full overflow-auto flex-1">
<CodeMirror
ref={editorRef}
ref={setEditorRef}
className="relative"
readOnly={true}
value={file?.content}
@ -182,13 +182,13 @@ export const CodePreview = ({
theme={theme}
>
{
editorRef.current?.view &&
editorRef?.view &&
file?.filepath &&
repoName &&
currentSelection &&
(
<EditorContextMenu
view={editorRef.current.view}
view={editorRef.view}
path={file?.filepath}
repoName={repoName}
selection={currentSelection}