Merge pull request #24930 from overleaf/em-ae-jd-full-project-search-launch

Launch full project search from regular search

GitOrigin-RevId: 3ef4f6923a0aeef6ab68768bab79e4be32f09eb0

services/web/frontend/js/features/event-tracking/search-events.ts

@@ -4,7 +4,10 @@ type SearchEventSegmentation = {
   'search-open':
     | ({
         searchType: 'full-project'
-      } & ({ method: 'keyboard' } | { method: 'button'; location: 'toolbar' }))
+      } & (
+        | { method: 'keyboard' }
+        | { method: 'button'; location: 'toolbar' | 'search-form' }
+      ))
     | ({
         searchType: 'document'
         mode: 'visual' | 'source'

services/web/frontend/js/features/source-editor/components/codemirror-search-form.tsx

@@ -21,9 +21,11 @@ import MaterialIcon from '@/shared/components/material-icon'
 import OLButtonGroup from '@/features/ui/components/ol/ol-button-group'
 import OLFormControl from '@/features/ui/components/ol/ol-form-control'
 import OLCloseButton from '@/features/ui/components/ol/ol-close-button'
+import { isSplitTestEnabled } from '@/utils/splitTestUtils'
 import { useTranslation } from 'react-i18next'
 import classnames from 'classnames'
 import { useUserSettingsContext } from '@/shared/context/user-settings-context'
+import { useLayoutContext } from '@/shared/context/layout-context'
 import { getStoredSelection, setStoredSelection } from '../extensions/search'
 import { debounce } from 'lodash'
 import { EditorSelection, EditorState } from '@codemirror/state'
@@ -49,6 +51,7 @@ type MatchPositions = {
 const CodeMirrorSearchForm: FC = () => {
   const view = useCodeMirrorViewContext()
   const state = useCodeMirrorStateContext()
+  const { setProjectSearchIsOpen } = useLayoutContext()
 
   const { userSettings } = useUserSettingsContext()
   const emacsKeybindingsActive = userSettings.mode === 'emacs'
@@ -223,6 +226,16 @@ const CodeMirrorSearchForm: FC = () => {
     return getSearchQuery(state)
   }, [state])
 
+  const openFullProjectSearch = useCallback(() => {
+    setProjectSearchIsOpen(true)
+    closeSearchPanel(view)
+    window.setTimeout(() => {
+      window.dispatchEvent(
+        new CustomEvent('editor:full-project-search', { detail: query })
+      )
+    }, 200)
+  }, [setProjectSearchIsOpen, query, view])
+
   const showReplace = !state.readOnly
 
   return (
@@ -424,6 +437,31 @@ const CodeMirrorSearchForm: FC = () => {
             </OLButton>
           </OLButtonGroup>
 
+          {isSplitTestEnabled('full-project-search') ? (
+            <OLTooltip
+              id="open-full-project-search"
+              description={t('search_all_project_files')}
+            >
+              <OLButton
+                variant="secondary"
+                size="sm"
+                onClick={() => {
+                  sendSearchEvent('search-open', {
+                    searchType: 'full-project',
+                    method: 'button',
+                    location: 'search-form',
+                  })
+                  openFullProjectSearch()
+                }}
+              >
+                <MaterialIcon
+                  type="manage_search"
+                  accessibilityLabel={t('search_next')}
+                />
+              </OLButton>
+            </OLTooltip>
+          ) : null}
+
           {position !== null && (
             <div className="ol-cm-search-form-position">
               {position.current === null ? '?' : position.current} {t('of')}{' '}