From 873455642c3b2746dc50b786e1cabc167d43ea85 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=87=8E=E8=BF=82=E8=BF=82?= Date: Fri, 15 Jul 2022 23:41:52 +0800 Subject: [PATCH 01/10] docs: update quick-start & add migration.md (#784) * docs: update quick-start & add migration.md * ci: upgrade node version in ci --- .github/workflows/test-deploy.yml | 2 +- MIGRATION.md | 10 ++++++++++ website/docs/quick-start.md | 14 ++++++++++++++ .../current/quick-start.md | 14 ++++++++++++++ 4 files changed, 39 insertions(+), 1 deletion(-) create mode 100644 MIGRATION.md diff --git a/.github/workflows/test-deploy.yml b/.github/workflows/test-deploy.yml index 63fe583d2..82b33bb71 100644 --- a/.github/workflows/test-deploy.yml +++ b/.github/workflows/test-deploy.yml @@ -13,7 +13,7 @@ jobs: - uses: actions/checkout@v2 - uses: actions/setup-node@v2 with: - node-version: 14.x + node-version: 16.x cache: yarn cache-dependency-path: website/yarn.lock - name: Install dependencies diff --git a/MIGRATION.md b/MIGRATION.md new file mode 100644 index 000000000..469e7fe94 --- /dev/null +++ b/MIGRATION.md @@ -0,0 +1,10 @@ +

Migration

+ +- [From version 1.0.x to 1.1.0](#from-version-10x-to-110) + - [React18 upgrade](#react18-upgrade) + +## From version 1.0.x to 1.1.0 + +### React18 upgrade + +React 18 introduced a [new root API](https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-client-rendering-apis). Starting from 1.1.0, Molecule itself will auto-detect your version of react and use the new root API automatically if you're on React18. But It's attentioned that there are several dependencies of Molecule still incompatible of React18's strict mode. So Molecule now still not compatible with `React.StrictMode` in React@18.x. For exmaple: [react-scrollbars-custom](https://github.com/xobotyi/react-scrollbars-custom/issues/234). diff --git a/website/docs/quick-start.md b/website/docs/quick-start.md index 5094f98a7..837202449 100644 --- a/website/docs/quick-start.md +++ b/website/docs/quick-start.md @@ -61,6 +61,20 @@ export default App; `extensions` are extensions that need to be customized. +And open the `src/index.js` file and change it to the following: + +```diff title="src/index.js" +root.render( +- + +- +); +``` + +:::caution +It's **noticed** that the Molecule for now is not compatible with `React.StrictMode`. So we should remove `React.StrictMode` from `src/index.js`. +::: + ## Startup Project Finally, run the `start` command in the terminal: diff --git a/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/quick-start.md b/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/quick-start.md index 312233eef..3eb2acfac 100644 --- a/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/quick-start.md +++ b/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/quick-start.md @@ -61,6 +61,20 @@ export default App; `extensions` 是需要自定义的扩展程序。 +然后，打开 `src/index.js` 文件，并修改如下的部分: + +```diff title="src/index.js" +root.render( +- + +- +); +``` + +:::caution +需要注意的是目前 Molecule 还无法与 `React.StrictMode` 兼容，所以我们需要在 `src/index.js` 中移除 `React.StrictMode`。 +::: + ## 启动项目 最后，在终端中运行`start` 命令： From 3a23684d8fed7608580936eafe5f3689f469b66b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=87=8E=E8=BF=82=E8=BF=82?= Date: Thu, 21 Jul 2022 10:35:13 +0800 Subject: [PATCH 02/10] docs: update quick-start doc (#785) * docs: update quick-start doc * docs: update typo --- website/docs/quick-start.md | 50 ++++++++++++++++--- .../current/quick-start.md | 48 ++++++++++++++++-- website/package.json | 1 + 3 files changed, 88 insertions(+), 11 deletions(-) diff --git a/website/docs/quick-start.md b/website/docs/quick-start.md index 837202449..7438f7c81 100644 --- a/website/docs/quick-start.md +++ b/website/docs/quick-start.md @@ -14,7 +14,43 @@ sidebar_position: 2 use the `node -v` command to view the current Node version. It is recommended to use [nvm](https://github.com/nvm-sh/nvm) on Mac systems to manage multiple versions of Node.js. ::: -## Create a Project +## Create a Project in One Line + +We provide a command line tool to create a project quickly. It uses [create-react-app](https://github.com/facebook/create-react-app) to create this project. + +### npx + +```bash +npx @dtinsight/create molecule-demo +``` + +Or create the project based on the **TypeScript** template + +```bash +npx @dtinsight/create molecule-demo -t +``` + +_[npx](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b) comes with npm 5.2+ and higher, see [instructions for older npm versions](https://gist.github.com/gaearon/4064d3c23a77c74a3614c498a8bb1c5f)_ + +### Yarn + +```bash +yarn create @dtinsight/ molecule-demo +``` + +Or create the project based on the **TypeScript** template + +```bash +yarn create @dtinsight/ molecule-demo -t +``` + +_`yarn create` is available in Yarn 0.25+_ + +### Startup Project + +After waiting a second, you could see `Happy coding!😊` in terminal. And then just following the guide to start up your project. + +## Create a Project Manually We use the [create-react-app](https://github.com/facebook/create-react-app) scaffolding tool officially recommended by React as an example, Here we **strongly recommend** the use of the **Typescript** template: @@ -29,7 +65,7 @@ This command will create a directory called `molecule-demo` in the current direc cd molecule-demo ``` -## Install Molecule +### Install Molecule Then, you need to install the dependency of molecule: @@ -41,7 +77,7 @@ npm install @dtinsight/molecule This command will automatically install Molecule's dependencies in the `molecule-demo` project. -## Basic Use +### Basic Use Open the `src/App.js` file and replace the contents of the file with the following: @@ -75,7 +111,7 @@ root.render( It's **noticed** that the Molecule for now is not compatible with `React.StrictMode`. So we should remove `React.StrictMode` from `src/index.js`. ::: -## Startup Project +### Startup Project Finally, run the `start` command in the terminal: @@ -91,8 +127,10 @@ This command will automatically open the address [http://localhost:3000](http:// ## Use Monaco Editor language pack -To use the language pack of Monaco Editor, you need to use the plug-in `monaco-editor-webpack-plugin`, so here we have to extend the default configuration of **Webpack**. -First, we first install the [react-app-rewired](https://github.com/timarney/react-app-rewired) tool, and then create a `config-overrides.js` file in the project root directory to override the default Webpack configuration. The specific usage of the `monaco-editor-webpack-plugin` plugin is as follows: +Now, you can see the page in browser, but that's not enough. If you want to develop an Web IDE with specific language. You should use the language pack of Monaco Editor to highlight the language in Web IDE. + +To use the language pack of Monaco Editor, you need to use the plugin [`monaco-editor-webpack-plugin`](https://www.npmjs.com/package/monaco-editor-webpack-plugin), so here we have to extend the default configuration of **Webpack**. +First, we install the [react-app-rewired](https://github.com/timarney/react-app-rewired), and then create a `config-overrides.js` file in the project's root directory to override the default Webpack configuration. The specific usage of the `monaco-editor-webpack-plugin` plugin is as follows: ```js title="config-overrides.js" const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin'); diff --git a/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/quick-start.md b/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/quick-start.md index 3eb2acfac..098495241 100644 --- a/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/quick-start.md +++ b/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/quick-start.md @@ -14,7 +14,43 @@ sidebar_position: 2 可以通过 `node -v` 命令查看当前 Node 版本。 推荐在 Mac 系统中使用 [nvm](https://github.com/nvm-sh/nvm) 来管理 Node.js 多版本 ::: -## 创建项目 +## 命令行创建项目 + +我们提供了命令行工具快速创建 Molecule 项目。该工具是基于 [create-react-app](https://github.com/facebook/create-react-app) 创建项目的 + +### npx + +```bash +npx @dtinsight/create molecule-demo +``` + +或者你需要创建一个基于 **TypeScript** 的项目 + +```bash +npx @dtinsight/create molecule-demo -t +``` + +_[npx](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b) 要求 npm 的版本是 5.2+ 或更高, [低版本的 npm 使用方式参考](https://gist.github.com/gaearon/4064d3c23a77c74a3614c498a8bb1c5f)_ + +### Yarn + +```bash +yarn create @dtinsight/ molecule-demo +``` + +或者你需要创建一个基于 **TypeScript** 的项目 + +```bash +yarn create @dtinsight/ molecule-demo -t +``` + +_`yarn create` 要求 Yarn 的版本在 0.25+_ + +### 启动项目 + +在等待安装依赖一会儿后，终端显示 `Happy coding!😊` 则表示安装成功。接下来只需要按照终端上的向导启动项目即可。 + +## 手动创建项目 我们使用 React 官方推荐的 [create-react-app](https://github.com/facebook/create-react-app) 脚手架工具作为示例， 这里我们**强烈推荐**使用 **Typescript** 模板： @@ -29,7 +65,7 @@ npx create-react-app molecule-demo --template typescript cd molecule-demo ``` -## 安装 Molecule +### 安装 Molecule 然后，你需要安装 molecule 的依赖： @@ -41,7 +77,7 @@ npm install @dtinsight/molecule 这个命令会在 `molecule-demo` 项目中自动安装 Molecule 的依赖。 -## 基本使用 +### 基本使用 打开 `src/App.js` 文件，将该文件的内容替换成如下： @@ -75,7 +111,7 @@ root.render( 需要注意的是目前 Molecule 还无法与 `React.StrictMode` 兼容，所以我们需要在 `src/index.js` 中移除 `React.StrictMode`。 ::: -## 启动项目 +### 启动项目 最后，在终端中运行`start` 命令： @@ -91,7 +127,9 @@ npm run start ## 使用 Monaco Editor 语言包 -使用 Monaco Editor 的语言包，需要使用插件 `monaco-editor-webpack-plugin`，所以这里我们得扩展下 **Webpack** 的默认配置。 +现在，你可以在浏览器中打开并看到 Molecule 的页面了，但是这仍然是远远不够的。如果你想要开发一个特定语法的 Web IDE 应用，你需要借助 Monaco Editor 的语言包来使得你的语法能够在 Web IDE 中高亮。 + +使用 Monaco Editor 的语言包，需要使用插件 [`monaco-editor-webpack-plugin`](https://www.npmjs.com/package/monaco-editor-webpack-plugin)，所以这里我们得扩展下 **Webpack** 的默认配置。 首先我们先安装 [react-app-rewired](https://github.com/timarney/react-app-rewired) 工具，然后在项目根目录创建一个`config-overrides.js` 文件，用来覆盖默认 Webpack 配置。 `monaco-editor-webpack-plugin` 插件具体使用如下： ```js title="config-overrides.js" diff --git a/website/package.json b/website/package.json index 74d8018bb..64ea851fe 100644 --- a/website/package.json +++ b/website/package.json @@ -5,6 +5,7 @@ "scripts": { "docusaurus": "docusaurus", "start": "docusaurus start", + "start:chinese": "docusaurus start --locale zh-CN", "build": "docusaurus build", "swizzle": "docusaurus swizzle", "deploy": "docusaurus deploy", From b207f9ebd04fdc9f596d548a8deafc668da4c56b Mon Sep 17 00:00:00 2001 From: Ziv Date: Fri, 29 Jul 2022 17:37:39 +0800 Subject: [PATCH 03/10] docs: add OpenSSF best practice badge (#787) --- .prettierignore | 1 + README-koKR.md | 4 +++- README-zhCN.md | 4 +++- README.md | 4 +++- website/docs/introduction.md | 4 +++- .../docusaurus-plugin-content-docs/current/introduction.md | 4 +++- 6 files changed, 16 insertions(+), 5 deletions(-) diff --git a/.prettierignore b/.prettierignore index 0e2030d0b..3a899fb39 100644 --- a/.prettierignore +++ b/.prettierignore @@ -11,3 +11,4 @@ website/build website/docs/api website/.docusaurus website/node_modules +lib diff --git a/README-koKR.md b/README-koKR.md index 748947ceb..b5975ddcc 100644 --- a/README-koKR.md +++ b/README-koKR.md @@ -4,7 +4,7 @@

Molecule

경량 웹 IDE UI 프레임워크

-[![CI][ci-image]][ci-url] [![Codecov][codecov-image]][codecov-url] [![NPM downloads][download-img]][download-url] [![NPM version][npm-version]][npm-version-url] [![Chat][online-chat-img]][online-chat-url] +[![CI][ci-image]][ci-url] [![CII Best Practices][cii-img]][cii-url] [![Codecov][codecov-image]][codecov-url] [![NPM downloads][download-img]][download-url] [![NPM version][npm-version]][npm-version-url] [![Chat][online-chat-img]][online-chat-url] @@ -18,6 +18,8 @@ [npm-version-url]: https://www.npmjs.com/package/@dtinsight/molecule [online-chat-img]: https://img.shields.io/discord/920616811261743104?logo=Molecule [online-chat-url]: https://discord.com/invite/b62gpHwNA7 +[cii-img]: https://bestpractices.coreinfrastructure.org/projects/6307/badge +[cii-url]: https://bestpractices.coreinfrastructure.org/projects/6307 [中文](./README-zhCN.md) | [English](./README.md) | [한국어](./README-koKR.md) diff --git a/README-zhCN.md b/README-zhCN.md index 6f8b11f76..5f82d8dc6 100644 --- a/README-zhCN.md +++ b/README-zhCN.md @@ -4,7 +4,7 @@

Molecule

一个轻量的 Web IDE UI 框架

-[![CI][ci-image]][ci-url] [![Codecov][codecov-image]][codecov-url] [![NPM downloads][download-img]][download-url] [![NPM version][npm-version]][npm-version-url] [![Chat][online-chat-img]][online-chat-url] +[![CI][ci-image]][ci-url] [![CII Best Practices][cii-img]][cii-url] [![Codecov][codecov-image]][codecov-url] [![NPM downloads][download-img]][download-url] [![NPM version][npm-version]][npm-version-url] [![Chat][online-chat-img]][online-chat-url] @@ -18,6 +18,8 @@ [npm-version-url]: https://www.npmjs.com/package/@dtinsight/molecule [online-chat-img]: https://img.shields.io/discord/920616811261743104?logo=Molecule [online-chat-url]: https://discord.com/invite/b62gpHwNA7 +[cii-img]: https://bestpractices.coreinfrastructure.org/projects/6307/badge +[cii-url]: https://bestpractices.coreinfrastructure.org/projects/6307 [中文](./README-zhCN.md) | [English](./README.md) | [한국어](./README-koKR.md) diff --git a/README.md b/README.md index 89ef42ff0..abf9691cc 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@

Molecule

A lightweight Web IDE UI Framework

-[![CI][ci-image]][ci-url] [![Codecov][codecov-image]][codecov-url] [![NPM downloads][download-img]][download-url] [![NPM version][npm-version]][npm-version-url] [![Chat][online-chat-img]][online-chat-url] +[![CI][ci-image]][ci-url] [![CII Best Practices][cii-img]][cii-url] [![Codecov][codecov-image]][codecov-url] [![NPM downloads][download-img]][download-url] [![NPM version][npm-version]][npm-version-url] [![Chat][online-chat-img]][online-chat-url] @@ -18,6 +18,8 @@ [npm-version-url]: https://www.npmjs.com/package/@dtinsight/molecule [online-chat-img]: https://img.shields.io/discord/920616811261743104?logo=Molecule [online-chat-url]: https://discord.com/invite/b62gpHwNA7 +[cii-img]: https://bestpractices.coreinfrastructure.org/projects/6307/badge +[cii-url]: https://bestpractices.coreinfrastructure.org/projects/6307 [中文](./README-zhCN.md) | [English](./README.md) | [한국어](./README-koKR.md) diff --git a/website/docs/introduction.md b/website/docs/introduction.md index 89821910e..d07d2f3a9 100644 --- a/website/docs/introduction.md +++ b/website/docs/introduction.md @@ -9,7 +9,7 @@ sidebar_position: 1

Molecule

A lightweight Web IDE UI Framework

-[![CI][ci-image]][ci-url] [![Codecov][codecov-image]][codecov-url] [![NPM downloads][download-img]][download-url] [![NPM version][npm-version]][npm-version-url] [![Chat][online-chat-img]][online-chat-url] +[![CI][ci-image]][ci-url] [![CII Best Practices][cii-img]][cii-url] [![Codecov][codecov-image]][codecov-url] [![NPM downloads][download-img]][download-url] [![NPM version][npm-version]][npm-version-url] [![Chat][online-chat-img]][online-chat-url] @@ -23,6 +23,8 @@ sidebar_position: 1 [npm-version-url]: https://www.npmjs.com/package/@dtinsight/molecule [online-chat-img]: https://img.shields.io/discord/920616811261743104?logo=Molecule [online-chat-url]: https://discord.com/invite/b62gpHwNA7 +[cii-img]: https://bestpractices.coreinfrastructure.org/projects/6307/badge +[cii-url]: https://bestpractices.coreinfrastructure.org/projects/6307 The **Molecule** is a lightweight **Web IDE UI** Framework built with React.js，and inspired by the VSCode. We also provide the Extension APIs the seem like VSCode, to help developers extend the Workbench easily. The Molecule integrates with React.js applications is simple. It has applied to many [DTStack](https://www.dtstack.com/) inner projects. diff --git a/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/introduction.md b/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/introduction.md index f65de9727..5f99c26e6 100644 --- a/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/introduction.md +++ b/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/introduction.md @@ -9,7 +9,7 @@ sidebar_position: 1

Molecule

一个轻量的 Web IDE UI 框架

-[![CI][ci-image]][ci-url] [![Codecov][codecov-image]][codecov-url] [![NPM downloads][download-img]][download-url] [![NPM version][npm-version]][npm-version-url] [![Chat][online-chat-img]][online-chat-url] +[![CI][ci-image]][ci-url] [![CII Best Practices][cii-img]][cii-url] [![Codecov][codecov-image]][codecov-url] [![NPM downloads][download-img]][download-url] [![NPM version][npm-version]][npm-version-url] [![Chat][online-chat-img]][online-chat-url] @@ -23,6 +23,8 @@ sidebar_position: 1 [npm-version-url]: https://www.npmjs.com/package/@dtinsight/molecule [online-chat-img]: https://img.shields.io/discord/920616811261743104?logo=Molecule [online-chat-url]: https://discord.com/invite/b62gpHwNA7 +[cii-img]: https://bestpractices.coreinfrastructure.org/projects/6307/badge +[cii-url]: https://bestpractices.coreinfrastructure.org/projects/6307 ## 简介 From 289288b83fccec277215152ca912c74ea170d542 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=87=8E=E8=BF=82=E8=BF=82?= Date: Thu, 25 Aug 2022 11:32:41 +0800 Subject: [PATCH 04/10] fix: remove findDOMNode usage (#790) --- src/components/tabs/tab.tsx | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) diff --git a/src/components/tabs/tab.tsx b/src/components/tabs/tab.tsx index 8ac62ef04..dbe05b3d1 100644 --- a/src/components/tabs/tab.tsx +++ b/src/components/tabs/tab.tsx @@ -1,6 +1,5 @@ import React from 'react'; import { useRef } from 'react'; -import { findDOMNode } from 'react-dom'; import { useDrag, useDrop } from 'react-dnd'; import { IEditorGroup } from 'mo/model'; @@ -95,14 +94,7 @@ export function Tab({ tab, active, ...restEvents }: ITabComponent) { hover(item: ITabProps, monitor) { if (!ref.current) return; const component = ref.current; - /** - * TODO: bad code needs to be removed - */ - /* eslint-disable */ - const hoverBoundingRect = ( - findDOMNode(component) as Element - )?.getBoundingClientRect(); - /* eslint-enable */ + const hoverBoundingRect = component?.getBoundingClientRect(); const hoverMiddleX = (hoverBoundingRect.right - hoverBoundingRect.left) / 2; const clientOffset = monitor.getClientOffset(); From 4b26c14c55086b8e5e17f15aab0653838d3356cd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=87=8E=E8=BF=82=E8=BF=82?= Date: Thu, 25 Aug 2022 18:34:13 +0800 Subject: [PATCH 05/10] chore: remove todo comments (#791) --- src/common/css.ts | 1 - src/components/dialog/style.scss | 1 - 2 files changed, 2 deletions(-) diff --git a/src/common/css.ts b/src/common/css.ts index 5ec52cea1..d7874c3f2 100644 --- a/src/common/css.ts +++ b/src/common/css.ts @@ -1,7 +1,6 @@ /** * px = em * parentElementFontSize * @param em em value - * TODO: Use Template Literal Types replace fontSize typing */ export function em2Px(em: number, fontSize: number): number { return em * fontSize; diff --git a/src/components/dialog/style.scss b/src/components/dialog/style.scss index be1637963..0b2502087 100644 --- a/src/components/dialog/style.scss +++ b/src/components/dialog/style.scss @@ -15,7 +15,6 @@ user-select: none; width: auto; - // TODO rc-dialog提pr解决 &-mask { background-color: var(--widgetShadow); bottom: 0; From 80d99bcfed349a27345ac602a0f373f3c004f856 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=87=8E=E8=BF=82=E8=BF=82?= Date: Thu, 25 Aug 2022 18:34:47 +0800 Subject: [PATCH 06/10] fix: prevent call loadData when editing (#789) * fix: prevent call loadData when editing * test: improve test coverage --- .../sidebar/__tests__/folderTree.test.tsx | 18 ++++++++++++++++++ src/workbench/sidebar/explore/folderTree.tsx | 1 + src/workbench/sidebar/explore/style.scss | 4 ++-- 3 files changed, 21 insertions(+), 2 deletions(-) diff --git a/src/workbench/sidebar/__tests__/folderTree.test.tsx b/src/workbench/sidebar/__tests__/folderTree.test.tsx index 8746113c8..1b0efb85b 100644 --- a/src/workbench/sidebar/__tests__/folderTree.test.tsx +++ b/src/workbench/sidebar/__tests__/folderTree.test.tsx @@ -148,6 +148,24 @@ describe('The FolderTree Component', () => { ).toContain(folderTreeEditClassName); }); + test('Should NOT call loadData in editing', () => { + const mockFn = jest.fn(() => Promise.resolve()); + const { getByRole } = render( + + ); + + const input = getByRole('input') as HTMLInputElement; + expect(input).toBeInTheDocument(); + + fireEvent.click(input); + expect(mockFn).not.toBeCalled(); + }); + test('Should support to update file name via blur or keypress', () => { const mockFn = jest.fn(); const { getByRole } = render( diff --git a/src/workbench/sidebar/explore/folderTree.tsx b/src/workbench/sidebar/explore/folderTree.tsx index 5ba8c4f56..2fe8d20c1 100644 --- a/src/workbench/sidebar/explore/folderTree.tsx +++ b/src/workbench/sidebar/explore/folderTree.tsx @@ -205,6 +205,7 @@ const FolderTree: React.FunctionComponent = (props) => { autoComplete="off" autoFocus onBlur={(e) => handleInputBlur(e, node)} + onClick={(e) => e.stopPropagation()} /> ) : ( name! diff --git a/src/workbench/sidebar/explore/style.scss b/src/workbench/sidebar/explore/style.scss index f2e3a31e5..ed76680fe 100644 --- a/src/workbench/sidebar/explore/style.scss +++ b/src/workbench/sidebar/explore/style.scss @@ -34,12 +34,12 @@ font-family: inherit; font-size: 13px; height: 20px; - left: -2px; + left: 0; margin: 0; outline: none; padding: 0; position: relative; - width: 100%; + width: calc(100% - 2px); &:focus, &:active { From bee51e2b46a942442195999c2b4eea58567003de Mon Sep 17 00:00:00 2001 From: mortalYoung Date: Tue, 30 Aug 2022 20:19:11 +0800 Subject: [PATCH 07/10] fix: remove useless generic type --- src/components/tabs/index.tsx | 4 ++-- src/model/workbench/editor.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/tabs/index.tsx b/src/components/tabs/index.tsx index 805f77874..7e5c09e0a 100644 --- a/src/components/tabs/index.tsx +++ b/src/components/tabs/index.tsx @@ -17,9 +17,9 @@ import type { UniqueId } from 'mo/common/types'; export type TabsType = 'line' | 'card'; /** - * TODO: Get rid of the generic and remove the ComponentProps + * TODO: Get rid of the ComponentProps in next version */ -export interface ITabsProps extends React.ComponentProps { +export interface ITabsProps extends React.ComponentProps { className?: string; style?: React.CSSProperties; role?: string; diff --git a/src/model/workbench/editor.ts b/src/model/workbench/editor.ts index ab5a29c54..ec7c875a3 100644 --- a/src/model/workbench/editor.ts +++ b/src/model/workbench/editor.ts @@ -45,7 +45,7 @@ export interface IEditorAction { actions?: IEditorActionsProps[]; menu?: IMenuItemProps[]; } -export interface IEditorGroup extends ITabsProps { +export interface IEditorGroup extends ITabsProps { id: UniqueId; /** * Current editor group tab From 4856c9197d02a8cddf976a40a418987de865bfb3 Mon Sep 17 00:00:00 2001 From: mortalYoung Date: Tue, 30 Aug 2022 20:31:20 +0800 Subject: [PATCH 08/10] chore: remove todos --- src/controller/menuBar.ts | 5 ----- 1 file changed, 5 deletions(-) diff --git a/src/controller/menuBar.ts b/src/controller/menuBar.ts index dfe9f6192..f0016ee36 100644 --- a/src/controller/menuBar.ts +++ b/src/controller/menuBar.ts @@ -121,11 +121,6 @@ export class MenuBarController public readonly onClick = (event: React.MouseEvent, item: IMenuBarItem) => { const menuId = item.id || ''; - /** - * TODO: Two issues remain to be addressed - * 1、the default event is executed twice - * 2、we have no way of knowing whether user-defined events are executed internally - */ this.emit(MenuBarEvent.onSelect, menuId); this._automation[menuId]?.(); From ba1b7e84b37b171049038030e8cc80a9fb1ad4fd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=87=8E=E8=BF=82=E8=BF=82?= Date: Wed, 31 Aug 2022 19:19:16 +0800 Subject: [PATCH 09/10] chore: remove todos (#795) --- src/components/dialog/confirm.tsx | 21 ++++++++------------- 1 file changed, 8 insertions(+), 13 deletions(-) diff --git a/src/components/dialog/confirm.tsx b/src/components/dialog/confirm.tsx index 6fbbf0f3e..5a4757ca5 100644 --- a/src/components/dialog/confirm.tsx +++ b/src/components/dialog/confirm.tsx @@ -44,19 +44,14 @@ export default function confirm(config: IModalFuncProps) { } function render({ okText, cancelText, ...props }: any) { - /** - * TODO: Please determine if this really needs to be a macro task - */ - setTimeout(() => { - renderUtils( - , - div - ); - }); + renderUtils( + , + div + ); } function close(...args: any[]) { From c3054709fb85817df6cf8a8f956fdc4e608f3fd8 Mon Sep 17 00:00:00 2001 From: mortalYoung Date: Wed, 31 Aug 2022 19:28:58 +0800 Subject: [PATCH 10/10] chore(release): 1.1.1 --- CHANGELOG.md | 8 ++++++++ package.json | 2 +- 2 files changed, 9 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 9096e512e..800b1d45d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,14 @@ All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines. +### [1.1.1](https://github.com/DTStack/molecule/compare/v1.1.0...v1.1.1) (2022-08-31) + +### Bug Fixes + +- prevent call loadData when editing ([#789](https://github.com/DTStack/molecule/issues/789)) ([80d99bc](https://github.com/DTStack/molecule/commit/80d99bcfed349a27345ac602a0f373f3c004f856)) +- remove findDOMNode usage ([#790](https://github.com/DTStack/molecule/issues/790)) ([289288b](https://github.com/DTStack/molecule/commit/289288b83fccec277215152ca912c74ea170d542)) +- remove useless generic type ([bee51e2](https://github.com/DTStack/molecule/commit/bee51e2b46a942442195999c2b4eea58567003de)) + ## [1.1.0](https://github.com/DTStack/molecule/compare/v1.0.2...v1.1.0) (2022-07-15) ### Features diff --git a/package.json b/package.json index b74e9f977..85bd42259 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@dtinsight/molecule", - "version": "1.1.0", + "version": "1.1.1", "description": "A Web IDE UI Framework built with React.js, inspired by VSCode.", "module": "./esm/index.js", "typings": "./esm/index.d.ts",