jump to search init

apps/client/src/features/editor/components/search-and-replace/search-and-replace-dialog.tsx

@@ -181,7 +181,9 @@ function SearchAndReplaceDialog({ editor, editable = true }: PageFindDialogDialo
 
   const location = useLocation();
   useEffect(() => {
-    closeDialog();
+    if(pageFindState.isOpen){
+      closeDialog();
+    }
   }, [location]);
 
   return (

apps/client/src/features/editor/page-editor.tsx

@@ -65,7 +65,7 @@ import { useDebouncedCallback, useDocumentVisibility } from "@mantine/hooks";
 import { useIdle } from "@/hooks/use-idle.ts";
 import { queryClient } from "@/main.tsx";
 import { IPage } from "@/features/page/types/page.types.ts";
-import { useParams } from "react-router-dom";
+import { useParams, useSearchParams } from "react-router-dom";
 import { extractPageSlugId, platformModifierKey } from "@/lib";
 import { FIVE_MINUTES } from "@/lib/constants.ts";
 import { PageEditMode } from "@/features/user/types/user.types.ts";
@@ -194,6 +194,8 @@ function CollabPageEditor({
   const { isIdle, resetIdle } = useIdle(FIVE_MINUTES, { initialState: false });
   const documentState = useDocumentVisibility();
   const { pageSlug } = useParams();
+  const [searchParams] = useSearchParams();
+  const q = searchParams.get("q");
   const slugId = extractPageSlugId(pageSlug);
   const currentPageEditMode = useAtomValue(currentPageEditModeAtom);
   const canScroll = useCallback(
@@ -415,6 +417,37 @@ function CollabPageEditor({
   const hasConnectedOnceRef = useRef(false);
   const [showStatic, setShowStatic] = useState(true);
 
+  const appliedSearchRef = useRef(false);
+  
+  useEffect(() => {
+    if (!editor || editor.isDestroyed) return;
+    if (showStatic || !isSynced) return;
+    if (!q?.trim() || appliedSearchRef.current) return;
+    
+    const frame = requestAnimationFrame(() => {
+      if (!editor || editor.isDestroyed || !editor.view.dom.isConnected) return;
+  
+      editor.commands.setSearchTerm(q);
+      editor.commands.resetIndex();
+  
+      const { results, resultIndex } = editor.storage.searchAndReplace;
+      const position = results[resultIndex];
+  
+      if (!position) return;
+  
+      appliedSearchRef.current = true;
+  
+      editor.commands.setSearchTerm(q)
+      editor.commands.setWholeWord(true);
+      const element = document.querySelector(".search-result-current");
+      element?.scrollIntoView({ behavior: "smooth", block: "center" });
+      editor.commands.setTextSelection(0)
+    });
+  
+  
+    return () => cancelAnimationFrame(frame);
+  }, [editor, isSynced, showStatic, q]);
+
   useEffect(() => {
     if (
       !hasConnectedOnceRef.current &&

apps/client/src/features/page/page.utils.ts

@@ -30,6 +30,7 @@ export const buildPageUrl = (
   pageSlugId: string,
   pageTitle?: string,
   anchorId?: string,
+  searchString?: string
 ): string => {
   let url: string;
   if (spaceName === undefined) {
@@ -37,6 +38,11 @@ export const buildPageUrl = (
   } else {
     url = `/s/${spaceName}/p/${buildPageSlug(pageSlugId, pageTitle)}`;
   }
+
+  if (searchString) {
+    url += `?q=${encodeURIComponent(searchString)}`;
+  }
+
   return anchorId ? `${url}#${anchorId}` : url;
 };
 
@@ -45,13 +51,19 @@ export const buildSharedPageUrl = (opts: {
   pageSlugId: string;
   pageTitle?: string;
   anchorId?: string;
+  searchString?: string
 }): string => {
-  const { shareId, pageSlugId, pageTitle, anchorId } = opts;
+  const { shareId, pageSlugId, pageTitle, anchorId, searchString } = opts;
   let url: string;
   if (!shareId) {
     url = `/share/p/${buildPageSlug(pageSlugId, pageTitle)}`;
   } else {
     url = `/share/${shareId}/p/${buildPageSlug(pageSlugId, pageTitle)}`;
   }
+
+  if (searchString) {
+    url += `?q=${encodeURIComponent(searchString)}`;
+  }
+
   return anchorId ? `${url}#${anchorId}` : url;
 };

apps/client/src/features/search/components/search-result-item.tsx

@@ -101,6 +101,8 @@ export function SearchResultItem({
           pageResult.space.slug,
           pageResult.slugId,
           pageResult.title,
+          undefined,
+          pageResult.matchedText
         )}
         style={{ userSelect: "none" }}
       >

apps/client/src/features/search/types/search.types.ts

@@ -14,6 +14,7 @@ export interface IPageSearch {
   updatedAt: Date;
   rank: string;
   highlight: string;
+  matchedText: string;
   space: Partial<ISpace>;
 }
 

apps/server/src/core/search/dto/search-response.dto.ts

@@ -8,6 +8,7 @@ export class SearchResponseDto {
   creatorId: string;
   rank: number;
   highlight: string;
+  matchedText?: string;
   createdAt: Date;
   updatedAt: Date;
   space: Partial<Space>;

apps/server/src/core/search/search.service.ts

@@ -144,6 +144,11 @@ export class SearchService {
         result.highlight = result.highlight
           .replace(/\r\n|\r|\n/g, ' ')
           .replace(/\s+/g, ' ');
+
+      const matchedText = result.highlight.match(/<b>([^<]*)<\/b>/i);
+      result.matchedText = matchedText?.[1] ?? null;
+      } else {
+        result.matchedText = null;
       }
       return result;
     });