core icon indicating copy to clipboard operation
core copied to clipboard

[Refactor] 归纳框架所有容器/视图 ID 至 @opensumi/ide-core-browser

Open erha19 opened this issue 2 years ago • 0 comments

目前存在的问题

目前框架内部有许多视图容器,每个视图容器在页面上依赖容器 ID 进行绑定注册,命名方式包括:

  1. 使用包名注册的,如 @opensumi/ide-output
  2. 使用自定义名称注册的,如 debug-console

相关代码见:

https://github.com/opensumi/core/blob/b39260cfa73158e32f643b745b5576cacb724028/packages/output/src/browser/output-contribution.ts#L77

https://github.com/opensumi/core/blob/96477a517f05e47209e42aa3d53444baa4117b63/packages/debug/src/browser/view/console/debug-console.contribution.ts#L56

而同时,视图也存在自己的视图 ID(containerId),该 ID 会在视图中创建 #{containerId} 标签,可用于样式覆盖及 E2E 案例编写,如:

https://github.com/opensumi/core/blob/96477a517f05e47209e42aa3d53444baa4117b63/packages/debug/src/browser/view/console/debug-console.contribution.ts#L64

这些 ID 的命名存在规范不统一,且缺少统一维护/获取的地方,文档需求:https://github.com/opensumi/docs/issues/62.

修改意见

目前在 @opensumi/ide-core-browser 中的 container-id.ts 维护着部分视图 ID,由于每个前端模块都是依赖 @opensumi/ide-core-browser 的,这里可以将大部分视图 ID 都在这里,以 NameSpace + 注释的方式进行重构,如:

export namespace CONTAINER_IDS {
 /**
   *  {添加注释说明 ID 的使用场景及区域}
   */
  export const EXPLORER = `@opensumi/ide-core-explorer`;
  ...
}

同时,目前在 layout 区域还有一个 view-id.ts 文件,里面定义了布局区块的 ID,命名上可能存在冲突,整体的 NameSpace 命名可以是(建议,可以有更好的表达):

  1. VIEW_CONTAINERS 全局视图 ID
  2. CONTAINER_VIEW_IDS 视图容器 ID
  3. VIEW_IDS 视图 ID

在字段值方面,由于 CONTAINER_VIEW_IDS 存在历史遗留问题,且大部分为 @opensumi/ide-* 格式,可以把少量不是这种格式的 ID 进行统一,并补充至 BreakingChange 文档 CHANGELOG.md

VIEW_IDS 统一采用小写字母值

erha19 avatar Apr 07 '23 03:04 erha19