Merge pull request #35056 from overleaf/mj-command-palette-improvements

[web] Command palette improvements

GitOrigin-RevId: 3d6e11697ed4726b7ecada1744d24a15291ad646

services/web/frontend/js/features/command-palette/hooks/use-file-tree-command-source.ts

@@ -9,9 +9,12 @@ import { useEditorManagerContext } from '@/features/ide-react/context/editor-man
 
 type FlatFileTree = { path: string; name: string; id: string }[]
 
+const FILE_POSITION_REGEX = /:(\d+)(?:,(\d+))?$/
+
 const useFileTreeCommandSource = (): CommandPaletteSource => {
   const { fileTreeData } = useFileTreeData()
   const { openDocWithId, openFileWithId } = useEditorManagerContext()
+
   const flatFileTree = useMemo(
     () => flattenFileTree(fileTreeData),
     [fileTreeData]
@@ -22,7 +25,11 @@ const useFileTreeCommandSource = (): CommandPaletteSource => {
   )
 
   const onSelect = useCallback(
-    async (id: string) => {
+    async (
+      id: string,
+      line: number | undefined,
+      column: number | undefined
+    ) => {
       if (!fileTreeData) {
         return
       }
@@ -31,7 +38,10 @@ const useFileTreeCommandSource = (): CommandPaletteSource => {
         return
       }
       if (file.type === 'doc') {
-        await openDocWithId(file.entity._id)
+        await openDocWithId(file.entity._id, {
+          gotoLine: line,
+          gotoColumn: column,
+        })
       } else if (file.type === 'fileRef') {
         openFileWithId(file.entity._id)
       } else {
@@ -49,8 +59,9 @@ const useFileTreeCommandSource = (): CommandPaletteSource => {
       .slice(0, 10)
       .map(({ path, name, id }) => ({
         title: name,
-        description: path === name ? undefined : path,
-        onSelect: () => onSelect(id),
+        description:
+          path === name ? undefined : path.split('/').slice(0, -1).join('/'),
+        onSelect: () => onSelect(id, undefined, undefined),
         score: 1,
       }))
 
@@ -64,14 +75,27 @@ const useFileTreeCommandSource = (): CommandPaletteSource => {
         if (!index) {
           return []
         }
+        const fileLocationMatch = query.match(FILE_POSITION_REGEX)
+        let line: number | undefined = undefined
+        let column: number | undefined = undefined
+        if (fileLocationMatch) {
+          line = parseInt(fileLocationMatch[1], 10)
+          column = fileLocationMatch[2]
+            ? parseInt(fileLocationMatch[2], 10)
+            : undefined
+          query = query.slice(0, fileLocationMatch.index)
+        }
+
         const result = index.search(query, {
           prefix: true,
           fuzzy: term => (term.length > 3 ? 0.2 : false),
         })
+
         return result.map(({ path, name, id, score }) => ({
           title: name,
-          description: path === name ? undefined : path,
-          onSelect: () => onSelect(id),
+          description:
+            path === name ? undefined : path.split('/').slice(0, -1).join('/'),
+          onSelect: () => onSelect(id, line, column),
           score,
         }))
       },