Upstream/waveterm
1
0
Fork 0
mirror of https://github.com/wavetermdev/waveterm.git synced 2025-01-02 18:39:05 +01:00
Code Issues Packages Projects Releases Wiki Activity

POC to get new context menu items from the viewmodel -> settings

Browse Source
This commit is contained in:
sawka 2024-07-08 15:32:10 -07:00
parent 68db3d4757
commit 3b01234914
2 changed files with 52 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
frontend/app/block/block.tsx
View File

@ -158,7 +158,12 @@ function getBlockHeaderText(blockIcon: string, blockData: Block, settings: Setti
return [blockIconElem, viewString + blockIdStr];
}
function handleHeaderContextMenu(e: React.MouseEvent<HTMLDivElement>, blockData: Block, onClose: () => void) {
function handleHeaderContextMenu(
e: React.MouseEvent<HTMLDivElement>,
blockData: Block,
viewModel: ViewModel,
onClose: () => void
) {
e.preventDefault();
e.stopPropagation();
let menu: ContextMenuItem[] = [];
@ -168,6 +173,12 @@ function handleHeaderContextMenu(e: React.MouseEvent<HTMLDivElement>, blockData:
alert("Not Implemented");
},
});
menu.push({
label: "Minimize",
click: () => {
alert("Not Implemented");
},
});
menu.push({
label: "Move to New Window",
click: () => {
@ -186,6 +197,11 @@ function handleHeaderContextMenu(e: React.MouseEvent<HTMLDivElement>, blockData:
navigator.clipboard.writeText(blockData.oid);
},
});
const extraItems = viewModel?.getSettingsMenuItems?.();
if (extraItems && extraItems.length > 0) {
menu.push({ type: "separator" });
menu.push(...extraItems);
}
menu.push({ type: "separator" });
menu.push({
label: "Close Block",
@ -226,42 +242,6 @@ const BlockFrame_Default_Component = ({
if (isFocused && blockData?.meta?.["frame:bordercolor:focused"]) {
style.borderColor = blockData.meta["frame:bordercolor:focused"];
}
let handleSettings = (e: React.MouseEvent<any>) => {
let menuItems: ContextMenuItem[] = [];
menuItems.push({
label: "Focus Block",
click: () => {
alert("Not Implemented");
},
});
menuItems.push({ label: "Minimize" });
menuItems.push({ type: "separator" });
menuItems.push({
label: "Move to New Window",
click: () => {
let currentTabId = globalStore.get(atoms.activeTabId);
try {
services.WindowService.MoveBlockToNewWindow(currentTabId, blockData.oid);
} catch (e) {
console.error("error moving block to new window", e);
}
},
});
menuItems.push({ type: "separator" });
menuItems.push({
label: "Copy BlockId",
click: () => {
navigator.clipboard.writeText(blockData.oid);
},
});
menuItems.push({ type: "separator" });
menuItems.push({ label: "Close", click: layoutModel?.onClose });
ContextMenuModel.showContextMenu(menuItems, e);
};
if (preview) {
handleSettings = null;
}
return (
<div
className={clsx(
@ -279,7 +259,7 @@ const BlockFrame_Default_Component = ({
<div
className="block-frame-default-header"
ref={layoutModel?.dragHandleRef}
onContextMenu={(e) => handleHeaderContextMenu(e, blockData, layoutModel?.onClose)}
onContextMenu={(e) => handleHeaderContextMenu(e, blockData, viewModel, layoutModel?.onClose)}
>
<div className="block-frame-default-header-iconview">
{hasBackButton && !hasForwardButton && (
@ -296,7 +276,10 @@ const BlockFrame_Default_Component = ({
{util.isBlank(viewText) ? null : <div className="block-frame-text">{viewText}</div>}
<div className="flex-spacer"></div>
<div className="block-frame-end-icons">
<div className="block-frame-settings" onClick={handleSettings}>
<div
className="block-frame-settings"
onClick={(e) => handleHeaderContextMenu(e, blockData, viewModel, layoutModel?.onClose)}
>
<i className="fa fa-solid fa-cog fa-fw" />
</div>
<div className={clsx("block-frame-default-close")} onClick={layoutModel?.onClose}>

30
frontend/app/view/preview.tsx
View File

@ -119,6 +119,36 @@ export class PreviewModel implements ViewModel {
const newPath = splitPath.join("/");
globalStore.set(this.fileName, newPath);
}
getSettingsMenuItems(): ContextMenuItem[] {
const menuItems: ContextMenuItem[] = [];
menuItems.push({
label: "Copy Full Path",
click: () => {
const fileName = globalStore.get(this.fileName);
if (fileName == null) {
return;
}
navigator.clipboard.writeText(fileName);
},
});
menuItems.push({
label: "Copy File Name",
click: () => {
let fileName = globalStore.get(this.fileName);
if (fileName == null) {
return;
}
if (fileName.endsWith("/")) {
fileName = fileName.substring(0, fileName.length - 1);
}
const splitPath = fileName.split("/");
const baseName = splitPath[splitPath.length - 1];
navigator.clipboard.writeText(baseName);
},
});
return menuItems;
}
}
function makePreviewModel(blockId: string): PreviewModel {