Skip to content

Commit 97e8a95

Browse files
mathuomathuo
committed
feat: experimental work
1 parent 25489bf commit 97e8a95

File tree

7 files changed

+439
-68
lines changed

7 files changed

+439
-68
lines changed

‎packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts

Lines changed: 233 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -679,6 +679,239 @@ describe('dockviewComponent', () => {
679679
expect(viewQuery.length).toBe(1);
680680
});
681681

682+
describe('serialization', () => {
683+
test('reuseExistingPanels true', () => {
684+
const parts: PanelContentPartTest[] = [];
685+
686+
dockview = new DockviewComponent(container, {
687+
createComponent(options) {
688+
switch (options.name) {
689+
case 'default':
690+
const part = new PanelContentPartTest(
691+
options.id,
692+
options.name
693+
);
694+
parts.push(part);
695+
return part;
696+
default:
697+
throw new Error(`unsupported`);
698+
}
699+
},
700+
});
701+
702+
dockview.layout(1000, 1000);
703+
704+
dockview.addPanel({ id: 'panel1', component: 'default' });
705+
dockview.addPanel({ id: 'panel2', component: 'default' });
706+
dockview.addPanel({ id: 'panel7', component: 'default' });
707+
708+
expect(parts.length).toBe(3);
709+
710+
expect(parts.map((part) => part.isDisposed)).toEqual([
711+
false,
712+
false,
713+
false,
714+
]);
715+
716+
dockview.fromJSON(
717+
{
718+
activeGroup: 'group-1',
719+
grid: {
720+
root: {
721+
type: 'branch',
722+
data: [
723+
{
724+
type: 'leaf',
725+
data: {
726+
views: ['panel1'],
727+
id: 'group-1',
728+
activeView: 'panel1',
729+
},
730+
size: 500,
731+
},
732+
{
733+
type: 'branch',
734+
data: [
735+
{
736+
type: 'leaf',
737+
data: {
738+
views: ['panel2', 'panel3'],
739+
id: 'group-2',
740+
},
741+
size: 500,
742+
},
743+
{
744+
type: 'leaf',
745+
data: {
746+
views: ['panel4'],
747+
id: 'group-3',
748+
},
749+
size: 500,
750+
},
751+
],
752+
size: 500,
753+
},
754+
],
755+
size: 1000,
756+
},
757+
height: 1000,
758+
width: 1000,
759+
orientation: Orientation.VERTICAL,
760+
},
761+
panels: {
762+
panel1: {
763+
id: 'panel1',
764+
contentComponent: 'default',
765+
tabComponent: 'tab-default',
766+
title: 'panel1',
767+
},
768+
panel2: {
769+
id: 'panel2',
770+
contentComponent: 'default',
771+
title: 'panel2',
772+
},
773+
panel3: {
774+
id: 'panel3',
775+
contentComponent: 'default',
776+
title: 'panel3',
777+
renderer: 'onlyWhenVisible',
778+
},
779+
panel4: {
780+
id: 'panel4',
781+
contentComponent: 'default',
782+
title: 'panel4',
783+
renderer: 'always',
784+
},
785+
},
786+
},
787+
{ reuseExistingPanels: true }
788+
);
789+
790+
expect(parts.map((part) => part.isDisposed)).toEqual([
791+
false,
792+
false,
793+
true,
794+
false,
795+
false,
796+
]);
797+
});
798+
799+
test('reuseExistingPanels false', () => {
800+
const parts: PanelContentPartTest[] = [];
801+
802+
dockview = new DockviewComponent(container, {
803+
createComponent(options) {
804+
switch (options.name) {
805+
case 'default':
806+
const part = new PanelContentPartTest(
807+
options.id,
808+
options.name
809+
);
810+
parts.push(part);
811+
return part;
812+
default:
813+
throw new Error(`unsupported`);
814+
}
815+
},
816+
});
817+
818+
dockview.layout(1000, 1000);
819+
820+
dockview.addPanel({ id: 'panel1', component: 'default' });
821+
dockview.addPanel({ id: 'panel2', component: 'default' });
822+
dockview.addPanel({ id: 'panel7', component: 'default' });
823+
824+
expect(parts.length).toBe(3);
825+
826+
expect(parts.map((part) => part.isDisposed)).toEqual([
827+
false,
828+
false,
829+
false,
830+
]);
831+
832+
dockview.fromJSON({
833+
activeGroup: 'group-1',
834+
grid: {
835+
root: {
836+
type: 'branch',
837+
data: [
838+
{
839+
type: 'leaf',
840+
data: {
841+
views: ['panel1'],
842+
id: 'group-1',
843+
activeView: 'panel1',
844+
},
845+
size: 500,
846+
},
847+
{
848+
type: 'branch',
849+
data: [
850+
{
851+
type: 'leaf',
852+
data: {
853+
views: ['panel2', 'panel3'],
854+
id: 'group-2',
855+
},
856+
size: 500,
857+
},
858+
{
859+
type: 'leaf',
860+
data: {
861+
views: ['panel4'],
862+
id: 'group-3',
863+
},
864+
size: 500,
865+
},
866+
],
867+
size: 500,
868+
},
869+
],
870+
size: 1000,
871+
},
872+
height: 1000,
873+
width: 1000,
874+
orientation: Orientation.VERTICAL,
875+
},
876+
panels: {
877+
panel1: {
878+
id: 'panel1',
879+
contentComponent: 'default',
880+
tabComponent: 'tab-default',
881+
title: 'panel1',
882+
},
883+
panel2: {
884+
id: 'panel2',
885+
contentComponent: 'default',
886+
title: 'panel2',
887+
},
888+
panel3: {
889+
id: 'panel3',
890+
contentComponent: 'default',
891+
title: 'panel3',
892+
renderer: 'onlyWhenVisible',
893+
},
894+
panel4: {
895+
id: 'panel4',
896+
contentComponent: 'default',
897+
title: 'panel4',
898+
renderer: 'always',
899+
},
900+
},
901+
});
902+
903+
expect(parts.map((part) => part.isDisposed)).toEqual([
904+
true,
905+
true,
906+
true,
907+
false,
908+
false,
909+
false,
910+
false,
911+
]);
912+
});
913+
});
914+
682915
test('serialization', () => {
683916
dockview.layout(1000, 1000);
684917

‎packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -209,6 +209,10 @@ export class TestPanel implements IDockviewPanel {
209209
});
210210
}
211211

212+
updateFromStateModel(state: GroupviewPanelState): void {
213+
//
214+
}
215+
212216
init(params: IGroupPanelInitParameters) {
213217
this._params = params;
214218
}

‎packages/dockview-core/src/api/component.api.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -854,8 +854,11 @@ export class DockviewApi implements CommonApi<SerializedDockview> {
854854
/**
855855
* Create a component from a serialized object.
856856
*/
857-
fromJSON(data: SerializedDockview): void {
858-
this.component.fromJSON(data);
857+
fromJSON(
858+
data: SerializedDockview,
859+
options?: { reuseExistingPanels: boolean }
860+
): void {
861+
this.component.fromJSON(data, options);
859862
}
860863

861864
/**

0 commit comments

Comments
 (0)