panelService 支持监听onTabChange, onToolbarClick 就不在这个 PR 里面了，我新建个Issue

Originally posted by @wewoor in #38 (comment)

Output

• output 默认去除 minimap 组件

Originally posted by @wewoor in #61 (comment)

通过 Appearance 菜单，显示隐藏 SideBar，支持通过点击 Explorer/Search 打开 Siebar

隐藏后的 MenuBar 可以通过 ActivitBar 重新展示 MenuBar

Problems 模块需要展示来自编辑器的关于 Errors 和 Warnings、Infor 等信息，具体功能清单如下：

• 支持增加/删除/修改 Errors 和 Warnings、Infor 等信息

参考：

• 监听 workspace 区域右键事件（Add Folder）
• 缓存当前 select node 数据（支持 collapse header 右侧快捷新建操作）
• 支持新建后 tree 自动 expand 以及 input focus
• rename 数据更新(input 数据回填、tab 数据更新)
• Tree 文件夹目录下无文件时导致图标丢失
• vscode 还原度提高

通过 Appearance 菜单，显示隐藏 MenuBar

隐藏后的 MenuBar 可以通过 ActivitBar 重新展示 MenuBar

OUTPUT 主要是用来输出一些执行信息，基本功能如下：

• 单条信息 Append
• 面板信息 Clear

参考：

ts-loader 与社区的插件整合还是有很多小坑，还是迁移到 Babel 社区

Use ITab renderPanel interface and cancel render interface definition

export interface IPanelItem<T = any> extends ITab<any> {
    id: string;
    title?: string;
    toolbox?: IActionBarItem[];
    data?: T;
    render?(item: IPanelItem): ReactNode;
}

export interface ITab<T, P = any> {
    renderPanel?: ((item: P) => ReactNode) | ReactNode;
    data?: T;
}

Workbench

Sidebar

• Explorer Actions 支持隐藏/显示 OPEN EDITORS #9
• Explorer TreeView 支持增、删、改操作 #10
• Search Pane 支持简单文本/正则搜索规则，和搜索结果展示树 #11
• 重构 Explorer 模块代码 #12

Editor

• Editor 支持 Close Others, Close To Left, Close To Right, Close All 等基本功能 #13
• Menu 菜单 Edit 支持 Undo, Redo 触发 #14
• 支持自定义 Editor Renderer, 根据 Tab Data 具体展示面板 #15

Menu

• 支持 Settings 菜单触发 Command Palette #16

ActivityBar

• 支持基本的上下文菜单 #28
• 支持显示隐藏 MenuBar/Search/Explorer 等操作 #28

StatusBar

• 支持统计显示来自 EditorText 的 Errors 和 Warnings 信息（Problems) #17
• 支持消息面板的查阅，推送，清除功能 #18

Panel

• 支持 Panel 的展示/关闭 #19
• 支持 Panel 增加/删除/修改默认面板（Pane） #21
• 支持展示 Problems 具体信息 #20
• 支持默认的 Output 面板，基本的 Append, Clear 等操作 #22

Appearance

• 显示隐藏 MenuBar #23
• 显示隐藏 SideBar，支持通过点击 Explorer/Search 打开 Siebar #24
• 显示隐藏 StatusBar #25
• 显示隐藏 ActivityBar #26

ColorTheme

• 优化 Monaco 部分样式无法显示的问题，部分组件颜色取错的问题 #27

消息按钮主要用于收纳 IDE 通知（Notification）相关信息，具体功能如下：

• 根据状态展示消息按钮（有消息/无消息）
• 点击信息按钮可查阅/关闭通知面板
• 支持推送/删除新的消息

参考：

除去默认的OUTPUT、Problems 以外，允许用户通过panelService 对 Pane 进行基本的扩展：

• Pane 增加/删除/修改

需要集成 Monaco 的 Undo 和 Redo 功能

参考：

Descipition

因 @wewoor 重构editorGroup 部分逻辑丢失 需要完成如下：

• Tab active 效果失效 #49
• Close editor 对应的renderPanel内容不会更新
• Close editor 关闭当前eidtorTab, 默认向后/向前切换一个tab；关闭otherTab；直接splice
• Open Editor 默认打开当前trigger的tab #41

unexpected

expected

reference EditorService subscribe operate

examples

    editorService.onEvent(EditorEvent.OnMoveTab, (data) => {
        console.log(data);
    });

    editorService.onEvent(EditorEvent.OnSelectTab, (tabKey?: string) => {
        console.log(`selected tabKey ${tabKey}`);
    });
    editorService.onEvent(EditorEvent.OnCloseTab, (tabKey?: string) => {
        console.log(`closed tabkey ${tabKey}`);
    });

增加热键支持服务，直接引用 vscode 内置服务

Reference

模块： vs/workbench/borwser/actions/quickAccessActions.ts

import { KeybindingsRegistry, KeybindingWeight, IKeybindingRule } from 'vs/platform/keybinding/common/keybindingsRegistry';


KeybindingsRegistry.registerKeybindingRule({
	id: QUICKACCESS_ACTION_ID,
	weight: KeybindingWeight.WorkbenchContrib,
	when: undefined,
	primary: globalQuickAccessKeybinding.primary,
	secondary: globalQuickAccessKeybinding.secondary,
	mac: globalQuickAccessKeybinding.mac
});

v0.9.0-alpha.1 Test Plan

测试计划执行至少发布前一周开始执行

Workbench

• editor
• sideBar
• activityBar
• statusBar
• menu
• panel

Services

• activityBarService
• explorerService
• sidebarService
• menuBarService
• statusBarService
• panelService
• editorService
• extensionService
• colorThemeService
• settingsService

Components

• actionBar
• breadcrumb
• button
• checkbox
• collapse
• contextMenu
• contextView
• dialog
• dropdown
• icon
• input
• list
• menu
• monaco
• scrollable
• select
• tabs
• toolbar
• tree

提取 editorController, panelController 等控制器的实例到 controller/index.ts

优化 Monaco 部分样式无法显示的问题，部分组件颜色取错的问题

参考：

1. miniMap 并未刷新

ref #61

2. Code Editor 中 部分 Token 没有解析

例如：

<Tabs className="myClass" />

DI 注入参数初始化值太过麻烦 跟最新重构的Service保持一致；eg：PanelService

• activityBar
• menuBar
• sideBar

   export class SidebarModel implements ISidebar {
    public current: string;
    public panes: ISidebarPane[];

    constructor(
        @inject('SidebarPane') panes: ISidebarPane[] = [],
        @inject('Selected') selected: string = ''
    ) {
        this.panes = panes;
        this.current = selected;
    }
}

container.register('SidebarPane', { useValue: [] });
container.register('Selected', { useValue: '' });

@wewoor 需要新增issue去剔掉

Originally posted by @mumiao in #38 (comment)

Explorer 历史代码 Model, View, Controller, Service 划分还不够清楚

例如 Model 中包含大量的数据处理逻辑方法：

目前 Explorer 面板的 Actions 是没有扩展方法的，目前应该支持如下操作：

• 支持添加/删除 Action Item
• 默认支持显示/隐藏 OPEN EDITORS 功能项

支持 Settings 菜单打开 Command Palette

参考：

支持测试 React 组件，目前 Jest 还未集成 支持 React 组件测试的框架。

目前默认 Editor 渲染是 Monaco Editor, 另外 Tab 支持一个 render()，但是这个设计目前并不能完全 Work, 需要重新考虑下设计

更新 Workbench View 状态会重置 SplitPane 的位置

EditorController 已经有TabAction相关的emit事件

this.subscribe(this.subscribe(ActivityBarEvent.OnCloseTab, callback))
this.subscribe(this.subscribe(ActivityBarEvent.onMoveTab, callback))
...

Editor 还需要补充基本的 Tab 操作功能，如下：

• Close Others
• Close To Left
• Close To Right
• Close All

参考：

通过 Appearance 菜单，显示隐藏 ActivityBar

注意：重新显示ActivityBar ，需要重新刷新应用

Panel 需要默认支持 问题（Problems） 面板

• 支持更新 Problems 面板信息
• 支持 清理 Problems 面板信息

参考：

支持通过 explorerService 对 TreeView 组件做基本对节点初始化、增加、更新、删除操作。

• TreeView 初始化
• TreeView 节点增加
• TreeView 节点修改
• TreeView 节点删除

目前 connect 函数只能链接单个 service/view/controller, 如下：

const PanelView = connect(panelService, Panel, panelController);

考虑支持如下场景：
单个组件链接多个Service state, 用法例如：

const PanelView = connect({
  A: serviceA, 
  B: serviceB
}
, Panel, {controllerA: controllerA, controllerB: controllerB}
);

通过 Appearance 菜单，显示隐藏 StatusBar

隐藏后可以通过 ActivitBar 重新展示 StatusBar

expected

• 支持手动隐藏 Panel 和展示
• 支持 Maximize/Restore Panel

参考：

The Molecule Roadmap 2021

Q1

Workbench

• 完善 Workbench 基本的 Editor, Sidebar, ActivityBar, StatusBar, Menu，Explorer，Search 等基本功能

Q2

国际化

• 基本的国际化能力，默认英文/中文

Settings

• 支持通过 JSON/UI 的方式完成基本的默认 Theme, Text Editor、Layout 设置

KeyBinding

• 支持通过修改 settings 配置文件，来自定义部分内置功能的热键

Release Experimental Version

• 官网和基本使用指南
• 基本的 API 文档

Q3

• DAGScheduleX 落地
• 单测补充
• API 文档 & 使用指南（Tutorials)
• 开发官方网站

Q4

• 文档完善/优化
• 开放代码

Document

• 优化

• editor panel 背景颜色不一致，导致Maximize后 颜色差异大，但是新增的PanelItem 没有问题
  unexpected
  
  
  expected
  

• panel 缺少选中状态
  unexpected
  
  expected
  

• suggestion
  PanelService 维护 currentPane

   <Tabs
      data={tabs}
      activeTab={activeTab}
      onMoveTab={onMoveTab}
      onSelectTab={onSelectTab}
  />

支持基本对搜索面板，包含搜索内容的输入和结果展示

• 文本/正则搜索
• 结果树形展示
• 搜索结果操作事件监听

参考：

Description

• extract actions from EditorService
• add ctrl+s saveTab editor
• optmize ts definition

来自编译器警告⚠️：

"export 'InputProps' was not found in './input'
"export 'TextAreaProps' was not found in './textArea'

Resolved #38

Description

持renderFunc 回调入参自定义类型, 避免重复声明render 函数

The interface of ITab:

 interface ITab<T, P> { 
   renderPanel: (item? P) => ReactNode,
   resetProps:  ...
}

The latest version: 6.1.10

Sidebar

• TreeView
• ActionBar

ActivityBar 支持基本的上下文菜单，和默认操作，具体功能如下：

• 支持通过 activityBarService 操作(增删改） contextMenu
• 支持基本的 MenuBar/Search/Explorer 显示隐藏 功能

参考：