@opensumi/ide-debug 2.21.9-rc-1671440760.0 → 2.21.9

package/src/browser/view/configuration/debug-toolbar.view.tsx

@@ -1,335 +0,0 @@
-import cls from 'classnames';
-import { action, observable } from 'mobx';
-import { observer } from 'mobx-react-lite';
-import React, { useEffect, useState } from 'react';
-
-import { Injectable } from '@opensumi/di';
-import { Option, Select } from '@opensumi/ide-components';
-import {
-  AppConfig,
-  getIcon,
-  localize,
-  PreferenceService,
-  useInjectable,
-  DisposableCollection,
-  electronEnv,
-  isMacintosh,
-} from '@opensumi/ide-core-browser';
-import { InlineMenuBar } from '@opensumi/ide-core-browser/lib/components/actions';
-import { Select as NativeSelect } from '@opensumi/ide-core-browser/lib/components/select';
-import { LAYOUT_VIEW_SIZE } from '@opensumi/ide-core-browser/lib/layout/constants';
-import { IElectronMainUIService } from '@opensumi/ide-core-common/lib/electron';
-
-import { DebugState } from '../../../common';
-import { DebugAction } from '../../components';
-import { DebugSession } from '../../debug-session';
-import { isExtensionHostDebugging } from '../../debugUtils';
-
-import styles from './debug-configuration.module.less';
-import { DebugConfigurationService } from './debug-configuration.service';
-import { DebugToolbarService } from './debug-toolbar.service';
-
-@Injectable()
-class FloatController {
-  @observable
-  x: number;
-
-  @observable
-  line: number;
-
-  @observable
-  enable: boolean;
-
-  private _origin: number;
-  private _last: number;
-
-  private _y: number;
-
-  constructor() {
-    this.x = 0;
-    this.line = 0;
-    this.enable = false;
-    this._origin = 0;
-    this._last = 0;
-    this._y = 0;
-  }
-
-  @action.bound
-  onMouseDown(e: React.MouseEvent<HTMLDivElement, MouseEvent>) {
-    this.enable = true;
-    this._origin = e.clientX;
-    this._y = e.clientY;
-  }
-
-  @action.bound
-  onMouseMove(e: React.MouseEvent<HTMLDivElement, MouseEvent>) {
-    e.stopPropagation();
-    if (this.enable) {
-      this.x = e.clientX - this._origin + this._last;
-      this.line = e.clientY - this._y > 10 ? 1 : 0;
-    }
-  }
-
-  @action.bound
-  onMouseUp() {
-    this.enable = false;
-    this._last = this.x;
-  }
-}
-
-export interface DebugToolbarViewProps {
-  float: boolean;
-}
-
-export const DebugToolbarView = observer((props: DebugToolbarViewProps) => {
-  const {
-    state,
-    toolBarMenuMap,
-    doStop,
-    doStepIn,
-    doStepOut,
-    doStepOver,
-    doContinue,
-    doRestart,
-    doPause,
-    currentSession,
-    sessions,
-    updateCurrentSession,
-  } = useInjectable<DebugToolbarService>(DebugToolbarService);
-  const { isElectronRenderer } = useInjectable<AppConfig>(AppConfig);
-  const isAttach =
-    !!currentSession &&
-    currentSession.configuration.request === 'attach' &&
-    !isExtensionHostDebugging(currentSession.configuration);
-
-  const currentSessionId = currentSession && currentSession.id;
-
-  const renderToolBar = (session: DebugSession | undefined): React.ReactNode => {
-    if (session && session.id && toolBarMenuMap.has(session.id)) {
-      return <InlineMenuBar menus={toolBarMenuMap.get(session.id)!} />;
-    }
-    return null;
-  };
-  const renderStop = (state: DebugState): React.ReactNode => {
-    if (isAttach) {
-      return (
-        <DebugAction
-          run={doStop}
-          enabled={typeof state === 'number' && state !== DebugState.Inactive}
-          icon={'disconnect'}
-          label={localize('debug.action.disattach')}
-        />
-      );
-    }
-    return (
-      <DebugAction
-        run={doStop}
-        enabled={typeof state === 'number' && state !== DebugState.Inactive}
-        icon={'stop'}
-        label={localize('debug.action.stop')}
-      />
-    );
-  };
-  const renderContinue = (state: DebugState): React.ReactNode => {
-    if (state === DebugState.Stopped) {
-      return <DebugAction run={doContinue} icon={'continue'} label={localize('debug.action.continue')} />;
-    }
-    return (
-      <DebugAction
-        run={doPause}
-        enabled={typeof state === 'number' && state === DebugState.Running}
-        icon={'pause'}
-        label={localize('debug.action.pause')}
-      />
-    );
-  };
-
-  const renderSessionOptions = (sessions: DebugSession[]) =>
-    sessions.map((session: DebugSession) => {
-      if (isElectronRenderer) {
-        return (
-          <option key={session.id} value={session.id}>
-            {session.label}
-          </option>
-        );
-      }
-      return (
-        <Option key={session.id} label={session.label} value={session.id}>
-          {session.label}
-        </Option>
-      );
-    });
-
-  const renderSelections = (sessions: DebugSession[]) => {
-    if (sessions.length > 1) {
-      return (
-        <div className={cls(styles.debug_selection)}>
-          {isElectronRenderer ? (
-            <NativeSelect value={currentSessionId} onChange={setCurrentSession}>
-              {renderSessionOptions(sessions)}
-            </NativeSelect>
-          ) : (
-            <Select
-              className={cls(styles.debug_selection, styles.special_radius)}
-              size={props.float ? 'small' : 'default'}
-              value={currentSessionId}
-              options={sessions.map((s) => ({ label: s.label, value: s.id }))}
-              onChange={setCurrentSession}
-            >
-              {renderSessionOptions(sessions)}
-            </Select>
-          )}
-        </div>
-      );
-    }
-  };
-
-  const setCurrentSession = (event: React.ChangeEvent<HTMLSelectElement> | string | number) => {
-    let value = event;
-    if (isElectronRenderer) {
-      value = (event as React.ChangeEvent<HTMLSelectElement>).target.value;
-    }
-
-    if (!sessions) {
-      return;
-    }
-    for (const session of sessions) {
-      if (session.id === value) {
-        updateCurrentSession(session);
-      }
-    }
-  };
-
-  return (
-    <React.Fragment>
-      <div className={styles.debug_action_bar}>
-        {renderSelections(sessions.filter((s: DebugSession) => !s.parentSession))}
-        <div className={styles.debug_actions}>
-          {renderContinue(state)}
-          <DebugAction
-            run={doStepOver}
-            enabled={typeof state === 'number' && state === DebugState.Stopped}
-            icon={'step'}
-            label={localize('debug.action.step-over')}
-          />
-          <DebugAction
-            run={doStepIn}
-            enabled={typeof state === 'number' && state === DebugState.Stopped}
-            icon={'step-in'}
-            label={localize('debug.action.step-into')}
-          />
-          <DebugAction
-            run={doStepOut}
-            enabled={typeof state === 'number' && state === DebugState.Stopped}
-            icon={'step-out'}
-            label={localize('debug.action.step-out')}
-          />
-          <DebugAction
-            run={doRestart}
-            enabled={typeof state === 'number' && state !== DebugState.Inactive}
-            icon={'reload'}
-            label={localize('debug.action.restart')}
-          />
-          {renderStop(state)}
-          {renderToolBar(currentSession)}
-        </div>
-      </div>
-    </React.Fragment>
-  );
-});
-
-const DebugPreferenceTopKey = 'debug.toolbar.top';
-const DebugPreferenceHeightKey = 'debug.toolbar.height';
-
-const FloatDebugToolbarView = observer(() => {
-  const controller = useInjectable<FloatController>(FloatController);
-  const preference = useInjectable<PreferenceService>(PreferenceService);
-  const { isElectronRenderer } = useInjectable<AppConfig>(AppConfig);
-  const debugToolbarService = useInjectable<DebugToolbarService>(DebugToolbarService);
-  const [toolbarOffsetTop, setToolbarOffsetTop] = useState<number>(0);
-  const { state } = debugToolbarService;
-
-  useEffect(() => {
-    const disposableCollection = new DisposableCollection();
-    const value = preference.get<number>(DebugPreferenceTopKey) || 0;
-    if (isElectronRenderer) {
-      const uiService: IElectronMainUIService = debugToolbarService.mainUIService;
-      const isNewMacHeaderBar = () => isMacintosh && parseFloat(electronEnv.osRelease) >= 20;
-      // Electron 环境下需要在非全屏情况下追加 Header 高度
-      uiService.isFullScreen(electronEnv.currentWindowId).then((fullScreen) => {
-        fullScreen
-          ? setToolbarOffsetTop(value)
-          : setToolbarOffsetTop(
-              value +
-                (isNewMacHeaderBar() ? LAYOUT_VIEW_SIZE.TITLEBAR_HEIGHT : LAYOUT_VIEW_SIZE.BIG_SUR_TITLEBAR_HEIGHT),
-            );
-      });
-      disposableCollection.push(
-        uiService.on('fullScreenStatusChange', (windowId, fullScreen) => {
-          if (windowId === electronEnv.currentWindowId) {
-            fullScreen
-              ? setToolbarOffsetTop(value)
-              : setToolbarOffsetTop(
-                  value +
-                    (isNewMacHeaderBar() ? LAYOUT_VIEW_SIZE.TITLEBAR_HEIGHT : LAYOUT_VIEW_SIZE.BIG_SUR_TITLEBAR_HEIGHT),
-                );
-          }
-        }),
-      );
-    } else {
-      setToolbarOffsetTop(value);
-    }
-    return () => {
-      disposableCollection.dispose();
-    };
-  }, []);
-
-  const customHeight = preference.get<number>(DebugPreferenceHeightKey) || 0;
-
-  const debugToolbarWrapperClass = cls({
-    [styles.debug_toolbar_wrapper]: true,
-    [styles.debug_toolbar_wrapper_electron]: isElectronRenderer,
-  });
-
-  if (state) {
-    return (
-      <div
-        style={{ pointerEvents: controller.enable ? 'all' : 'none' }}
-        className={styles.debug_toolbar_container}
-        onMouseMove={(e) => controller.onMouseMove(e)}
-        onMouseUp={(e) => controller.onMouseUp()}
-      >
-        <div
-          style={{
-            transform: `translateX(${controller.x}px) translateY(${
-              toolbarOffsetTop + controller.line * customHeight
-            }px)`,
-            height: `${customHeight}px`,
-          }}
-          className={debugToolbarWrapperClass}
-        >
-          <div className={cls(styles.debug_toolbar_drag_wrapper)}>
-            <div
-              className={cls(getIcon('drag'), styles.debug_toolbar_drag)}
-              onMouseDown={(e) => controller.onMouseDown(e)}
-              onMouseMove={(e) => controller.onMouseMove(e)}
-            ></div>
-          </div>
-          <DebugToolbarView float />
-        </div>
-      </div>
-    );
-  }
-
-  controller.enable = false;
-  return null;
-});
-
-export const DebugToolbarOverlayWidget = observer(() => {
-  const { float } = useInjectable<DebugConfigurationService>(DebugConfigurationService);
-  if (!float) {
-    return null;
-  }
-
-  return <FloatDebugToolbarView />;
-});

package/src/browser/view/console/debug-console-filter.model.ts

@@ -1,49 +0,0 @@
-import { Injectable } from '@opensumi/di';
-import { splitGlobAware, matchesFuzzy } from '@opensumi/ide-core-browser';
-
-interface ParsedQuery {
-  type: 'include' | 'exclude';
-  query: string;
-}
-
-@Injectable({ multiple: true })
-export class DebugConsoleFilterModel {
-  static matchQuery = matchesFuzzy;
-
-  private _parsedQueries: ParsedQuery[] = [];
-  set filterQuery(query: string) {
-    this._parsedQueries = [];
-    query = query.trim();
-
-    if (query && query !== '') {
-      const filters = splitGlobAware(query, ',')
-        .map((s) => s.trim())
-        .filter((s) => !!s.length);
-      for (const f of filters) {
-        if (f.startsWith('!')) {
-          this._parsedQueries.push({ type: 'exclude', query: f.slice(1) });
-        } else {
-          this._parsedQueries.push({ type: 'include', query: f });
-        }
-      }
-    }
-  }
-
-  filter(text: string): boolean {
-    let includeQueryPresent = false;
-    let includeQueryMatched = false;
-
-    for (const { type, query } of this._parsedQueries) {
-      if (type === 'exclude' && DebugConsoleFilterModel.matchQuery(query, text)) {
-        return false;
-      } else if (type === 'include') {
-        includeQueryPresent = true;
-        if (DebugConsoleFilterModel.matchQuery(query, text)) {
-          includeQueryMatched = true;
-        }
-      }
-    }
-
-    return includeQueryPresent && includeQueryMatched;
-  }
-}

package/src/browser/view/console/debug-console-filter.service.ts

@@ -1,81 +0,0 @@
-import { Injectable } from '@opensumi/di';
-import { Emitter, Event, strings } from '@opensumi/ide-core-browser';
-
-import { matchAll } from '../../debugUtils';
-
-import { DebugConsoleFilterModel } from './debug-console-filter.model';
-
-const Ansi = require('anser');
-const { convertSimple2RegExpPattern } = strings;
-
-export interface IDebugConsoleFilter {
-  filter: (t: string) => boolean;
-}
-
-export interface IFilterMatches {
-  startIndex: number;
-  count: number;
-}
-
-@Injectable()
-export class DebugConsoleFilterService implements IDebugConsoleFilter {
-  private readonly filterModel: DebugConsoleFilterModel;
-
-  constructor() {
-    this.filterModel = new DebugConsoleFilterModel();
-  }
-
-  private readonly _onDidValueChange: Emitter<string> = new Emitter<string>();
-  get onDidValueChange(): Event<string> {
-    return this._onDidValueChange.event;
-  }
-
-  private readonly _onDidFocus: Emitter<void> = new Emitter<void>();
-  get onDidFocus(): Event<void> {
-    return this._onDidFocus.event;
-  }
-
-  private _filterText = '';
-
-  public focusInput(): void {
-    this._onDidFocus.fire();
-  }
-
-  public get filterText(): string {
-    return this._filterText;
-  }
-
-  public setFilterText(v: string): this {
-    if (this._filterText !== v) {
-      this._filterText = v;
-      this.filterModel.filterQuery = this._filterText;
-      this._onDidValueChange.fire(this._filterText);
-    }
-    return this;
-  }
-
-  public filter(text: string): boolean {
-    const ansiToText = Ansi.ansiToText(text);
-    return this._filterText === '' || this.filterModel.filter(ansiToText);
-  }
-
-  public findMatches(text: string): IFilterMatches[] {
-    const regexp = new RegExp(convertSimple2RegExpPattern(this._filterText.toLowerCase()), 'g');
-    if (this._filterText.trim() === '') {
-      return [];
-    }
-
-    const matchs = matchAll(text.toLowerCase(), regexp);
-    const textLen = this._filterText.length;
-    if (textLen === 0) {
-      return [];
-    }
-
-    const res: IFilterMatches[] = matchs.map((m) => ({
-      startIndex: m.index !== undefined ? m.index : -1,
-      count: textLen,
-    }));
-
-    return res.filter((r) => r.startIndex >= 0);
-  }
-}

package/src/browser/view/console/debug-console-filter.view.tsx

@@ -1,78 +0,0 @@
-import debounce from 'lodash/debounce';
-import { observer } from 'mobx-react-lite';
-import React from 'react';
-
-import { HistoryInputBox, IHistoryInputBoxHandler } from '@opensumi/ide-components/lib/input/HistoryInputBox';
-import { localize } from '@opensumi/ide-core-browser';
-import { useInjectable } from '@opensumi/ide-core-browser';
-import { Key } from '@opensumi/ide-core-browser';
-
-import { DebugConsoleFilterService } from './debug-console-filter.service';
-import styles from './debug-console.module.less';
-
-/**
- * 调试控制台筛选器
- */
-export const DebugConsoleFilterView = observer(() => {
-  const debugConsoleFilterService = useInjectable<DebugConsoleFilterService>(DebugConsoleFilterService);
-  const [filterValue, setFilterValue] = React.useState<string>('');
-  const [historyApi, setHistoryApi] = React.useState<IHistoryInputBoxHandler>();
-
-  const onDebounceValueChange = debounce((value: string) => {
-    setFilterValue(value);
-    debugConsoleFilterService.setFilterText(value);
-    if (historyApi) {
-      historyApi.addToHistory(value);
-    }
-  }, 400);
-
-  React.useEffect(() => {
-    const filterDispose = debugConsoleFilterService.onDidValueChange((value: string) => {
-      setFilterValue(value);
-    });
-    return () => {
-      filterDispose.dispose();
-    };
-  }, []);
-
-  const onReady = (api: IHistoryInputBoxHandler) => {
-    setHistoryApi(api);
-  };
-
-  const onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-    if (!historyApi) {
-      return;
-    }
-
-    if (e.keyCode === Key.ARROW_UP.keyCode) {
-      historyApi.showPreviousValue();
-    } else if (e.keyCode === Key.ARROW_DOWN.keyCode) {
-      historyApi.showNextValue();
-    }
-  };
-
-  React.useEffect(() => {
-    const focusDispose = debugConsoleFilterService.onDidFocus(() => {
-      if (historyApi) {
-        historyApi.focus();
-      }
-    });
-    return () => {
-      focusDispose.dispose();
-    };
-  }, [historyApi]);
-
-  return (
-    <div className={styles.debug_console_filter}>
-      <HistoryInputBox
-        hasClear
-        className={styles.filter_input}
-        value={filterValue}
-        placeholder={localize('debug.console.filter.placeholder')}
-        onValueChange={onDebounceValueChange}
-        onReady={onReady}
-        onKeyDown={onKeyDown}
-      ></HistoryInputBox>
-    </div>
-  );
-});

package/src/browser/view/console/debug-console-model.ts

@@ -1,48 +0,0 @@
-import { Injectable, Optional } from '@opensumi/di';
-import { TreeModel, TreeNodeEvent, CompositeTreeNode } from '@opensumi/ide-components';
-import { ThrottledDelayer, Emitter, Event } from '@opensumi/ide-core-browser';
-
-import { ExpressionContainer } from '../../tree/debug-tree-node.define';
-
-@Injectable({ multiple: true })
-export class DebugConsoleTreeModel extends TreeModel {
-  static DEFAULT_FLUSH_DELAY = 100;
-
-  private flushDispatchChangeDelayer = new ThrottledDelayer<void>(DebugConsoleTreeModel.DEFAULT_FLUSH_DELAY);
-  private onWillUpdateEmitter: Emitter<void> = new Emitter();
-  private _tempScrollOffset = 0;
-
-  constructor(@Optional() root: ExpressionContainer) {
-    super();
-    this.init(root);
-  }
-
-  get onWillUpdate(): Event<void> {
-    return this.onWillUpdateEmitter.event;
-  }
-
-  /**
-   * 判断是否滚动到了底部
-   * TODO: //临时处理 by @Ricbet
-   */
-  get isScrollBottom(): boolean {
-    this._tempScrollOffset = Math.max(this.state.scrollOffset, this._tempScrollOffset);
-    return this._tempScrollOffset === this.state.scrollOffset;
-  }
-
-  init(root: CompositeTreeNode) {
-    this.root = root;
-    // 分支更新时通知树刷新, 不是立即更新，而是延迟更新，待树稳定后再更新
-    // 100ms的延迟并不能保证树稳定，特别是在node_modules展开的情况下
-    // 但在普通使用上已经足够可用，即不会有渲染闪烁问题
-    this.root.watcher.on(TreeNodeEvent.BranchDidUpdate, () => {
-      if (!this.flushDispatchChangeDelayer.isTriggered()) {
-        this.flushDispatchChangeDelayer.cancel();
-      }
-      this.flushDispatchChangeDelayer.trigger(async () => {
-        await this.onWillUpdateEmitter.fireAndAwait();
-        this.dispatchChange();
-      });
-    });
-  }
-}