From db1cb49487fbd603e05a48506aa8335e2f848c12 Mon Sep 17 00:00:00 2001 From: mathuo <6710312+mathuo@users.noreply.github.com> Date: Tue, 7 Mar 2023 22:33:13 +0800 Subject: [PATCH 1/4] refactor: set deserializer by default --- .../dockview/dockviewComponent.spec.ts | 13 ------------ .../src/dockview/dockviewComponent.ts | 20 ++++--------------- packages/dockview/src/dockview/dockview.tsx | 2 -- 3 files changed, 4 insertions(+), 31 deletions(-) diff --git a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts index 6ee389a3b..48cfa1a4d 100644 --- a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts +++ b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts @@ -16,7 +16,6 @@ import { DockviewPanelApi, DockviewPanelApiImpl, } from '../../api/dockviewPanelApi'; -import { DefaultDockviewDeserialzier } from '../../dockview/deserializer'; import { IDockviewPanelModel } from '../../dockview/dockviewPanelModel'; import { DockviewPanelModelMock } from '../__mocks__/mockDockviewPanelMode'; import { DefaultTab } from '../../dockview/components/tab/defaultTab'; @@ -470,7 +469,6 @@ describe('dockviewComponent', () => { test('serialization', () => { dockview.layout(1000, 1000); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); dockview.fromJSON({ activeGroup: 'group-1', grid: { @@ -1382,7 +1380,6 @@ describe('dockviewComponent', () => { default: PanelContentPartTest, }, }); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); dockview.layout(500, 1000); @@ -1507,7 +1504,6 @@ describe('dockviewComponent', () => { }) ); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); dockview.fromJSON({ activeGroup: 'group-1', grid: { @@ -1641,7 +1637,6 @@ describe('dockviewComponent', () => { default: PanelContentPartTest, }, }); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); dockview.fromJSON({ activeGroup: 'group-1', grid: { @@ -1731,7 +1726,6 @@ describe('dockviewComponent', () => { test_tab_id: PanelTabPartTest, }, }); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); dockview.fromJSON({ activeGroup: 'group-1', grid: { @@ -1840,7 +1834,6 @@ describe('dockviewComponent', () => { test_tab_id: PanelTabPartTest, }, }); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); dockview.fromJSON({ activeGroup: 'group-1', grid: { @@ -1928,7 +1921,6 @@ describe('dockviewComponent', () => { }, orientation: Orientation.HORIZONTAL, }); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); expect(dockview.orientation).toBe(Orientation.HORIZONTAL); @@ -2034,7 +2026,6 @@ describe('dockviewComponent', () => { }, orientation: Orientation.HORIZONTAL, }); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); expect(dockview.orientation).toBe(Orientation.HORIZONTAL); @@ -2175,7 +2166,6 @@ describe('dockviewComponent', () => { }, orientation: Orientation.HORIZONTAL, }); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); expect(dockview.orientation).toBe(Orientation.HORIZONTAL); @@ -2303,7 +2293,6 @@ describe('dockviewComponent', () => { }, orientation: Orientation.HORIZONTAL, }); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); expect(dockview.groups.length).toBe(0); }); @@ -2320,7 +2309,6 @@ describe('dockviewComponent', () => { }, orientation: Orientation.HORIZONTAL, }); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); expect(dockview.groups.length).toBe(0); @@ -2360,7 +2348,6 @@ describe('dockviewComponent', () => { }, orientation: Orientation.HORIZONTAL, }); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); expect(JSON.parse(JSON.stringify(dockview.toJSON()))).toEqual({ grid: { diff --git a/packages/dockview-core/src/dockview/dockviewComponent.ts b/packages/dockview-core/src/dockview/dockviewComponent.ts index c2ab01930..8c549b632 100644 --- a/packages/dockview-core/src/dockview/dockviewComponent.ts +++ b/packages/dockview-core/src/dockview/dockviewComponent.ts @@ -16,7 +16,7 @@ import { DockviewDropTargets, } from './types'; import { sequentialNumberGenerator } from '../math'; -import { IPanelDeserializer } from './deserializer'; +import { DefaultDockviewDeserialzier } from './deserializer'; import { createComponent } from '../panel/componentFactory'; import { AddGroupOptions, @@ -87,7 +87,6 @@ export interface IDockviewComponent extends IBaseGrid { readonly onDidDrop: Event; readonly orientation: Orientation; tabHeight: number | undefined; - deserializer: IPanelDeserializer | undefined; updateOptions(options: DockviewComponentUpdateOptions): void; moveGroupOrPanel( referenceGroup: DockviewGroupPanel, @@ -125,8 +124,8 @@ export class DockviewComponent implements IDockviewComponent { private readonly nextGroupId = sequentialNumberGenerator(); - private _deserializer: IPanelDeserializer | undefined; - private _api: DockviewApi; + private readonly _deserializer = new DefaultDockviewDeserialzier(this); + private readonly _api: DockviewApi; private _options: Exclude; private watermark: IWatermarkRenderer | null = null; @@ -161,14 +160,6 @@ export class DockviewComponent return this.groups.flatMap((group) => group.panels); } - get deserializer(): IPanelDeserializer | undefined { - return this._deserializer; - } - - set deserializer(value: IPanelDeserializer | undefined) { - this._deserializer = value; - } - get options(): DockviewComponentOptions { return this._options; } @@ -428,9 +419,6 @@ export class DockviewComponent fromJSON(data: SerializedDockview): void { this.clear(); - if (!this.deserializer) { - throw new Error('no deserializer provided'); - } const { grid, panels, options, activeGroup } = data; if (typeof options?.tabHeight === 'number') { @@ -454,7 +442,7 @@ export class DockviewComponent this._onDidAddGroup.fire(group); for (const child of views) { - const panel = this.deserializer!.fromJSON( + const panel = this._deserializer.fromJSON( panels[child], group ); diff --git a/packages/dockview/src/dockview/dockview.tsx b/packages/dockview/src/dockview/dockview.tsx index 7d1fe46fa..534a1cca6 100644 --- a/packages/dockview/src/dockview/dockview.tsx +++ b/packages/dockview/src/dockview/dockview.tsx @@ -11,7 +11,6 @@ import { ITabRenderer, watchElementResize, DockviewGroupPanel, - DefaultDockviewDeserialzier, } from 'dockview-core'; import { ReactPanelContentPart } from './reactContentPart'; import { ReactPanelHeaderPart } from './reactHeaderPart'; @@ -173,7 +172,6 @@ export const DockviewReact = React.forwardRef( }); domRef.current?.appendChild(dockview.element); - dockview.deserializer = new DefaultDockviewDeserialzier(dockview); const { clientWidth, clientHeight } = domRef.current!; dockview.layout(clientWidth, clientHeight); From e0bf694512ae8dcf0cf774b7c522a64e33f44c80 Mon Sep 17 00:00:00 2001 From: mathuo <6710312+mathuo@users.noreply.github.com> Date: Tue, 7 Mar 2023 22:33:29 +0800 Subject: [PATCH 2/4] chore: add README --- packages/README.md | 16 +++++ .../dockview/dockviewComponent.spec.ts | 72 +------------------ 2 files changed, 19 insertions(+), 69 deletions(-) create mode 100644 packages/README.md diff --git a/packages/README.md b/packages/README.md new file mode 100644 index 000000000..b6d61140e --- /dev/null +++ b/packages/README.md @@ -0,0 +1,16 @@ +# Project Structure + +## dockview-core + +- Contains the core logic for the dockview library. +- Written entirely in vanilla JavaScript/TypeScript. + +## dockview + +- Depends on `dockview-core`. +- Exports a `React` wrapper. +- Published `dockview` package. + +## docs + +- Code for website found at [dockview.dev](dockview.dev). diff --git a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts index 48cfa1a4d..0cea829c4 100644 --- a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts +++ b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts @@ -93,66 +93,6 @@ class PanelTabPartTest implements ITabRenderer { } } -class TestGroupPanel implements IDockviewPanel { - private _group: DockviewGroupPanel | undefined; - - readonly api: DockviewPanelApi; - readonly view: IDockviewPanelModel; - - constructor( - public readonly id: string, - public readonly title: string, - accessor: DockviewComponent - ) { - this.api = new DockviewPanelApiImpl(this, this._group!); - this._group = new DockviewGroupPanel(accessor, id, {}); - this.view = new DockviewPanelModelMock( - 'component', - new PanelContentPartTest(id, 'component'), - 'tabComponent', - new DefaultTab() - ); - } - - get params(): Record { - return {}; - } - get group(): DockviewGroupPanel { - return this._group!; - } - - updateParentGroup(group: DockviewGroupPanel, isGroupActive: boolean): void { - this._group = group; - } - - init(params: IGroupPanelInitParameters): void { - // - } - - layout(width: number, height: number): void { - // - } - - focus(): void { - // - } - - toJSON(): GroupviewPanelState { - return { - id: this.id, - title: this.title, - }; - } - - update(event: GroupPanelUpdateEvent): void { - // - } - - dispose(): void { - // - } -} - describe('dockviewComponent', () => { let container: HTMLElement; let dockview: DockviewComponent; @@ -990,15 +930,6 @@ describe('dockviewComponent', () => { test('#1', () => { dockview.layout(500, 500); - dockview.deserializer = { - fromJSON: (panelData: GroupviewPanelState): IDockviewPanel => { - return new TestGroupPanel( - panelData.id, - panelData.title || '', - dockview - ); - }, - }; const panel1 = dockview.addPanel({ id: 'panel1', @@ -1053,14 +984,17 @@ describe('dockviewComponent', () => { panels: { view_1: { id: 'view_1', + contentComponent: 'default', title: 'view_1_title', }, view_2: { id: 'view_2', + contentComponent: 'default', title: 'view_2_title', }, view_3: { id: 'view_3', + contentComponent: 'default', title: 'view_3_title', }, }, From 7ac07bdf0d2c2b14106c816ed825e987d6d63fb8 Mon Sep 17 00:00:00 2001 From: mathuo <6710312+mathuo@users.noreply.github.com> Date: Sun, 12 Mar 2023 21:22:38 +0800 Subject: [PATCH 3/4] chore: fix docs build --- .github/workflows/deploy-docs.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.github/workflows/deploy-docs.yml b/.github/workflows/deploy-docs.yml index eb4967280..9c242d324 100644 --- a/.github/workflows/deploy-docs.yml +++ b/.github/workflows/deploy-docs.yml @@ -27,6 +27,8 @@ jobs: - run: yarn install - run: lerna bootstrap + - run: npm run build + working-directory: packages/dockview-core - run: npm run build working-directory: packages/dockview - run: npm run build From dd8a648a3e2f8c8e48ebb249e10ba6bd562d0922 Mon Sep 17 00:00:00 2001 From: mathuo <6710312+mathuo@users.noreply.github.com> Date: Sun, 12 Mar 2023 21:45:30 +0800 Subject: [PATCH 4/4] chore: readme file --- packages/README.md | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/README.md b/packages/README.md index b6d61140e..7543f83de 100644 --- a/packages/README.md +++ b/packages/README.md @@ -1,5 +1,7 @@ # Project Structure +This mono-repository has a number of packages containing the code for the [dockview](https://www.npmjs.com/package/dockview) library and the documentation website [dockview.dev](dockview.dev). + ## dockview-core - Contains the core logic for the dockview library. @@ -9,8 +11,8 @@ - Depends on `dockview-core`. - Exports a `React` wrapper. -- Published `dockview` package. +- Published as [dockview](https://www.npmjs.com/package/dockview) on npm. ## docs -- Code for website found at [dockview.dev](dockview.dev). +- Code for [dockview.dev](dockview.dev).