feat: persist grid gap

This commit is contained in:
mathuo 2024-11-15 21:26:41 +00:00
parent 25489bf48e
commit 622810ac2e
No known key found for this signature in database
GPG Key ID: C6EEDEFD6CA07281
2 changed files with 16 additions and 5 deletions

View File

@ -121,6 +121,7 @@ export interface SerializedDockview {
width: number;
orientation: Orientation;
};
gridGap?: number;
panels: Record<string, GroupviewPanelState>;
activeGroup?: string;
floatingGroups?: SerializedFloatingGroup[];
@ -1216,6 +1217,12 @@ export class DockviewComponent
result.popoutGroups = popoutGroups;
}
const gap = this.gap;
if (gap !== 0) {
result.gridGap = gap;
}
return result;
}
@ -1232,6 +1239,8 @@ export class DockviewComponent
throw new Error('root must be of type branch');
}
this.gridview.margin = data.gridGap ?? 0;
try {
// take note of the existing dimensions
const width = this.width;

View File

@ -103,6 +103,8 @@ export const GridActions = (props: {
if (state) {
try {
props.api?.fromJSON(JSON.parse(state));
setGap(props.api?.gap ?? 0);
} catch (err) {
console.error('failed to load state', err);
localStorage.removeItem('dv-demo-state');
@ -154,10 +156,6 @@ export const GridActions = (props: {
const [gap, setGap] = React.useState(0);
React.useEffect(() => {
props.api?.setGap(gap);
}, [gap, props.api]);
return (
<div className="action-container">
<div className="button-group">
@ -208,7 +206,11 @@ export const GridActions = (props: {
max={99}
step={1}
value={gap}
onChange={(event) => setGap(Number(event.target.value))}
onChange={(event) => {
const value = Number(event.target.value);
setGap(value);
props.api?.setGap(value);
}}
/>
</div>
</div>