Skip to content

Commit 7ae4310

Browse files
authored
feat: support to toggle panels via keybinding (#208)
* feat: support to toogle panels via keybinding * ci: fix eslint problem * fix: problems support execute command
1 parent 32daee2 commit 7ae4310

File tree

8 files changed

+89
-19
lines changed

8 files changed

+89
-19
lines changed

src/controller/menuBar.ts

+11
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import {
66
MENU_FILE_UNDO,
77
MENU_VIEW_ACTIVITYBAR,
88
MENU_VIEW_MENUBAR,
9+
MENU_VIEW_PANEL,
910
MENU_VIEW_STATUSBAR,
1011
} from 'mo/model/workbench/menuBar';
1112
import { Controller } from 'mo/react/controller';
@@ -20,6 +21,7 @@ import {
2021
import { ID_SIDE_BAR } from 'mo/common/id';
2122
import { IMonacoService, MonacoService } from 'mo/monaco/monacoService';
2223
import { CommandQuickSideBarViewAction } from 'mo/monaco/quickToggleSideBarAction';
24+
import { QuickTogglePanelAction } from 'mo/monaco/quickTogglePanelAction';
2325

2426
export interface IMenuBarController {
2527
onSelect?: (key: string, item?: IActivityBarItem) => void;
@@ -68,6 +70,9 @@ export class MenuBarController
6870
case ID_SIDE_BAR:
6971
this.updateSideBar();
7072
break;
73+
case MENU_VIEW_PANEL:
74+
this.updatePanel();
75+
break;
7176
}
7277
};
7378

@@ -114,4 +119,10 @@ export class MenuBarController
114119
CommandQuickSideBarViewAction.ID
115120
);
116121
};
122+
123+
private updatePanel = () => {
124+
this.monacoService.commandService.executeCommand(
125+
QuickTogglePanelAction.ID
126+
);
127+
};
117128
}

src/controller/panel.tsx

+8-9
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,9 @@ import {
88
PANEL_TOOLBOX_CLOSE,
99
PANEL_TOOLBOX_RESIZE,
1010
} from 'mo/model/workbench/panel';
11-
import {
12-
IPanelService,
13-
PanelService,
14-
ILayoutService,
15-
LayoutService,
16-
} from 'mo/services';
11+
import { IPanelService, PanelService } from 'mo/services';
12+
import { IMonacoService, MonacoService } from 'mo/monaco/monacoService';
13+
import { QuickTogglePanelAction } from 'mo/monaco/quickTogglePanelAction';
1714

1815
export interface IPanelController {
1916
onTabChange(key: string | undefined): void;
@@ -23,12 +20,12 @@ export interface IPanelController {
2320
@singleton()
2421
export class PanelController extends Controller implements IPanelController {
2522
private readonly panelService: IPanelService;
26-
private readonly layoutService: ILayoutService;
23+
private readonly monacoService: IMonacoService;
2724

2825
constructor() {
2926
super();
3027
this.panelService = container.resolve(PanelService);
31-
this.layoutService = container.resolve(LayoutService);
28+
this.monacoService = container.resolve(MonacoService);
3229
}
3330

3431
public readonly onTabChange = (key: string | undefined): void => {
@@ -46,7 +43,9 @@ export class PanelController extends Controller implements IPanelController {
4643
item: IActionBarItemProps
4744
): void => {
4845
if (item.id === PANEL_TOOLBOX_CLOSE) {
49-
this.layoutService.setPanelHidden();
46+
this.monacoService.commandService.executeCommand(
47+
QuickTogglePanelAction.ID
48+
);
5049
} else if (item.id === PANEL_TOOLBOX_RESIZE) {
5150
this.panelService.maximizeRestore();
5251
}

src/controller/problems.tsx

+12-10
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,8 @@ import {
1212
} from 'mo/services';
1313
import { singleton, container } from 'tsyringe';
1414
import { builtInPanelProblems, builtInStatusProblems } from 'mo/model/problems';
15+
import { IMonacoService, MonacoService } from 'mo/monaco/monacoService';
16+
import { QuickTogglePanelAction } from 'mo/monaco/quickTogglePanelAction';
1517
export interface IProblemsController {
1618
onClick?: (e: React.MouseEvent, item: IStatusBarItem) => void;
1719
}
@@ -22,29 +24,29 @@ export class ProblemsController
2224
private readonly panelService: IPanelService;
2325
private readonly statusBarService: IStatusBarService;
2426
private readonly layoutService: ILayoutService;
27+
private readonly monacoService: IMonacoService;
2528

2629
constructor() {
2730
super();
2831
this.panelService = container.resolve(PanelService);
2932
this.statusBarService = container.resolve(StatusBarService);
33+
this.monacoService = container.resolve(MonacoService);
3034
this.layoutService = container.resolve(LayoutService);
3135
this.init();
3236
}
3337

3438
private showHideProblems() {
39+
const { panel } = this.layoutService.getState();
40+
if (panel.hidden) {
41+
this.monacoService.commandService.executeCommand(
42+
QuickTogglePanelAction.ID
43+
);
44+
}
3545
const { current } = this.panelService.getState();
36-
const {
37-
panel: { hidden },
38-
} = this.layoutService.getState();
39-
if (hidden) {
40-
this.layoutService.setPanelHidden();
46+
if (current?.id !== builtInPanelProblems().id) {
4147
this.panelService.open(builtInPanelProblems());
4248
} else {
43-
if (current?.id !== builtInPanelProblems().id) {
44-
this.panelService.open(builtInPanelProblems());
45-
} else {
46-
this.layoutService.setPanelHidden();
47-
}
49+
this.layoutService.setPanelHidden();
4850
}
4951
}
5052

src/extensions/keybinding/index.ts

+2
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { QuickAccessSettings } from 'mo/monaco/quickAccessSettingsAction';
55
import { CommandQuickAccessViewAction } from 'mo/monaco/quickAccessViewAction';
66
import { SelectColorThemeAction } from 'mo/monaco/selectColorThemeAction';
77
import { CommandQuickSideBarViewAction } from 'mo/monaco/quickToggleSideBarAction';
8+
import { QuickTogglePanelAction } from 'mo/monaco/quickTogglePanelAction';
89

910
export const ExtendsKeybinding: IExtension = {
1011
activate(extensionCtx: IExtensionService) {
@@ -13,5 +14,6 @@ export const ExtendsKeybinding: IExtension = {
1314
extensionCtx.registerAction(QuickAccessSettings);
1415
extensionCtx.registerAction(SelectLocaleAction);
1516
extensionCtx.registerAction(CommandQuickSideBarViewAction);
17+
extensionCtx.registerAction(QuickTogglePanelAction);
1618
},
1719
};

src/i18n/source/en.ts

+2
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,8 @@ export default {
2323
'menu.showSideBar.label': 'Toggle Side Bar Visibility',
2424
'menu.showStatusBar': 'Show Status Bar',
2525
'menu.showActivityBar': 'Show Activity Bar',
26+
'menu.showPanel': 'Show Panel',
27+
'menu.showPanel.title': 'Toggle Panel',
2628
'menu.run': 'Run',
2729
'menu.help': 'Help',
2830
'sidebar.explore.title': 'Explorer',

src/i18n/source/zh-CN.json

+2
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,8 @@
2626
"menu.showStatusBar": "显示状态栏",
2727
"menu.showActivityBar": "显示活动栏",
2828
"menu.hideActivityBar": "隐藏活动栏",
29+
"menu.showPanel": "显示面板",
30+
"menu.showPanel.title": "切换面板",
2931
"menu.defaultProjectName": "无打开文件夹",
3032
"menu.run": "运行",
3133
"menu.runTask": "运行任务",

src/model/workbench/menuBar.ts

+6
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ export const MENU_FILE_REDO = 'redo';
2929
export const MENU_VIEW_MENUBAR = 'workbench.action.showMenuBar';
3030
export const MENU_VIEW_ACTIVITYBAR = 'workbench.action.showActivityBar';
3131
export const MENU_VIEW_STATUSBAR = 'workbench.action.showStatusBar';
32+
export const MENU_VIEW_PANEL = 'workbench.action.showPanel';
3233

3334
export function builtInMenuBarData() {
3435
return [
@@ -116,6 +117,11 @@ export function builtInMenuBarData() {
116117
'Show Activity Bar'
117118
),
118119
},
120+
{
121+
icon: 'check',
122+
id: MENU_VIEW_PANEL,
123+
name: localize('menu.showPanel', 'Show Panel'),
124+
},
119125
],
120126
},
121127
],

src/monaco/quickTogglePanelAction.ts

+46
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
import { Action2, CATEGORIES, KeybindingWeight } from './common';
2+
import { ServicesAccessor } from 'monaco-editor/esm/vs/platform/instantiation/common/instantiation';
3+
import { KeyChord } from 'monaco-editor/esm/vs/base/common/keyCodes';
4+
import { localize } from 'mo/i18n/localize';
5+
import { KeyMod, KeyCode } from 'mo/monaco';
6+
import { MENU_VIEW_PANEL } from 'mo/model';
7+
import { container } from 'tsyringe';
8+
import {
9+
ILayoutService,
10+
IMenuBarService,
11+
LayoutService,
12+
MenuBarService,
13+
} from 'mo/services';
14+
15+
export class QuickTogglePanelAction extends Action2 {
16+
static readonly ID = MENU_VIEW_PANEL;
17+
static readonly LABEL = localize('menu.showPanel.title', 'Toggle Panel');
18+
private readonly layoutService: ILayoutService;
19+
private readonly menuBarService: IMenuBarService;
20+
constructor() {
21+
super({
22+
id: QuickTogglePanelAction.ID,
23+
label: QuickTogglePanelAction.LABEL,
24+
title: QuickTogglePanelAction.LABEL,
25+
category: CATEGORIES.View,
26+
alias: 'Toggle Panel',
27+
precondition: undefined,
28+
f1: true,
29+
keybinding: {
30+
when: undefined,
31+
weight: KeybindingWeight.WorkbenchContrib,
32+
// eslint-disable-next-line new-cap
33+
primary: KeyChord(KeyMod.CtrlCmd | KeyCode.KEY_J),
34+
},
35+
});
36+
this.layoutService = container.resolve(LayoutService);
37+
this.menuBarService = container.resolve(MenuBarService);
38+
}
39+
run(accessor: ServicesAccessor) {
40+
const { hidden } = this.layoutService.getState().panel;
41+
this.menuBarService.update(QuickTogglePanelAction.ID, {
42+
icon: hidden ? 'check' : '',
43+
});
44+
this.layoutService.setPanelHidden();
45+
}
46+
}

0 commit comments

Comments
 (0)