From 9d449f25c6202fbf829a0ae13e3f9601e1676709 Mon Sep 17 00:00:00 2001
From: Alex Andreev <alex.andreev.email@gmail.com>
Date: Fri, 25 Dec 2020 15:12:20 +0300
Subject: [PATCH] Adding disable state to menu items

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
---
 .../dock/__test__/dock-tabs.test.tsx          | 32 ++++++++++++++++++-
 src/renderer/components/dock/dock-tab.tsx     | 11 ++++---
 2 files changed, 38 insertions(+), 5 deletions(-)

diff --git a/src/renderer/components/dock/__test__/dock-tabs.test.tsx b/src/renderer/components/dock/__test__/dock-tabs.test.tsx
index bcdf9de94e..c7da04c438 100644
--- a/src/renderer/components/dock/__test__/dock-tabs.test.tsx
+++ b/src/renderer/components/dock/__test__/dock-tabs.test.tsx
@@ -5,9 +5,10 @@ import { render, fireEvent } from "@testing-library/react";
 import "@testing-library/jest-dom/extend-expect";
 
 import { DockTabs } from "../dock-tabs";
-import { dockStore, TabKind } from "../dock.store";
+import { dockStore, IDockTab, TabKind } from "../dock.store";
 import { createResourceTab } from "../create-resource.store";
 import { createTerminalTab } from "../terminal.store";
+import { observable } from "mobx";
 
 const onChangeTab = jest.fn();
 const getComponent = () => (
@@ -126,4 +127,33 @@ describe("<DockTabs />", () => {
       TabKind.TERMINAL
     ]);
   });
+
+  it("disables 'Close All' & 'Close Other' items if only 1 tab available", () => {
+    dockStore.tabs = observable.array<IDockTab>([{
+      id: "terminal", kind: TabKind.TERMINAL, title: "Terminal"
+    }]);
+    const { container, getByText } = renderTabs();
+    const tab = container.querySelector(".Tab");
+
+    fireEvent.contextMenu(tab);
+    const closeAll = getByText("Close all tabs");
+    const closeOthers = getByText("Close other tabs");
+
+    expect(closeAll).toHaveClass("disabled");
+    expect(closeOthers).toHaveClass("disabled");
+  });
+
+  it("disables 'Close To The Right' item if last tab clicked", () => {
+    dockStore.tabs = observable.array<IDockTab>([
+      { id: "terminal", kind: TabKind.TERMINAL, title: "Terminal" },
+      { id: "logs", kind: TabKind.POD_LOGS, title: "Pod Logs" },
+    ]);
+    const { container, getByText } = renderTabs();
+    const tab = container.querySelectorAll(".Tab")[1];
+
+    fireEvent.contextMenu(tab);
+    const command = getByText("Close tabs to the right");
+
+    expect(command).toHaveClass("disabled");
+  });
 });
diff --git a/src/renderer/components/dock/dock-tab.tsx b/src/renderer/components/dock/dock-tab.tsx
index 6602e0e616..1c6db6c7c2 100644
--- a/src/renderer/components/dock/dock-tab.tsx
+++ b/src/renderer/components/dock/dock-tab.tsx
@@ -29,7 +29,10 @@ export class DockTab extends React.Component<DockTabProps> {
   }
 
   renderMenu() {
-    const { closeTab, closeAllTabs, closeOtherTabs, closeTabsToTheRight } = dockStore;
+    const { closeTab, closeAllTabs, closeOtherTabs, closeTabsToTheRight, tabs, getTabIndex } = dockStore;
+    const closeAllDisabled = tabs.length === 1;
+    const closeOtherDisabled = tabs.length === 1;
+    const closeRightDisabled = getTabIndex(this.tabId) === tabs.length - 1;
 
     return (
       <Menu
@@ -44,13 +47,13 @@ export class DockTab extends React.Component<DockTabProps> {
         <MenuItem onClick={() => closeTab(this.tabId)}>
           <Trans>Close</Trans>
         </MenuItem>
-        <MenuItem onClick={() => closeAllTabs()}>
+        <MenuItem onClick={() => closeAllTabs()} disabled={closeAllDisabled}>
           <Trans>Close all tabs</Trans>
         </MenuItem>
-        <MenuItem onClick={() => closeOtherTabs(this.tabId)}>
+        <MenuItem onClick={() => closeOtherTabs(this.tabId)} disabled={closeOtherDisabled}>
           <Trans>Close other tabs</Trans>
         </MenuItem>
-        <MenuItem onClick={() => closeTabsToTheRight(this.tabId)}>
+        <MenuItem onClick={() => closeTabsToTheRight(this.tabId)} disabled={closeRightDisabled}>
           <Trans>Close tabs to the right</Trans>
         </MenuItem>
       </Menu>