rei-mirrors/dockview
1
0
Fork 0
mirror of https://github.com/mathuo/dockview synced 2025-08-10 11:16:07 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: fix demo

Browse Source
This commit is contained in:
mathuo 2024-01-10 09:49:16 +00:00
parent 64076b2bdd
commit 2c77b7e208
No known key found for this signature in database
GPG Key ID: C6EEDEFD6CA07281
1 changed files with 44 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
packages/docs/sandboxes/demo-dockview/src/app.tsx
View File

@ -124,54 +124,54 @@ const RightControls = (props: IDockviewHeaderActionsProps) => {
return groupControlsComponents[props.activePanel.id];
}, [props.isGroupActive, props.activePanel]);
const [icon, setIcon] = React.useState<string>(
props.containerApi.hasMaximizedGroup()
? 'collapse_content'
: 'expand_content'
);
// const [icon, setIcon] = React.useState<string>(
// props.containerApi.hasMaximizedGroup()
// ? 'collapse_content'
// : 'expand_content'
// );
const [popoutIcon, setPopoutIcon] = React.useState<string>(
props.api.location === 'popout' ? 'close_fullscreen' : 'open_in_new'
);
// const [popoutIcon, setPopoutIcon] = React.useState<string>(
// props.api.location === 'popout' ? 'close_fullscreen' : 'open_in_new'
// );
React.useEffect(() => {
const disposable = props.containerApi.onDidMaxmizedGroupChange(() => {
setIcon(
props.containerApi.hasMaximizedGroup()
? 'collapse_content'
: 'expand_content'
);
});
// React.useEffect(() => {
// const disposable = props.containerApi.onDidMaxmizedGroupChange(() => {
// setIcon(
// props.containerApi.hasMaximizedGroup()
// ? 'collapse_content'
// : 'expand_content'
// );
// });
const disposable2 = props.api.onDidLocationChange(() => {
setPopoutIcon(
props.api.location === 'popout'
? 'close_fullscreen'
: 'open_in_new'
);
});
// const disposable2 = props.api.onDidLocationChange(() => {
// setPopoutIcon(
// props.api.location === 'popout'
// ? 'close_fullscreen'
// : 'open_in_new'
// );
// });
return () => {
disposable.dispose();
disposable2.dispose();
};
}, [props.containerApi]);
// return () => {
// disposable.dispose();
// disposable2.dispose();
// };
// }, [props.containerApi]);
const onClick = () => {
if (props.containerApi.hasMaximizedGroup()) {
props.containerApi.exitMaxmizedGroup();
} else {
props.activePanel?.api.maximize();
}
};
// const onClick = () => {
// if (props.containerApi.hasMaximizedGroup()) {
// props.containerApi.exitMaxmizedGroup();
// } else {
// props.activePanel?.api.maximize();
// }
// };
const onClick2 = () => {
if (props.api.location !== 'popout') {
props.containerApi.addPopoutGroup(props.group);
} else {
props.api.moveTo({ position: 'right' });
}
};
// const onClick2 = () => {
// if (props.api.location !== 'popout') {
// props.containerApi.addPopoutGroup(props.group);
// } else {
// props.api.moveTo({ position: 'right' });
// }
// };
return (
<div
@ -186,8 +186,8 @@ const RightControls = (props: IDockviewHeaderActionsProps) => {
>
{props.isGroupActive && <Icon icon="star" />}
{Component && <Component />}
<Icon icon={popoutIcon} onClick={onClick2} />
<Icon icon={icon} onClick={onClick} />
{/* <Icon icon={popoutIcon} onClick={onClick2} />
<Icon icon={icon} onClick={onClick} /> */}
</div>
);
};