[Init] Initial commit - NetMesh terminal manager

components/top-tabs/SessionTabContextMenuContent.test.ts

@@ -0,0 +1,28 @@
+import assert from 'node:assert/strict';
+import { readFileSync } from 'node:fs';
+import test from 'node:test';
+import { fileURLToPath } from 'node:url';
+
+import { isSessionReconnectDisabled } from './SessionTabContextMenuContent';
+
+const source = readFileSync(fileURLToPath(new URL('./SessionTabContextMenuContent.tsx', import.meta.url)), 'utf8');
+
+test('reconnect is disabled while a session is still connecting', () => {
+  assert.equal(isSessionReconnectDisabled('connecting'), true);
+  assert.equal(isSessionReconnectDisabled('connected'), false);
+  assert.equal(isSessionReconnectDisabled('disconnected'), false);
+  assert.equal(isSessionReconnectDisabled('disconnected', true), true);
+});
+
+test('session tab menu exposes optional edit-host when a vault host is present', () => {
+  assert.match(source, /editHost\?: Host/);
+  assert.match(source, /onEditHost\?: \(host: Host\) => void/);
+  assert.match(source, /editHost && onEditHost/);
+  assert.match(source, /terminal\.layer\.hostTree\.editHost/);
+});
+
+test('session tab menu offers duplicate-session alongside copy-tab', () => {
+  assert.match(source, /onDuplicateSession\?: \(sessionId: string\) => void/);
+  assert.match(source, /onDuplicateSession &&/);
+  assert.match(source, /tabs\.duplicateSession/);
+});

components/top-tabs/SessionTabContextMenuContent.tsx

@@ -0,0 +1,93 @@
+import React from 'react';
+
+import type { useI18n } from '../../application/i18n/I18nProvider';
+import type { Host, TerminalSession } from '../../types';
+import { ContextMenuContent, ContextMenuItem } from '../ui/context-menu';
+
+type TranslateFn = ReturnType<typeof useI18n>['t'];
+
+interface SessionTabContextMenuContentProps {
+  sessionId: string;
+  onCloseSession: (sessionId: string) => void;
+  onCopySession?: (sessionId: string) => void;
+  /** Duplicate the session with a brand-new connection (fresh auth, e.g. a new bastion login). */
+  onDuplicateSession?: (sessionId: string) => void;
+  onCopySessionToNewWindow?: (sessionId: string) => void;
+  onDetachSession?: (sessionId: string) => void;
+  onReconnectSession: (sessionId: string) => void;
+  sessionStatus: TerminalSession['status'];
+  reconnectActive?: boolean;
+  onRenameSession: (sessionId: string) => void;
+  /** Vault host for this session; omit edit when missing (e.g. local shell). */
+  editHost?: Host;
+  onEditHost?: (host: Host) => void;
+  renderBulkCloseItems?: (anchorId: string) => React.ReactNode;
+  t: TranslateFn;
+}
+
+export function SessionTabContextMenuContent({
+  sessionId,
+  onCloseSession,
+  onCopySession,
+  onDuplicateSession,
+  onCopySessionToNewWindow,
+  onDetachSession,
+  onReconnectSession,
+  sessionStatus,
+  reconnectActive = false,
+  onRenameSession,
+  editHost,
+  onEditHost,
+  renderBulkCloseItems,
+  t,
+}: SessionTabContextMenuContentProps) {
+  return (
+    <ContextMenuContent>
+      <ContextMenuItem
+        disabled={isSessionReconnectDisabled(sessionStatus, reconnectActive)}
+        onClick={() => onReconnectSession(sessionId)}
+      >
+        {t('terminal.menu.reconnect')}
+      </ContextMenuItem>
+      <ContextMenuItem onClick={() => onRenameSession(sessionId)}>
+        {t('common.rename')}
+      </ContextMenuItem>
+      {editHost && onEditHost && (
+        <ContextMenuItem onClick={() => onEditHost(editHost)}>
+          {t('terminal.layer.hostTree.editHost')}
+        </ContextMenuItem>
+      )}
+      {onCopySession && (
+        <ContextMenuItem onClick={() => onCopySession(sessionId)}>
+          {t('tabs.copyTab')}
+        </ContextMenuItem>
+      )}
+      {onDuplicateSession && (
+        <ContextMenuItem onClick={() => onDuplicateSession(sessionId)}>
+          {t('tabs.duplicateSession')}
+        </ContextMenuItem>
+      )}
+      {onCopySessionToNewWindow && (
+        <ContextMenuItem onClick={() => onCopySessionToNewWindow(sessionId)}>
+          {t('tabs.copyTabToNewWindow')}
+        </ContextMenuItem>
+      )}
+      {onDetachSession && (
+        <ContextMenuItem onClick={() => onDetachSession(sessionId)}>
+          {t('terminal.menu.detach')}
+        </ContextMenuItem>
+      )}
+      <ContextMenuItem className="text-destructive" onClick={() => onCloseSession(sessionId)}>
+        {t('common.close')}
+      </ContextMenuItem>
+      {renderBulkCloseItems?.(sessionId)}
+    </ContextMenuContent>
+  );
+}
+
+export const isSessionReconnectDisabled = (
+  status: TerminalSession['status'],
+  reconnectActive = false,
+): boolean => (
+  status === 'connecting' || reconnectActive
+);

components/top-tabs/useTopTabLifecycleAnimations.ts

@@ -0,0 +1,30 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+
+export const TAB_ENTER_ANIMATION_MS = 220;
+
+export function useTopTabLifecycleAnimations(orderedTabs: string[]) {
+  const prevTabIdsRef = useRef<Set<string>>(new Set());
+  const [enteringTabIds, setEnteringTabIds] = useState<ReadonlySet<string>>(() => new Set());
+
+  useEffect(() => {
+    const current = new Set(orderedTabs);
+    const prev = prevTabIdsRef.current;
+    const added = orderedTabs.filter((tabId) => !prev.has(tabId));
+    prevTabIdsRef.current = current;
+
+    if (added.length === 0) return;
+
+    setEnteringTabIds(new Set(added));
+    const timer = window.setTimeout(() => {
+      setEnteringTabIds(new Set());
+    }, TAB_ENTER_ANIMATION_MS);
+    return () => window.clearTimeout(timer);
+  }, [orderedTabs]);
+
+  const getTabAnimationClass = useCallback((tabId: string) => {
+    if (enteringTabIds.has(tabId)) return 'top-tab-enter';
+    return undefined;
+  }, [enteringTabIds]);
+
+  return { getTabAnimationClass };
+};