@theia/terminal-manager 1.67.0-next.86

package/src/browser/terminal-manager-tree-model.ts

@@ -0,0 +1,336 @@
+// *****************************************************************************
+// Copyright (C) 2023 Ericsson and others.
+//
+// This program and the accompanying materials are made available under the
+// terms of the Eclipse Public License v. 2.0 which is available at
+// http://www.eclipse.org/legal/epl-2.0.
+//
+// This Source Code may also be made available under the following Secondary
+// Licenses when the conditions for such availability set forth in the Eclipse
+// Public License v. 2.0 are satisfied: GNU General Public License, version 2
+// with the GNU Classpath Exception which is available at
+// https://www.gnu.org/software/classpath/license.html.
+//
+// SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
+// *****************************************************************************
+
+import { injectable, postConstruct } from '@theia/core/shared/inversify';
+import { TreeModelImpl, CompositeTreeNode, SelectableTreeNode, DepthFirstTreeIterator } from '@theia/core/lib/browser';
+import { Emitter } from '@theia/core';
+import { TerminalManagerTreeTypes } from './terminal-manager-types';
+
+@injectable()
+export class TerminalManagerTreeModel extends TreeModelImpl {
+    activePageNode: TerminalManagerTreeTypes.PageNode | undefined;
+    activeGroupNode: TerminalManagerTreeTypes.TerminalGroupNode | undefined;
+    activeTerminalNode: TerminalManagerTreeTypes.TerminalNode | undefined;
+
+    protected onDidChangeTreeSelectionEmitter = new Emitter<TerminalManagerTreeTypes.SelectionChangedEvent>();
+    readonly onDidChangeTreeSelection = this.onDidChangeTreeSelectionEmitter.event;
+
+    protected onDidAddPageEmitter = new Emitter<{ pageId: TerminalManagerTreeTypes.PageId, terminalKey: TerminalManagerTreeTypes.TerminalKey }>();
+    readonly onDidAddPage = this.onDidAddPageEmitter.event;
+    protected onDidDeletePageEmitter = new Emitter<TerminalManagerTreeTypes.PageId>();
+    readonly onDidDeletePage = this.onDidDeletePageEmitter.event;
+
+    protected onDidRenameNodeEmitter = new Emitter<TerminalManagerTreeTypes.TerminalManagerTreeNode>();
+    readonly onDidRenameNode = this.onDidRenameNodeEmitter.event;
+
+    protected onDidAddTerminalGroupEmitter = new Emitter<{
+        groupId: TerminalManagerTreeTypes.GroupId,
+        pageId: TerminalManagerTreeTypes.PageId,
+        terminalKey: TerminalManagerTreeTypes.TerminalKey,
+    }>();
+    readonly onDidAddTerminalGroup = this.onDidAddTerminalGroupEmitter.event;
+
+    protected onDidDeleteTerminalGroupEmitter = new Emitter<TerminalManagerTreeTypes.GroupId>();
+    readonly onDidDeleteTerminalGroup = this.onDidDeleteTerminalGroupEmitter.event;
+
+    protected onDidAddTerminalToGroupEmitter = new Emitter<{
+        terminalId: TerminalManagerTreeTypes.TerminalKey,
+        groupId: TerminalManagerTreeTypes.GroupId,
+    }>();
+    readonly onDidAddTerminalToGroup = this.onDidAddTerminalToGroupEmitter.event;
+
+    protected onDidDeleteTerminalFromGroupEmitter = new Emitter<{
+        terminalId: TerminalManagerTreeTypes.TerminalKey,
+        groupId: TerminalManagerTreeTypes.GroupId,
+    }>();
+    readonly onDidDeleteTerminalFromGroup = this.onDidDeleteTerminalFromGroupEmitter.event;
+
+    @postConstruct()
+    protected override init(): void {
+        super.init();
+        this.toDispose.push(this.selectionService.onSelectionChanged(selectionEvent => {
+            const selectedNode = selectionEvent.find(node => node.selected);
+            if (selectedNode) {
+                this.handleSelectionChanged(selectedNode);
+            }
+        }));
+        this.root = { id: 'root', parent: undefined, children: [], visible: false } as CompositeTreeNode;
+    }
+
+    addTerminalPage(
+        terminalKey: TerminalManagerTreeTypes.TerminalKey,
+        groupId: TerminalManagerTreeTypes.GroupId,
+        pageId: TerminalManagerTreeTypes.PageId,
+    ): void {
+        const pageNode = this.createPageNode(pageId);
+        const groupNode = this.createGroupNode(groupId, pageId);
+        const terminalNode = this.createTerminalNode(terminalKey, groupId);
+        if (this.root && CompositeTreeNode.is(this.root)) {
+            this.activePageNode = pageNode;
+            CompositeTreeNode.addChild(groupNode, terminalNode);
+            CompositeTreeNode.addChild(pageNode, groupNode);
+            this.root = CompositeTreeNode.addChild(this.root, pageNode);
+            this.onDidAddPageEmitter.fire({ pageId: pageNode.id, terminalKey });
+            setTimeout(() => {
+                this.selectionService.addSelection(terminalNode);
+            });
+        }
+    }
+
+    protected createPageNode(pageId: TerminalManagerTreeTypes.PageId): TerminalManagerTreeTypes.PageNode {
+        const currentPageNumber = this.getNextPageCounter();
+        return {
+            id: pageId,
+            label: `Page(${currentPageNumber})`,
+            parent: undefined,
+            selected: false,
+            children: [],
+            page: true,
+            isEditing: false,
+            expanded: true,
+            counter: currentPageNumber,
+        };
+    }
+
+    protected getNextPageCounter(): number {
+        return Math.max(0, ...Array.from(this.pages.values(), page => page.counter)) + 1;
+    }
+
+    deleteTerminalPage(pageId: TerminalManagerTreeTypes.PageId): void {
+        const pageNode = this.getNode(pageId);
+        if (TerminalManagerTreeTypes.isPageNode(pageNode) && CompositeTreeNode.is(this.root)) {
+            while (pageNode.children.length > 0) {
+                const groupNode = pageNode.children[pageNode.children.length - 1];
+                this.doDeleteTerminalGroup(groupNode, pageNode);
+            }
+            this.onDidDeletePageEmitter.fire(pageNode.id);
+            CompositeTreeNode.removeChild(this.root, pageNode);
+            setTimeout(() => this.selectPrevNode());
+            this.refresh();
+        }
+    }
+
+    addTerminalGroup(
+        terminalKey: TerminalManagerTreeTypes.TerminalKey,
+        groupId: TerminalManagerTreeTypes.GroupId,
+        pageId: TerminalManagerTreeTypes.PageId,
+    ): void {
+        const groupNode = this.createGroupNode(groupId, pageId);
+        const terminalNode = this.createTerminalNode(terminalKey, groupId);
+        const pageNode = this.getNode(pageId);
+        if (this.root && CompositeTreeNode.is(this.root) && TerminalManagerTreeTypes.isPageNode(pageNode)) {
+            this.onDidAddTerminalGroupEmitter.fire({ groupId: groupNode.id, pageId, terminalKey });
+            CompositeTreeNode.addChild(groupNode, terminalNode);
+            CompositeTreeNode.addChild(pageNode, groupNode);
+            this.refresh();
+            setTimeout(() => {
+                this.selectionService.addSelection(terminalNode);
+            });
+        }
+    }
+
+    protected createGroupNode(
+        groupId: TerminalManagerTreeTypes.GroupId,
+        pageId: TerminalManagerTreeTypes.PageId,
+    ): TerminalManagerTreeTypes.TerminalGroupNode {
+        const currentGroupNum = this.getNextGroupCounterForPage(pageId);
+        return {
+            id: groupId,
+            label: `Group(${currentGroupNum})`,
+            parent: undefined,
+            selected: false,
+            children: [],
+            terminalGroup: true,
+            isEditing: false,
+            parentPageId: pageId,
+            expanded: true,
+            counter: currentGroupNum,
+        };
+    }
+
+    protected getNextGroupCounterForPage(pageId: TerminalManagerTreeTypes.PageId): number {
+        const page = this.pages.get(pageId);
+        if (page) {
+            return Math.max(0, ...page.children.map(group => group.counter)) + 1;
+        }
+        return 1;
+    }
+
+    deleteTerminalGroup(groupId: TerminalManagerTreeTypes.GroupId): void {
+        const groupNode = this.tree.getNode(groupId);
+        const parentPageNode = groupNode?.parent;
+        if (TerminalManagerTreeTypes.isGroupNode(groupNode) && TerminalManagerTreeTypes.isPageNode(parentPageNode)) {
+            if (parentPageNode.children.length === 1) {
+                this.deleteTerminalPage(parentPageNode.id);
+            } else {
+                this.doDeleteTerminalGroup(groupNode, parentPageNode);
+                this.refresh();
+            }
+        }
+    }
+
+    protected doDeleteTerminalGroup(group: TerminalManagerTreeTypes.TerminalGroupNode, page: TerminalManagerTreeTypes.PageNode): void {
+        while (group.children.length > 0) {
+            const terminalNode = group.children[group.children.length - 1];
+            this.doDeleteTerminalNode(terminalNode, group);
+        }
+        this.onDidDeleteTerminalGroupEmitter.fire(group.id);
+        CompositeTreeNode.removeChild(page, group);
+    }
+
+    addTerminal(newTerminalId: TerminalManagerTreeTypes.TerminalKey, groupId: TerminalManagerTreeTypes.GroupId): void {
+        const groupNode = this.getNode(groupId);
+        if (groupNode && TerminalManagerTreeTypes.isGroupNode(groupNode)) {
+            const terminalNode = this.createTerminalNode(newTerminalId, groupId);
+            CompositeTreeNode.addChild(groupNode, terminalNode);
+            this.onDidAddTerminalToGroupEmitter.fire({ terminalId: newTerminalId, groupId });
+            this.refresh();
+            setTimeout(() => {
+                if (SelectableTreeNode.is(terminalNode)) {
+                    this.selectionService.addSelection(terminalNode);
+                }
+            });
+        }
+    }
+
+    createTerminalNode(
+        terminalId: TerminalManagerTreeTypes.TerminalKey,
+        groupId: TerminalManagerTreeTypes.GroupId,
+    ): TerminalManagerTreeTypes.TerminalNode {
+        return {
+            id: terminalId,
+            label: 'Terminal',
+            parent: undefined,
+            children: [],
+            selected: false,
+            terminal: true,
+            isEditing: false,
+            parentGroupId: groupId,
+        };
+    }
+
+    deleteTerminalNode(terminalId: TerminalManagerTreeTypes.TerminalKey): void {
+        const terminalNode = this.getNode(terminalId);
+        const parentGroupNode = terminalNode?.parent;
+        if (TerminalManagerTreeTypes.isTerminalNode(terminalNode) && TerminalManagerTreeTypes.isGroupNode(parentGroupNode)) {
+            if (parentGroupNode.children.length === 1) {
+                this.deleteTerminalGroup(parentGroupNode.id);
+            } else {
+                this.doDeleteTerminalNode(terminalNode, parentGroupNode);
+                this.refresh();
+            }
+        }
+    }
+
+    protected doDeleteTerminalNode(node: TerminalManagerTreeTypes.TerminalNode, parent: TerminalManagerTreeTypes.TerminalGroupNode): void {
+        if (TerminalManagerTreeTypes.isGroupNode(parent)) {
+            this.onDidDeleteTerminalFromGroupEmitter.fire({
+                terminalId: node.id,
+                groupId: parent.id,
+            });
+            CompositeTreeNode.removeChild(parent, node);
+        }
+    }
+
+    toggleRenameTerminal(entityId: TerminalManagerTreeTypes.TerminalManagerValidId): void {
+        const node = this.getNode(entityId);
+        if (TerminalManagerTreeTypes.isTerminalManagerTreeNode(node)) {
+            node.isEditing = true;
+            this.fireChanged();
+        }
+    }
+
+    acceptRename(nodeId: string, newName: string): void {
+        const node = this.getNode(nodeId);
+        if (TerminalManagerTreeTypes.isTerminalManagerTreeNode(node)) {
+            const trimmedName = newName.trim();
+            node.label = trimmedName === '' ? node.label : newName;
+            node.isEditing = false;
+            this.fireChanged();
+            this.onDidRenameNodeEmitter.fire(node);
+        }
+    }
+
+    handleSelectionChanged(selectedNode: SelectableTreeNode): void {
+        let activeTerminal: TerminalManagerTreeTypes.TerminalNode | undefined = undefined;
+        let activeGroup: TerminalManagerTreeTypes.TerminalGroupNode | undefined = undefined;
+        let activePage: TerminalManagerTreeTypes.PageNode | undefined = undefined;
+
+        if (TerminalManagerTreeTypes.isTerminalNode(selectedNode)) {
+            activeTerminal = selectedNode;
+            const { parent } = activeTerminal;
+            if (TerminalManagerTreeTypes.isGroupNode(parent)) {
+                activeGroup = parent;
+                const grandparent = activeGroup.parent;
+                if (TerminalManagerTreeTypes.isPageNode(grandparent)) {
+                    activePage = grandparent;
+                }
+            } else if (TerminalManagerTreeTypes.isPageNode(parent)) {
+                activePage = parent;
+            }
+        } else if (TerminalManagerTreeTypes.isGroupNode(selectedNode)) {
+            const { parent } = selectedNode;
+            activeGroup = selectedNode;
+            if (TerminalManagerTreeTypes.isPageNode(parent)) {
+                activePage = parent;
+            }
+        } else if (TerminalManagerTreeTypes.isPageNode(selectedNode)) {
+            activePage = selectedNode;
+        }
+
+        this.activeTerminalNode = activeTerminal;
+        this.activeGroupNode = activeGroup;
+        this.activePageNode = activePage;
+        this.onDidChangeTreeSelectionEmitter.fire({
+            activePageId: activePage?.id,
+            activeTerminalId: activeTerminal?.id,
+            activeGroupId: activeGroup?.id,
+        });
+    }
+
+    get pages(): Map<TerminalManagerTreeTypes.PageId, TerminalManagerTreeTypes.PageNode> {
+        const pages = new Map<TerminalManagerTreeTypes.PageId, TerminalManagerTreeTypes.PageNode>();
+        if (!this.root) {
+            return pages;
+        }
+        for (const node of new DepthFirstTreeIterator(this.root)) {
+            if (TerminalManagerTreeTypes.isPageNode(node)) {
+                pages.set(node.id, node);
+            }
+        }
+        return pages;
+    }
+
+    getPageIdForTerminal(terminalKey: TerminalManagerTreeTypes.TerminalKey): TerminalManagerTreeTypes.PageId | undefined {
+        const terminalNode = this.getNode(terminalKey);
+        if (!TerminalManagerTreeTypes.isTerminalNode(terminalNode)) {
+            return undefined;
+        }
+        const { parentGroupId } = terminalNode;
+        const groupNode = this.getNode(parentGroupId);
+        if (!TerminalManagerTreeTypes.isGroupNode(groupNode)) {
+            return undefined;
+        }
+        return groupNode.parentPageId;
+    }
+
+    selectTerminalNode(terminalKey: TerminalManagerTreeTypes.TerminalKey): void {
+        const node = this.getNode(terminalKey);
+        if (node && TerminalManagerTreeTypes.isTerminalNode(node)) {
+            this.selectNode(node);
+        }
+    }
+}

package/src/browser/terminal-manager-tree-widget.tsx

@@ -0,0 +1,305 @@
+// *****************************************************************************
+// Copyright (C) 2023 Ericsson and others.
+//
+// This program and the accompanying materials are made available under the
+// terms of the Eclipse Public License v. 2.0 which is available at
+// http://www.eclipse.org/legal/epl-2.0.
+//
+// This Source Code may also be made available under the following Secondary
+// Licenses when the conditions for such availability set forth in the Eclipse
+// Public License v. 2.0 are satisfied: GNU General Public License, version 2
+// with the GNU Classpath Exception which is available at
+// https://www.gnu.org/software/classpath/license.html.
+//
+// SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
+// *****************************************************************************
+
+import * as React from '@theia/core/shared/react';
+import { Container, inject, injectable, interfaces, postConstruct } from '@theia/core/shared/inversify';
+import {
+    codicon,
+    CompositeTreeNode,
+    createTreeContainer,
+    Key,
+    Message,
+    NodeProps,
+    SelectableTreeNode,
+    TreeModel,
+    TreeNode,
+    TreeWidget,
+    TREE_NODE_INDENT_GUIDE_CLASS,
+} from '@theia/core/lib/browser';
+import { CommandRegistry, CompoundMenuNode, Emitter, MenuAction, MenuModelRegistry } from '@theia/core';
+import { TerminalManagerTreeModel } from './terminal-manager-tree-model';
+import { ReactInteraction, TerminalManagerTreeTypes, TERMINAL_MANAGER_TREE_CONTEXT_MENU } from './terminal-manager-types';
+
+/* eslint-disable no-param-reassign */
+@injectable()
+export class TerminalManagerTreeWidget extends TreeWidget {
+    static ID = 'terminal-manager-tree-widget';
+
+    protected onDidChangeEmitter = new Emitter();
+    readonly onDidChange = this.onDidChangeEmitter.event;
+
+    @inject(MenuModelRegistry) protected menuRegistry: MenuModelRegistry;
+    @inject(TreeModel) override readonly model: TerminalManagerTreeModel;
+    @inject(CommandRegistry) protected commandRegistry: CommandRegistry;
+
+    static createContainer(parent: interfaces.Container): Container {
+        const child = createTreeContainer(
+            parent,
+            {
+                props: {
+                    leftPadding: 8,
+                    contextMenuPath: TERMINAL_MANAGER_TREE_CONTEXT_MENU,
+                    expandOnlyOnExpansionToggleClick: true,
+                },
+            },
+        );
+        child.bind(TerminalManagerTreeModel).toSelf().inSingletonScope();
+        child.rebind(TreeModel).to(TerminalManagerTreeModel);
+        child.bind(TerminalManagerTreeWidget).toSelf().inSingletonScope();
+        return child;
+    }
+
+    static createWidget(parent: interfaces.Container): TerminalManagerTreeWidget {
+        return TerminalManagerTreeWidget.createContainer(parent).get(TerminalManagerTreeWidget);
+    }
+
+    @postConstruct()
+    protected override init(): void {
+        super.init();
+        this.id = 'terminal-manager-tree-widget';
+        this.addClass(TerminalManagerTreeWidget.ID);
+        this.toDispose.push(this.onDidChangeEmitter);
+    }
+
+    protected override toContextMenuArgs(node: SelectableTreeNode): TerminalManagerTreeTypes.ContextMenuArgs | undefined {
+        if (
+            TerminalManagerTreeTypes.isPageNode(node)
+            || TerminalManagerTreeTypes.isTerminalNode(node)
+            || TerminalManagerTreeTypes.isGroupNode(node)
+        ) {
+            return TerminalManagerTreeTypes.toContextMenuArgs(this, node);
+        }
+        return undefined;
+    }
+
+    protected override renderCaption(node: TreeNode, props: NodeProps): React.ReactNode {
+        if (TerminalManagerTreeTypes.isTerminalManagerTreeNode(node) && !!node.isEditing) {
+            const label = this.toNodeName(node);
+            // eslint-disable-next-line @typescript-eslint/ban-types
+            const assignRef = (element: HTMLInputElement | null) => {
+                if (element) {
+                    element.selectionStart = 0;
+                    element.selectionEnd = label.length;
+                }
+            };
+            return (
+                <input
+                    spellCheck={false}
+                    type='text'
+                    className='theia-input rename-node-input'
+                    defaultValue={label}
+                    onBlur={this.handleRenameOnBlur}
+                    data-id={node.id}
+                    onKeyDown={this.handleRenameOnKeyDown}
+                    autoFocus={true}
+                    ref={assignRef}
+                />
+            );
+        }
+        return super.renderCaption(node, props);
+    }
+
+    protected handleRenameOnBlur = (e: React.FocusEvent<HTMLInputElement>): void => this.doHandleRenameOnBlur(e);
+    protected doHandleRenameOnBlur(e: React.FocusEvent<HTMLInputElement>): void {
+        const { value } = e.currentTarget;
+        const id = e.currentTarget.getAttribute('data-id');
+        if (id) {
+            this.model.acceptRename(id, value);
+        }
+    }
+
+    protected override renderExpansionToggle(node: TreeNode, props: NodeProps): React.ReactNode {
+        return super.renderExpansionToggle(node, props);
+    }
+
+    protected handleRenameOnKeyDown = (e: React.KeyboardEvent<HTMLInputElement>): void => this.doHandleRenameOnKeyDown(e);
+    protected doHandleRenameOnKeyDown(e: React.KeyboardEvent<HTMLInputElement>): void {
+        const { value, defaultValue } = e.currentTarget;
+        const id = e.currentTarget.getAttribute('data-id');
+        e.stopPropagation();
+        if (e.key === 'Escape') {
+            e.preventDefault();
+            if (value && id) {
+                this.model.acceptRename(id, defaultValue);
+            }
+        } else if (e.key === 'Tab' || e.key === 'Enter') {
+            e.preventDefault();
+            if (value && id) {
+                this.model.acceptRename(id, value.trim());
+            }
+        }
+    }
+
+    // @ts-expect-error 2416 cf. https://github.com/eclipse-theia/theia/issues/11640
+    protected override handleLeft(event: KeyboardEvent): boolean | Promise<void> {
+        if ((event.target as HTMLElement).tagName === 'INPUT') { return false; };
+        return super.handleLeft(event);
+    }
+
+    // @ts-expect-error 2416 cf. https://github.com/eclipse-theia/theia/issues/11640
+    protected override handleRight(event: KeyboardEvent): boolean | Promise<void> {
+        if ((event.target as HTMLElement).tagName === 'INPUT') { return false; };
+        return super.handleRight(event);
+    }
+
+    // cf. https://github.com/eclipse-theia/theia/issues/11640
+    protected override handleEscape(event: KeyboardEvent): boolean | void {
+        if ((event.target as HTMLElement).tagName === 'INPUT') { return false; };
+        return super.handleEscape(event);
+    }
+
+    // cf. https://github.com/eclipse-theia/theia/issues/11640
+    protected override handleEnter(event: KeyboardEvent): boolean | void {
+        if ((event.target as HTMLElement).tagName === 'INPUT') { return false; };
+        return super.handleEnter(event);
+    }
+
+    // cf. https://github.com/eclipse-theia/theia/issues/11640
+    protected override handleSpace(event: KeyboardEvent): boolean | void {
+        if ((event.target as HTMLElement).tagName === 'INPUT') { return false; };
+        return super.handleSpace(event);
+    }
+
+    protected override renderTailDecorations(node: TreeNode, _props: NodeProps): React.ReactNode {
+        if (TerminalManagerTreeTypes.isTerminalManagerTreeNode(node)) {
+            const inlineActionsForNode = this.resolveInlineActionForNode(node);
+            return (
+                <div className='terminal-manager-inline-actions-container'>
+                    <div className='terminal-manager-inline-actions'>
+                        {inlineActionsForNode.map(({ icon, commandId, label }) => (
+                            <span
+                                key={commandId}
+                                data-command-id={commandId}
+                                data-node-id={node.id}
+                                className={icon}
+                                onClick={this.handleActionItemOnClick}
+                                onKeyDown={this.handleActionItemOnClick}
+                                role='button'
+                                tabIndex={0}
+                                title={label}
+                            />
+                        ))}
+                    </div>
+                </div>
+            );
+        }
+        return undefined;
+    }
+
+    protected handleActionItemOnClick = (e: ReactInteraction<HTMLSpanElement>): void => this.doHandleActionItemOnClick(e);
+    protected doHandleActionItemOnClick(e: ReactInteraction<HTMLSpanElement>): void {
+        if ('key' in e && e.key !== Key.ENTER.code) {
+            return;
+        }
+        e.stopPropagation();
+        const commandId = e.currentTarget.getAttribute('data-command-id');
+        const nodeId = e.currentTarget.getAttribute('data-node-id');
+        if (commandId && nodeId) {
+            const node = this.model.getNode(nodeId);
+            if (TerminalManagerTreeTypes.isTerminalManagerTreeNode(node)) {
+                const args = TerminalManagerTreeTypes.toContextMenuArgs(this, node);
+                this.commandRegistry.executeCommand(commandId, ...args);
+            }
+        }
+    }
+
+    protected resolveInlineActionForNode(node: TerminalManagerTreeTypes.TerminalManagerTreeNode): MenuAction[] {
+        let menuNode: CompoundMenuNode | undefined = undefined;
+        const inlineActionProps: MenuAction[] = [];
+        if (TerminalManagerTreeTypes.isPageNode(node)) {
+            menuNode = this.menuRegistry.getMenu(TerminalManagerTreeTypes.PAGE_NODE_MENU);
+        } else if (TerminalManagerTreeTypes.isGroupNode(node)) {
+            menuNode = this.menuRegistry.getMenu(TerminalManagerTreeTypes.GROUP_NODE_MENU);
+        } else if (TerminalManagerTreeTypes.isTerminalNode(node)) {
+            menuNode = this.menuRegistry.getMenu(TerminalManagerTreeTypes.TERMINAL_NODE_MENU);
+        }
+        if (!menuNode) {
+            return [];
+        }
+        const menuItems = menuNode.children;
+        menuItems.forEach(item => {
+            const commandId = item.id;
+            const args = TerminalManagerTreeTypes.toContextMenuArgs(this, node);
+            const isVisible = this.commandRegistry.isVisible(commandId, ...args);
+            if (isVisible) {
+                const command = this.commandRegistry.getCommand(commandId);
+                const icon = command?.iconClass ? command.iconClass : '';
+                const label = command?.label ? command.label : '';
+                inlineActionProps.push({ icon, label, commandId });
+            }
+        });
+        return inlineActionProps;
+    }
+
+    protected override renderIcon(node: TreeNode, _props: NodeProps): React.ReactNode {
+        if (TerminalManagerTreeTypes.isTerminalNode(node)) {
+            return <span className={`${codicon('terminal')}`} />;
+        } else if (TerminalManagerTreeTypes.isPageNode(node)) {
+            return <span className={`${codicon('terminal-tmux')}`} />;
+        } else if (TerminalManagerTreeTypes.isGroupNode(node)) {
+            return <span className={`${codicon('split-horizontal')}`} />;
+        }
+        return undefined;
+    }
+
+    protected override toNodeName(node: TerminalManagerTreeTypes.TerminalManagerTreeNode): string {
+        return node.label ?? 'node.id';
+    }
+
+    protected override onUpdateRequest(msg: Message): void {
+        super.onUpdateRequest(msg);
+        this.onDidChangeEmitter.fire(undefined);
+    }
+
+    protected override renderIndent(node: TreeNode, props: NodeProps): React.ReactNode {
+        const renderIndentGuides = this.corePreferences['workbench.tree.renderIndentGuides'];
+        if (renderIndentGuides === 'none') {
+            return undefined;
+        }
+
+        const indentDivs: React.ReactNode[] = [];
+        let current: TreeNode | undefined = node;
+        let { depth } = props;
+        while (current && depth) {
+            const classNames: string[] = [TREE_NODE_INDENT_GUIDE_CLASS];
+            if (this.needsActiveIndentGuideline(current)) {
+                classNames.push('active');
+            } else {
+                classNames.push(renderIndentGuides === 'onHover' ? 'hover' : 'always');
+            }
+            const paddingLeft = this.props.leftPadding * depth;
+            indentDivs.unshift(<div
+                key={depth}
+                className={classNames.join(' ')}
+                style={{
+                    paddingLeft: `${paddingLeft}px`,
+                }}
+            />);
+            current = current.parent;
+            depth -= 1;
+        }
+        return indentDivs;
+    }
+
+    protected override getDepthForNode(node: TreeNode, depths: Map<CompositeTreeNode | undefined, number>): number {
+        const parentDepth = depths.get(node.parent);
+        if (TerminalManagerTreeTypes.isTerminalNode(node) && parentDepth === undefined) {
+            return 1;
+        }
+        return super.getDepthForNode(node, depths);
+    }
+}
+