@opensumi/ide-debug 3.5.1-next-1730948411.0 → 3.5.1-next-1730963433.0

package/src/browser/view/configuration/debug-configuration.service.ts

@@ -1,7 +1,6 @@
-import { action, makeObservable, observable, runInAction } from 'mobx';
-
 import { Autowired, Injectable } from '@opensumi/di';
 import { IEventBus, PreferenceConfigurations, PreferenceService, URI, isUndefined } from '@opensumi/ide-core-browser';
+import { observableValue, transaction } from '@opensumi/ide-monaco/lib/common/observable';
 import { IWorkspaceService } from '@opensumi/ide-workspace';
 import { WorkspaceVariableContribution } from '@opensumi/ide-workspace/lib/browser/workspace-variable-contribution';
 
@@ -51,27 +50,15 @@ export class DebugConfigurationService {
   private _whenReady: Promise<void>;
 
   constructor() {
-    makeObservable(this);
     this._whenReady = this.init();
   }
 
-  @observable
-  currentValue: string = DEFAULT_ADD_CONFIGURATION_KEY;
-
-  @observable
-  float = true;
-
-  @observable
-  isMultiRootWorkspace: boolean;
-
-  @observable.shallow
-  workspaceRoots: string[] = observable.array([]);
-
-  @observable.shallow
-  configurationOptions: DebugSessionOptions[] = observable.array([]);
-
-  @observable.shallow
-  dynamicConfigurations: DebugConfigurationType[] = [];
+  currentValue = observableValue(this, DEFAULT_ADD_CONFIGURATION_KEY);
+  float = observableValue(this, false);
+  configurationOptions = observableValue<DebugSessionOptions[]>(this, []);
+  dynamicConfigurations = observableValue<DebugConfigurationType[]>(this, []);
+  isMultiRootWorkspace = observableValue(this, false);
+  workspaceRoots = observableValue<string[]>(this, []);
 
   get whenReady() {
     return this._whenReady;
@@ -88,7 +75,7 @@ export class DebugConfigurationService {
     this.preferenceService.onPreferenceChanged((event) => {
       const { preferenceName, newValue } = event;
       if (preferenceName === 'debug.toolbar.float') {
-        if (this.float !== newValue) {
+        if (this.float.get() !== newValue) {
           this.updateFloat(newValue);
         }
       }
@@ -107,30 +94,33 @@ export class DebugConfigurationService {
 
   async updateWorkspaceState() {
     const roots = (await this.workspaceService.tryGetRoots()).map((root) => root.uri);
-    runInAction(() => {
-      this.isMultiRootWorkspace = this.workspaceService.isMultiRootWorkspaceOpened;
-      this.workspaceRoots = roots;
+    transaction((tx) => {
+      this.isMultiRootWorkspace.set(this.workspaceService.isMultiRootWorkspaceOpened, tx);
+      this.workspaceRoots.set(roots, tx);
     });
   }
 
-  @action
   async updateDynamicConfigurations() {
-    this.dynamicConfigurations = await this.debugConfigurationManager.getDynamicConfigurationsSupportTypes();
+    const types = await this.debugConfigurationManager.getDynamicConfigurationsSupportTypes();
+    transaction((tx) => {
+      this.dynamicConfigurations.set(types, tx);
+    });
   }
 
-  @action
   updateFloat(value: boolean) {
-    this.float = value;
+    this.float.set(value, undefined);
   }
 
-  @action
   updateCurrentValue(value: string) {
-    this.currentValue = value;
+    transaction((tx) => {
+      this.currentValue.set(value, tx);
+    });
   }
 
-  @action
   async updateConfigurationOptions() {
-    this.configurationOptions = this.debugConfigurationManager.all;
+    transaction((tx) => {
+      this.configurationOptions.set(this.debugConfigurationManager.all, tx);
+    });
     const { current } = this.debugConfigurationManager;
     if (current) {
       const currentValue = this.toValue(current);
@@ -203,13 +193,12 @@ export class DebugConfigurationService {
     if (config) {
       this.debugSessionManager.start({
         configuration: config,
-        workspaceFolderUri: this.workspaceRoots[0],
+        workspaceFolderUri: this.workspaceRoots.get()[0],
         index: -1,
       });
     }
   };
 
-  @action.bound
   toValue({ configuration, workspaceFolderUri, index }: DebugSessionOptions) {
     if (!workspaceFolderUri) {
       return configuration.name;
@@ -219,7 +208,7 @@ export class DebugConfigurationService {
       if (options && options.index) {
         return this.toValue(options);
       }
-      return this.currentValue;
+      return this.currentValue.get();
     }
     return (
       configuration.name +

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

@@ -1,9 +1,8 @@
 import cls from 'classnames';
-import { observer } from 'mobx-react-lite';
 import React from 'react';
 
 import { Option, Popover, Select } from '@opensumi/ide-components';
-import { AppConfig, URI, localize, useInjectable } from '@opensumi/ide-core-browser';
+import { AppConfig, URI, localize, useAutorun, useInjectable } from '@opensumi/ide-core-browser';
 import { Select as NativeSelect } from '@opensumi/ide-core-browser/lib/components/select';
 
 import {
@@ -260,8 +259,9 @@ export const DebugActionBar = React.memo(({ runDebug, openConfiguration, openDeb
   </div>
 ));
 
-export const DebugConfigurationContainerView = observer(() => {
-  const { float } = useInjectable<DebugConfigurationService>(DebugConfigurationService);
+export const DebugConfigurationContainerView = () => {
+  const debugConfigurationService = useInjectable<DebugConfigurationService>(DebugConfigurationService);
+  const float = useAutorun(debugConfigurationService.float);
 
   return (
     <>
@@ -269,7 +269,7 @@ export const DebugConfigurationContainerView = observer(() => {
       {!float && <DebugToolbarView float={false} className={styles.debug_action_bar_internal} />}
     </>
   );
-});
+};
 
 export interface DebugControllerViewProps {
   className?: string;
@@ -280,21 +280,27 @@ export interface DebugControllerViewProps {
  * 该组件支持用户导入
  * 后续如果有一些改动需要考虑是否有 breakchange
  */
-export const DebugControllerView = observer((props: DebugControllerViewProps) => {
+export const DebugControllerView = (props: DebugControllerViewProps) => {
   const {
-    configurationOptions,
-    dynamicConfigurations,
     toValue,
-    currentValue,
     openConfiguration,
     addConfiguration,
     openDebugConsole,
     updateConfiguration,
     start,
     showDynamicQuickPick,
+    currentValue,
+    configurationOptions,
+    dynamicConfigurations,
     isMultiRootWorkspace,
     workspaceRoots,
   } = useInjectable<DebugConfigurationService>(DebugConfigurationService);
+  const autorunDynamicConfigurations = useAutorun(dynamicConfigurations);
+  const autorunCurrentValue = useAutorun(currentValue);
+  const autorunConfigurationOptions = useAutorun(configurationOptions);
+  const autorunIsMultiRootWorkspace = useAutorun(isMultiRootWorkspace);
+  const autorunWorkspaceRoots = useAutorun(workspaceRoots);
+
   const appConfig = useInjectable<AppConfig>(AppConfig);
   const addConfigurationLabel = localize('debug.action.add.configuration');
   const editConfigurationLabel = localize('debug.action.edit.configuration');
@@ -329,16 +335,16 @@ export const DebugControllerView = observer((props: DebugControllerViewProps) =>
   return (
     <div className={cls(styles.debug_configuration_toolbar, props.className || '')}>
       <ConfigurationSelector
-        currentValue={currentValue}
-        options={configurationOptions}
-        dynamicOptions={dynamicConfigurations}
+        currentValue={autorunCurrentValue}
+        options={autorunConfigurationOptions}
+        dynamicOptions={autorunDynamicConfigurations}
+        workspaceRoots={autorunWorkspaceRoots}
+        isMultiRootWorkspace={autorunIsMultiRootWorkspace}
         onChangeConfiguration={setCurrentConfiguration}
-        isMultiRootWorkspace={isMultiRootWorkspace}
         addConfigurationLabel={addConfigurationLabel}
         editConfigurationLabel={editConfigurationLabel}
         toValue={toValue}
         isElectronRenderer={appConfig.isElectronRenderer}
-        workspaceRoots={workspaceRoots}
       />
       {CustomActionBar ? (
         <CustomActionBar />
@@ -347,4 +353,4 @@ export const DebugControllerView = observer((props: DebugControllerViewProps) =>
       )}
     </div>
   );
-});
+};

package/src/browser/view/configuration/debug-toolbar.service.ts

@@ -1,9 +1,8 @@
-import { action, makeObservable, observable } from 'mobx';
-
 import { Autowired, INJECTOR_TOKEN, Injectable, Injector } from '@opensumi/di';
 import { IContextKeyService, IReporterService, memoize } from '@opensumi/ide-core-browser';
 import { AbstractContextMenuService, IContextMenu, MenuId } from '@opensumi/ide-core-browser/lib/menu/next';
 import { IElectronMainUIService } from '@opensumi/ide-core-common/lib/electron';
+import { observableValue, transaction } from '@opensumi/ide-monaco/lib/common/observable';
 
 import { DEBUG_REPORT_NAME, DebugState } from '../../../common';
 import { DebugSession } from '../../debug-session';
@@ -26,22 +25,13 @@ export class DebugToolbarService {
   @Autowired(INJECTOR_TOKEN)
   private readonly injector: Injector;
 
-  @observable
-  state: DebugState = DebugState.Inactive;
-
-  @observable
-  sessionCount: number;
-
-  @observable.shallow
-  currentSession: DebugSession | undefined;
-
-  @observable.shallow
-  sessions: DebugSession[] = [];
+  state = observableValue(this, DebugState.Inactive);
+  currentSession = observableValue<DebugSession | undefined>(this, undefined);
+  sessions = observableValue<DebugSession[]>(this, []);
 
   public readonly toolBarMenuMap: Map<string, IContextMenu> = new Map();
 
   constructor() {
-    makeObservable(this);
     this.model.onDidChange(() => {
       this.updateToolBarMenu();
       this.updateModel();
@@ -53,28 +43,31 @@ export class DebugToolbarService {
     return this.injector.get(IElectronMainUIService);
   }
 
-  @action
   updateModel() {
-    this.state = this.model.state;
-    this.currentSession = this.model.currentSession;
-    this.sessions = Array.from(this.model.sessions).filter(
-      (session: DebugSession) => session && session.state > DebugState.Inactive,
-    );
-    this.sessionCount = this.sessions.length;
+    transaction((tx) => {
+      this.state.set(this.model.state, tx);
+      this.currentSession.set(this.model.currentSession, tx);
+      this.sessions.set(
+        Array.from(this.model.sessions).filter(
+          (session: DebugSession) => session && session.state > DebugState.Inactive,
+        ),
+        tx,
+      );
+    });
   }
 
-  @action
   updateToolBarMenu() {
-    if (this.currentSession && this.currentSession.id && !this.toolBarMenuMap.has(this.currentSession.id)) {
+    const currentSession = this.currentSession.get();
+    if (currentSession && currentSession.id && !this.toolBarMenuMap.has(currentSession.id)) {
       const contextMenu = this.contextMenuService.createMenu({
         id: MenuId.DebugToolBar,
         contextKeyService: this.contextKeyService.createScoped(),
       });
-      this.currentSession.on('terminated', () => {
-        this.toolBarMenuMap.delete(this.currentSession?.id!);
+      currentSession.on('terminated', () => {
+        this.toolBarMenuMap.delete(currentSession.id);
       });
 
-      this.toolBarMenuMap.set(this.currentSession.id, contextMenu);
+      this.toolBarMenuMap.set(currentSession.id, contextMenu);
     }
   }
 
@@ -86,7 +79,7 @@ export class DebugToolbarService {
     this.model.reportAction(session.id, threadId, name);
     const extra = {
       type: languageType,
-      request: this.currentSession?.configuration.request,
+      request: this.currentSession.get()?.configuration?.request,
       sessionId: session.id,
       threadId,
     };
@@ -97,7 +90,7 @@ export class DebugToolbarService {
     };
   }
 
-  doStart = () => this.model.start();
+  doStart = async () => await this.model.start();
 
   doRestart = async () => {
     const reportTimeEnd = this.instrumentReporter('restart');

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

@@ -1,6 +1,4 @@
 import cls from 'classnames';
-import { action, makeObservable, observable } from 'mobx';
-import { observer } from 'mobx-react-lite';
 import React, { useCallback, useEffect, useState } from 'react';
 
 import { Injectable } from '@opensumi/di';
@@ -12,6 +10,7 @@ import {
   electronEnv,
   getIcon,
   localize,
+  useAutorun,
   useDesignStyles,
   useInjectable,
 } from '@opensumi/ide-core-browser';
@@ -19,6 +18,7 @@ import { InlineMenuBar } from '@opensumi/ide-core-browser/lib/components/actions
 import { Select as NativeSelect } from '@opensumi/ide-core-browser/lib/components/select';
 import { LayoutViewSizeConfig } from '@opensumi/ide-core-browser/lib/layout/constants';
 import { IElectronMainUIService } from '@opensumi/ide-core-common/lib/electron';
+import { derived, observableValue, transaction } from '@opensumi/ide-monaco/lib/common/observable';
 
 import { DebugState } from '../../../common';
 import { DebugAction } from '../../components';
@@ -31,50 +31,45 @@ 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() {
-    makeObservable(this);
-    this.x = 0;
-    this.line = 0;
-    this.enable = false;
-    this._origin = 0;
-    this._last = 0;
-    this._y = 0;
+  private _x = observableValue(this, 0);
+  private _line = observableValue(this, 0);
+  private _enable = observableValue(this, false);
+
+  private y: number = 0;
+  private last: number = 0;
+  private origin: number = 0;
+
+  state = derived(this, (reader) => ({
+      enable: this._enable.read(reader),
+      x: this._x.read(reader),
+      line: this._line.read(reader),
+    }));
+
+  setEnable(value: boolean) {
+    transaction((tx) => {
+      this._enable.set(value, tx);
+    });
   }
 
-  @action.bound
   onMouseDown(e: React.MouseEvent<HTMLDivElement, MouseEvent>) {
-    this.enable = true;
-    this._origin = e.clientX;
-    this._y = e.clientY;
+    this.setEnable(true);
+    this.y = e.clientY;
+    this.origin = e.clientX;
   }
 
-  @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;
-    }
+    transaction((tx) => {
+      if (this._enable.get()) {
+        this._x.set(e.clientX - this.origin + this.last, tx);
+        this._line.set(e.clientY - this.y > 10 ? 1 : 0, tx);
+      }
+    });
   }
 
-  @action.bound
   onMouseUp() {
-    this.enable = false;
-    this._last = this.x;
+    this.setEnable(false);
+    this.last = this._x.get();
   }
 }
 
@@ -87,7 +82,7 @@ export interface DebugToolbarViewProps {
  * 该组件支持用户导入
  * 后续如果有一些改动需要考虑是否有 breakchange
  */
-export const DebugToolbarView = observer((props: DebugToolbarViewProps) => {
+export const DebugToolbarView = (props: DebugToolbarViewProps) => {
   const {
     state,
     toolBarMenuMap,
@@ -102,13 +97,17 @@ export const DebugToolbarView = observer((props: DebugToolbarViewProps) => {
     sessions,
     updateCurrentSession,
   } = useInjectable<DebugToolbarService>(DebugToolbarService);
+  const autorunState = useAutorun(state);
+  const autorunCurrentSession = useAutorun(currentSession);
+  const autorunSessions = useAutorun(sessions);
+
   const { isElectronRenderer } = useInjectable<AppConfig>(AppConfig);
   const isAttach =
-    !!currentSession &&
-    currentSession.configuration.request === 'attach' &&
-    !isExtensionHostDebugging(currentSession.configuration);
+    !!autorunCurrentSession &&
+    autorunCurrentSession.configuration?.request === 'attach' &&
+    !isExtensionHostDebugging(autorunCurrentSession.configuration);
 
-  const currentSessionId = currentSession && currentSession.id;
+  const currentSessionId = autorunCurrentSession && autorunCurrentSession.id;
 
   const renderToolBar = useCallback(
     (session: DebugSession | undefined): React.ReactNode => {
@@ -129,7 +128,7 @@ export const DebugToolbarView = observer((props: DebugToolbarViewProps) => {
         return (
           <DebugAction
             run={doStop}
-            enabled={typeof state === 'number' && state !== DebugState.Inactive}
+            enabled={autorunState !== DebugState.Inactive}
             icon={'disconnect'}
             label={localize('debug.action.disattach')}
           />
@@ -138,7 +137,7 @@ export const DebugToolbarView = observer((props: DebugToolbarViewProps) => {
       return (
         <DebugAction
           run={doStop}
-          enabled={typeof state === 'number' && state !== DebugState.Inactive}
+          enabled={autorunState !== DebugState.Inactive}
           icon={'stop'}
           label={localize('debug.action.stop')}
         />
@@ -155,7 +154,7 @@ export const DebugToolbarView = observer((props: DebugToolbarViewProps) => {
       return (
         <DebugAction
           run={doPause}
-          enabled={typeof state === 'number' && state === DebugState.Running}
+          enabled={autorunState === DebugState.Running}
           icon={'pause'}
           label={localize('debug.action.pause')}
         />
@@ -183,29 +182,32 @@ export const DebugToolbarView = observer((props: DebugToolbarViewProps) => {
     [],
   );
 
-  const renderSelections = useCallback((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 renderSelections = useCallback(
+    (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>
+        );
+      }
+    },
+    [currentSessionId],
+  );
 
   const setCurrentSession = useCallback(
     (event: React.ChangeEvent<HTMLSelectElement> | string | number) => {
@@ -214,66 +216,69 @@ export const DebugToolbarView = observer((props: DebugToolbarViewProps) => {
         value = (event as React.ChangeEvent<HTMLSelectElement>).target.value;
       }
 
-      if (!sessions) {
+      if (!autorunSessions) {
         return;
       }
-      for (const session of sessions) {
+      for (const session of autorunSessions) {
         if (session.id === value) {
           updateCurrentSession(session);
         }
       }
     },
-    [updateCurrentSession],
+    [autorunSessions, updateCurrentSession],
   );
 
   return (
     <div className={cls(styles.debug_action_bar, props.className || '')}>
-      {renderSelections(sessions.filter((s: DebugSession) => !s.parentSession))}
+      {renderSelections(autorunSessions.filter((s: DebugSession) => !s.parentSession))}
       <div className={styles.debug_actions}>
-        {renderContinue(state)}
+        {renderContinue(autorunState)}
         <DebugAction
           run={doStepOver}
-          enabled={typeof state === 'number' && state === DebugState.Stopped}
+          enabled={autorunState === DebugState.Stopped}
           icon={'step'}
           label={localize('debug.action.step-over')}
         />
         <DebugAction
           run={doStepIn}
-          enabled={typeof state === 'number' && state === DebugState.Stopped}
+          enabled={autorunState === DebugState.Stopped}
           icon={'step-in'}
           label={localize('debug.action.step-into')}
         />
         <DebugAction
           run={doStepOut}
-          enabled={typeof state === 'number' && state === DebugState.Stopped}
+          enabled={autorunState === DebugState.Stopped}
           icon={'step-out'}
           label={localize('debug.action.step-out')}
         />
         <DebugAction
           run={doRestart}
-          enabled={typeof state === 'number' && state !== DebugState.Inactive}
+          enabled={autorunState !== DebugState.Inactive}
           icon={'reload'}
           label={localize('debug.action.restart')}
         />
-        {renderStop(state)}
-        {renderToolBar(currentSession)}
+        {renderStop(autorunState)}
+        {renderToolBar(autorunCurrentSession)}
       </div>
     </div>
   );
-});
+};
 
 const DebugPreferenceTopKey = 'debug.toolbar.top';
 const DebugPreferenceHeightKey = 'debug.toolbar.height';
 
-const FloatDebugToolbarView = observer(() => {
-  const controller = useInjectable<FloatController>(FloatController);
+const FloatDebugToolbarView = () => {
   const preference = useInjectable<PreferenceService>(PreferenceService);
   const { isElectronRenderer } = useInjectable<AppConfig>(AppConfig);
   const layoutViewSize = useInjectable<LayoutViewSizeConfig>(LayoutViewSizeConfig);
-  const debugToolbarService = useInjectable<DebugToolbarService>(DebugToolbarService);
   const styles_debug_toolbar_wrapper = useDesignStyles(styles.debug_toolbar_wrapper, 'debug_toolbar_wrapper');
   const [toolbarOffsetTop, setToolbarOffsetTop] = useState<number>(0);
-  const { state } = debugToolbarService;
+
+  const controller = useInjectable<FloatController>(FloatController);
+  const derivedController = useAutorun(controller.state);
+
+  const debugToolbarService = useInjectable<DebugToolbarService>(DebugToolbarService);
+  const state = useAutorun(debugToolbarService.state);
 
   useEffect(() => {
     const disposableCollection = new DisposableCollection();
@@ -311,15 +316,15 @@ const FloatDebugToolbarView = observer(() => {
   if (state) {
     return (
       <div
-        style={{ pointerEvents: controller.enable ? 'all' : 'none' }}
+        style={{ pointerEvents: derivedController.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
+            transform: `translateX(${derivedController.x}px) translateY(${
+              toolbarOffsetTop + derivedController.line * customHeight
             }px)`,
             height: `${customHeight}px`,
           }}
@@ -338,15 +343,17 @@ const FloatDebugToolbarView = observer(() => {
     );
   }
 
-  controller.enable = false;
+  controller.setEnable(false);
   return null;
-});
+};
+
+export const DebugToolbarOverlayWidget = () => {
+  const debugConfigurationService = useInjectable<DebugConfigurationService>(DebugConfigurationService);
+  const float = useAutorun(debugConfigurationService.float);
 
-export const DebugToolbarOverlayWidget = observer(() => {
-  const { float } = useInjectable<DebugConfigurationService>(DebugConfigurationService);
   if (!float) {
     return null;
   }
 
   return <FloatDebugToolbarView />;
-});
+};

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

@@ -1,5 +1,4 @@
 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';
@@ -11,7 +10,7 @@ import styles from './debug-console.module.less';
 /**
  * 调试控制台筛选器
  */
-export const DebugConsoleFilterView = observer(() => {
+export const DebugConsoleFilterView = () => {
   const debugConsoleFilterService = useInjectable<DebugConsoleFilterService>(DebugConsoleFilterService);
   const [filterValue, setFilterValue] = React.useState<string>('');
   const [historyApi, setHistoryApi] = React.useState<IHistoryInputBoxHandler>();
@@ -75,4 +74,4 @@ export const DebugConsoleFilterView = observer(() => {
       ></HistoryInputBox>
     </div>
   );
-});
+};