@opensumi/ide-search 2.21.13 → 2.22.0

package/src/browser/search-result-collection.ts

@@ -0,0 +1,75 @@
+import { SendClientResult, SEARCH_STATE } from '../common';
+
+/**
+ * 用于收集多个搜索结果后合并，减少更新视图频率
+ */
+export class SearchResultCollection {
+  list: SendClientResult[] = [];
+
+  maxLength = 5;
+
+  pushAndGetResultList(result: SendClientResult) {
+    const { id, data, searchState } = result;
+    const outResultList: SendClientResult[] = [];
+
+    if (searchState === SEARCH_STATE.error || searchState === SEARCH_STATE.done) {
+      // 搜索结束或出错，把缓存搜索结果抛出
+      const tempResult = this.getTempResult();
+      if (tempResult) {
+        outResultList.push(tempResult);
+      }
+      outResultList.push(result);
+      return outResultList;
+    }
+
+    if (data.length < 1) {
+      // 其他数据，原样抛出
+      outResultList.push(result);
+      return outResultList;
+    }
+
+    if (this.list.length > 0) {
+      if (id === this.list[0].id) {
+        // 同一个搜索的搜索结果
+        this.pushTempResult(result);
+      } else {
+        // 不同搜索的搜索结果
+        const tempResult = this.getTempResult();
+        if (tempResult) {
+          outResultList.push(tempResult);
+        }
+        this.pushTempResult(result);
+      }
+    } else {
+      this.pushTempResult(result);
+    }
+    if (this.list.length >= this.maxLength) {
+      outResultList.push(this.getTempResult()!);
+    }
+
+    return outResultList;
+  }
+
+  private getTempResult(): SendClientResult | undefined {
+    let outResult: SendClientResult | undefined;
+
+    if (this.list.length < 1) {
+      return outResult;
+    }
+
+    this.list.forEach((result: SendClientResult, index) => {
+      if (index === 0) {
+        return;
+      }
+      this.list[0].data = this.list[0].data.concat(result.data);
+    });
+
+    outResult = this.list[0];
+    this.list = [];
+    return outResult;
+  }
+
+  private pushTempResult(result: SendClientResult) {
+    this.list.push(result);
+  }
+}

package/src/browser/search.contribution.ts

@@ -0,0 +1,347 @@
+import { Autowired } from '@opensumi/di';
+import { localize, PreferenceSchema, SEARCH_COMMANDS, IClipboardService } from '@opensumi/ide-core-browser';
+import {
+  KeybindingContribution,
+  KeybindingRegistry,
+  ClientAppContribution,
+  ComponentRegistry,
+  ComponentContribution,
+  PreferenceContribution,
+} from '@opensumi/ide-core-browser';
+import { getIcon } from '@opensumi/ide-core-browser';
+import { SEARCH_CONTAINER_ID } from '@opensumi/ide-core-browser/lib/common/container-id';
+import { SearchInputBoxFocusedKey } from '@opensumi/ide-core-browser/lib/contextkey/search';
+import { ToolbarRegistry, TabBarToolbarContribution } from '@opensumi/ide-core-browser/lib/layout';
+import { MenuId, MenuContribution, IMenuRegistry } from '@opensumi/ide-core-browser/lib/menu/next';
+import {
+  CommandContribution,
+  CommandRegistry,
+  DisposableCollection,
+  formatLocalize,
+  MessageType,
+} from '@opensumi/ide-core-common';
+import { Domain } from '@opensumi/ide-core-common/lib/di-helper';
+import { IEditorDocumentModelService } from '@opensumi/ide-editor/lib/browser/index';
+import { MainLayoutContribution } from '@opensumi/ide-main-layout';
+import { IMainLayoutService } from '@opensumi/ide-main-layout/lib/common';
+import { IDialogService } from '@opensumi/ide-overlay';
+import { IWorkspaceEditService } from '@opensumi/ide-workspace-edit';
+
+import { ContentSearchResult, IContentSearchClientService, OpenSearchCmdOptions } from '../common';
+
+import { replaceAll } from './replace';
+import { searchPreferenceSchema } from './search-preferences';
+import { Search } from './search.view';
+import { SearchTreeService } from './tree/search-tree.service';
+import { SearchModelService } from './tree/tree-model.service';
+import { SearchContentNode, SearchFileNode } from './tree/tree-node.defined';
+
+@Domain(
+  ClientAppContribution,
+  CommandContribution,
+  KeybindingContribution,
+  ComponentContribution,
+  TabBarToolbarContribution,
+  PreferenceContribution,
+  MainLayoutContribution,
+  MenuContribution,
+)
+export class SearchContribution
+  implements
+    CommandContribution,
+    KeybindingContribution,
+    ComponentContribution,
+    TabBarToolbarContribution,
+    PreferenceContribution,
+    MainLayoutContribution,
+    MenuContribution
+{
+  @Autowired(IMainLayoutService)
+  private readonly mainLayoutService: IMainLayoutService;
+
+  @Autowired(IContentSearchClientService)
+  private readonly searchBrowserService: IContentSearchClientService;
+
+  @Autowired(SearchTreeService)
+  private readonly searchTreeService: SearchTreeService;
+
+  @Autowired(IEditorDocumentModelService)
+  private readonly documentModelManager: IEditorDocumentModelService;
+
+  @Autowired(IWorkspaceEditService)
+  private readonly workspaceEditService: IWorkspaceEditService;
+
+  @Autowired(IDialogService)
+  private readonly dialogService: IDialogService;
+
+  @Autowired(SearchModelService)
+  private readonly searchModelService: SearchModelService;
+
+  @Autowired(IClipboardService)
+  private readonly clipboardService: IClipboardService;
+
+  schema: PreferenceSchema = searchPreferenceSchema;
+
+  private readonly toDispose = new DisposableCollection();
+
+  registerCommands(commands: CommandRegistry): void {
+    commands.registerCommand(SEARCH_COMMANDS.OPEN_SEARCH, {
+      execute: (options?: OpenSearchCmdOptions) => {
+        const bar = this.mainLayoutService.getTabbarHandler(SEARCH_CONTAINER_ID);
+        if (!bar) {
+          return;
+        }
+        bar.activate();
+        if (options && options.includeValue) {
+          this.searchBrowserService.includeValue = options.includeValue;
+          this.searchBrowserService.updateUIState({ isDetailOpen: true });
+          this.searchBrowserService.search();
+          return;
+        }
+        this.searchBrowserService.searchEditorSelection();
+        this.searchBrowserService.focus();
+        this.searchBrowserService.search();
+      },
+    });
+    commands.registerCommand(SEARCH_COMMANDS.REFRESH, {
+      execute: () => {
+        this.searchBrowserService.search();
+      },
+    });
+    commands.registerCommand(SEARCH_COMMANDS.CLEAN, {
+      execute: () => {
+        this.searchBrowserService.clean();
+      },
+    });
+    commands.registerCommand(SEARCH_COMMANDS.GET_RECENT_SEARCH_WORD, {
+      execute: (e) => {
+        this.searchBrowserService.setRecentSearchWord();
+      },
+    });
+    commands.registerCommand(SEARCH_COMMANDS.GET_BACK_RECENT_SEARCH_WORD, {
+      execute: () => {
+        this.searchBrowserService.setBackRecentSearchWord();
+      },
+    });
+    commands.registerCommand(SEARCH_COMMANDS.MENU_REPLACE, {
+      execute: async (node: SearchFileNode | SearchContentNode) => {
+        if (!SearchFileNode.is(node)) {
+          const resultMap: Map<string, ContentSearchResult[]> = new Map();
+          resultMap.set(node.resource.toString(), [node.contentResult]);
+          await replaceAll(
+            this.documentModelManager,
+            this.workspaceEditService,
+            resultMap,
+            this.searchBrowserService.replaceValue,
+            this.searchBrowserService.searchValue,
+            this.searchBrowserService.UIState.isUseRegexp,
+          );
+        }
+      },
+      isVisible: () => !SearchFileNode.is(this.searchModelService.contextMenuNode),
+    });
+    commands.registerCommand(SEARCH_COMMANDS.MENU_REPLACE_ALL, {
+      execute: async (node: SearchFileNode | SearchContentNode) => {
+        if (!SearchFileNode.is(node)) {
+          return;
+        }
+        const resultMap: Map<string, ContentSearchResult[]> = new Map();
+        if (!node.children) {
+          return;
+        }
+        const contentSearchResult: ContentSearchResult[] = node.children.map(
+          (child: SearchContentNode) => child.contentResult,
+        );
+        const buttons = {
+          [localize('search.replace.buttonCancel')]: false,
+          [localize('search.replace.buttonOK')]: true,
+        };
+        const selection = await this.dialogService.open(
+          formatLocalize('search.removeAll.occurrences.file.confirmation.message', String(contentSearchResult.length)),
+          MessageType.Warning,
+          Object.keys(buttons),
+        );
+        if (selection && !buttons[selection]) {
+          return buttons[selection];
+        }
+        resultMap.set(node.resource.toString(), contentSearchResult);
+        await replaceAll(
+          this.documentModelManager,
+          this.workspaceEditService,
+          resultMap,
+          this.searchBrowserService.replaceValue,
+          this.searchBrowserService.searchValue,
+          this.searchBrowserService.UIState.isUseRegexp,
+        );
+      },
+      isVisible: () => !SearchFileNode.is(this.searchModelService.contextMenuNode),
+    });
+    commands.registerCommand(SEARCH_COMMANDS.MENU_HIDE, {
+      execute: (node: SearchFileNode | SearchContentNode) => {
+        if (SearchFileNode.is(node)) {
+          this.searchBrowserService.resultTotal.fileNum -= 1;
+          this.searchBrowserService.resultTotal.resultNum -= node.branchSize;
+          this.searchModelService.treeModel.root.unlinkItem(node);
+        } else {
+          this.searchBrowserService.resultTotal.resultNum -= 1;
+          if (node.parent?.children?.length === 1) {
+            this.searchBrowserService.resultTotal.fileNum -= 1;
+            this.searchModelService.treeModel.root.unlinkItem(node.parent);
+          }
+          (node.parent as SearchFileNode).unlinkItem(node);
+        }
+        this.searchBrowserService.fireTitleChange();
+      },
+    });
+    commands.registerCommand(SEARCH_COMMANDS.MENU_COPY, {
+      execute: (node: SearchFileNode | SearchContentNode) => {
+        if (!SearchFileNode.is(node)) {
+          const result = node.contentResult;
+          this.clipboardService.writeText(`${result.line},${result.matchStart}:  ${result.renderLineText}`);
+        } else {
+          const uri = node.resource;
+          let text = `${uri.codeUri.fsPath.toString()}\n`;
+
+          node.children?.forEach((node: SearchContentNode) => {
+            const result = node.contentResult;
+            text = text + `${result.line},${result.matchStart}: ${result.renderLineText} \n`;
+          });
+          this.clipboardService.writeText(text);
+        }
+      },
+    });
+    commands.registerCommand(SEARCH_COMMANDS.MENU_COPY_ALL, {
+      execute: (node: SearchFileNode | SearchContentNode) => {
+        let nodes: SearchFileNode[];
+        if (!node) {
+          nodes = this.searchModelService.treeModel.root.children as SearchFileNode[];
+        } else {
+          if (SearchFileNode.is(node)) {
+            nodes = [node];
+          } else {
+            nodes = [node.parent as SearchFileNode];
+          }
+        }
+        if (!nodes) {
+          return;
+        }
+        let copyText = '';
+
+        for (let i = 0, len = nodes.length; i < len; i++) {
+          const uri = nodes[i].resource;
+          let text = `${uri.codeUri.fsPath.toString()}\n`;
+          nodes[i].children?.forEach((node: SearchContentNode) => {
+            const result = node.contentResult;
+            text = text + `${result.line},${result.matchStart}: ${result.renderLineText} \n`;
+          });
+          copyText += text;
+          if (i < len) {
+            copyText += '\n';
+          }
+        }
+        this.clipboardService.writeText(copyText);
+      },
+    });
+    commands.registerCommand(SEARCH_COMMANDS.MENU_COPY_PATH, {
+      execute: (node: SearchFileNode | SearchContentNode) => {
+        this.clipboardService.writeText(node.resource.codeUri.fsPath.toString());
+      },
+    });
+  }
+
+  registerMenus(menuRegistry: IMenuRegistry): void {
+    menuRegistry.registerMenuItem(MenuId.SearchContext, {
+      command: SEARCH_COMMANDS.MENU_REPLACE.id,
+      order: 1,
+      group: '0_operator',
+    });
+    menuRegistry.registerMenuItem(MenuId.SearchContext, {
+      command: SEARCH_COMMANDS.MENU_REPLACE_ALL.id,
+      order: 2,
+      group: '0_operator',
+    });
+    menuRegistry.registerMenuItem(MenuId.SearchContext, {
+      command: SEARCH_COMMANDS.MENU_HIDE.id,
+      order: 3,
+      group: '0_operator',
+    });
+    menuRegistry.registerMenuItem(MenuId.SearchContext, {
+      command: SEARCH_COMMANDS.MENU_COPY.id,
+      order: 1,
+      group: '1_copy',
+    });
+    menuRegistry.registerMenuItem(MenuId.SearchContext, {
+      command: SEARCH_COMMANDS.MENU_COPY_PATH.id,
+      order: 2,
+      group: '1_copy',
+    });
+    menuRegistry.registerMenuItem(MenuId.SearchContext, {
+      command: SEARCH_COMMANDS.MENU_COPY_ALL.id,
+      order: 3,
+      group: '1_copy',
+    });
+  }
+
+  registerKeybindings(keybindings: KeybindingRegistry): void {
+    keybindings.registerKeybinding({
+      command: SEARCH_COMMANDS.OPEN_SEARCH.id,
+      keybinding: 'ctrlcmd+shift+f',
+    });
+
+    keybindings.registerKeybinding({
+      command: SEARCH_COMMANDS.GET_BACK_RECENT_SEARCH_WORD.id,
+      keybinding: 'down',
+      when: SearchInputBoxFocusedKey.raw,
+    });
+    keybindings.registerKeybinding({
+      command: SEARCH_COMMANDS.GET_RECENT_SEARCH_WORD.id,
+      keybinding: 'up',
+      when: SearchInputBoxFocusedKey.raw,
+    });
+  }
+
+  registerComponent(registry: ComponentRegistry) {
+    registry.register('@opensumi/ide-search', [], {
+      containerId: SEARCH_CONTAINER_ID,
+      iconClass: getIcon('search'),
+      title: localize('search.title'),
+      component: Search,
+      priority: 9,
+    });
+  }
+
+  registerToolbarItems(registry: ToolbarRegistry) {
+    registry.registerItem({
+      id: SEARCH_COMMANDS.CLEAN.id,
+      command: SEARCH_COMMANDS.CLEAN.id,
+      viewId: SEARCH_CONTAINER_ID,
+      tooltip: localize('search.ClearSearchResultsAction.label'),
+      enabledWhen: 'canClearSearchResult',
+    });
+    registry.registerItem({
+      id: SEARCH_COMMANDS.REFRESH.id,
+      command: SEARCH_COMMANDS.REFRESH.id,
+      viewId: SEARCH_CONTAINER_ID,
+      tooltip: localize('search.RefreshAction.label'),
+      enabledWhen: 'canRefreshSearchResult',
+    });
+  }
+
+  onDidRender() {
+    const handler = this.mainLayoutService.getTabbarHandler(SEARCH_CONTAINER_ID);
+    if (handler) {
+      handler.onActivate(() => {
+        this.searchBrowserService.initSearchHistory();
+        this.searchBrowserService.focus();
+      });
+      handler.onInActivate(() => {
+        this.searchTreeService.removeHighlightRange();
+        this.searchBrowserService.blur();
+      });
+    }
+  }
+
+  dispose() {
+    this.toDispose.dispose();
+  }
+}

package/src/browser/search.input.widget.tsx

@@ -0,0 +1,129 @@
+import cls from 'classnames';
+import React, { FormEvent, memo, forwardRef } from 'react';
+
+import { ValidateInput, CheckBox, ValidateMessage } from '@opensumi/ide-components';
+import { getIcon } from '@opensumi/ide-core-browser/lib/style/icon/icon';
+import { localize } from '@opensumi/ide-core-common/lib/localize';
+
+import styles from './search.module.less';
+
+export interface SearchInputWidgetProps {
+  isDetailOpen: boolean;
+  onDetailToggle: () => void;
+  onSearchFocus: () => void;
+  onSearchBlur: () => void;
+  isMatchCase: boolean;
+  onMatchCaseToggle: () => void;
+  isWholeWord: boolean;
+  onWholeWordToggle: () => void;
+  isRegex: boolean;
+  onRegexToggle: () => void;
+  searchValue: string;
+  onSearch: () => void;
+  onSearchInputChange: (e: FormEvent<HTMLInputElement>) => void;
+  isShowValidateMessage: boolean;
+  validateMessage?: ValidateMessage;
+}
+
+const SearchRuleCheckout = memo(
+  ({ isDetailOpen, onDetailToggle }: Pick<SearchInputWidgetProps, 'isDetailOpen' | 'onDetailToggle'>) => (
+    <p className={styles.search_input_title}>
+      <span className={styles.search_title}>{localize('search.input.title')}</span>
+      <CheckBox
+        className={cls(styles.checkbox)}
+        label={localize('search.input.checkbox')}
+        checked={isDetailOpen}
+        id='search-input'
+        onChange={onDetailToggle}
+      />
+    </p>
+  ),
+  (prevProps, nextProps) => prevProps.isDetailOpen === nextProps.isDetailOpen,
+);
+
+function isSearchInputPropsEqual(prevProps: SearchInputWidgetProps, nextProps: SearchInputWidgetProps) {
+  return (
+    prevProps.isDetailOpen === nextProps.isDetailOpen &&
+    prevProps.isMatchCase === nextProps.isMatchCase &&
+    prevProps.isWholeWord === nextProps.isWholeWord &&
+    prevProps.isRegex === nextProps.isRegex &&
+    prevProps.searchValue === nextProps.searchValue &&
+    prevProps.isShowValidateMessage === nextProps.isShowValidateMessage &&
+    prevProps.validateMessage === nextProps.validateMessage
+  );
+}
+
+export const SearchInputWidget = memo(
+  forwardRef<HTMLInputElement, SearchInputWidgetProps>(
+    (
+      {
+        isDetailOpen,
+        onDetailToggle,
+        onSearchFocus,
+        onSearchBlur,
+        isMatchCase,
+        onMatchCaseToggle,
+        isWholeWord,
+        onWholeWordToggle,
+        isRegex,
+        onRegexToggle,
+        searchValue,
+        onSearch,
+        onSearchInputChange,
+        isShowValidateMessage,
+        validateMessage,
+      },
+      ref,
+    ) => (
+      <div className={styles.search_and_replace_container}>
+        <div className={styles.search_and_replace_fields}>
+          <div className={styles.search_field_container}>
+            <SearchRuleCheckout isDetailOpen={isDetailOpen} onDetailToggle={onDetailToggle} />
+            <div className={styles.search_field}>
+              <ValidateInput
+                id='search-input-field'
+                title={localize('search.input.placeholder')}
+                type='text'
+                value={searchValue}
+                placeholder={localize('search.input.title')}
+                onFocus={onSearchFocus}
+                onBlur={onSearchBlur}
+                onKeyUp={onSearch}
+                onChange={onSearchInputChange}
+                ref={ref}
+                validateMessage={isShowValidateMessage ? validateMessage : undefined}
+                addonAfter={[
+                  <span
+                    key={localize('search.caseDescription')}
+                    className={cls(getIcon('ab'), styles['match-case'], styles.search_option, {
+                      [styles.select]: isMatchCase,
+                    })}
+                    title={localize('search.caseDescription')}
+                    onClick={onMatchCaseToggle}
+                  ></span>,
+                  <span
+                    key={localize('search.wordsDescription')}
+                    className={cls(getIcon('abl'), styles['whole-word'], styles.search_option, {
+                      [styles.select]: isWholeWord,
+                    })}
+                    title={localize('search.wordsDescription')}
+                    onClick={onWholeWordToggle}
+                  ></span>,
+                  <span
+                    key={localize('search.regexDescription')}
+                    className={cls(getIcon('regex'), styles['use-regexp'], styles.search_option, {
+                      [styles.select]: isRegex,
+                    })}
+                    title={localize('search.regexDescription')}
+                    onClick={onRegexToggle}
+                  ></span>,
+                ]}
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    ),
+  ),
+  isSearchInputPropsEqual,
+);