From a5d98408da8c5ed6c0c4f26bbc7bc434541333a9 Mon Sep 17 00:00:00 2001
From: Nicolas Chaulet <nicolas.chaulet@elastic.co>
Date: Tue, 21 Jul 2020 20:07:05 -0400
Subject: [PATCH] [Ingest Manager] Allow to force unenroll from the UI (#72386)
 (#72750)

---
 .../common/services/agent_status.ts           |  6 +--
 .../components/context_menu_actions.tsx       | 24 ++++++++---
 .../components/actions_menu.tsx               | 18 +++++---
 .../sections/fleet/agent_list_page/index.tsx  | 22 +++++++---
 .../components/agent_unenroll_provider.tsx    | 43 +++++++++++++------
 5 files changed, 82 insertions(+), 31 deletions(-)

diff --git a/x-pack/plugins/ingest_manager/common/services/agent_status.ts b/x-pack/plugins/ingest_manager/common/services/agent_status.ts
index 536003b0f743d..fe4e094e1bb22 100644
--- a/x-pack/plugins/ingest_manager/common/services/agent_status.ts
+++ b/x-pack/plugins/ingest_manager/common/services/agent_status.ts
@@ -13,12 +13,12 @@ export function getAgentStatus(agent: Agent, now: number = Date.now()): AgentSta
   if (!agent.active) {
     return 'inactive';
   }
-  if (!agent.last_checkin) {
-    return 'enrolling';
-  }
   if (agent.unenrollment_started_at && !agent.unenrolled_at) {
     return 'unenrolling';
   }
+  if (!agent.last_checkin) {
+    return 'enrolling';
+  }
 
   const msLastCheckIn = new Date(lastCheckIn || 0).getTime();
   const msSinceLastCheckIn = new Date().getTime() - msLastCheckIn;
diff --git a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/components/context_menu_actions.tsx b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/components/context_menu_actions.tsx
index 8a9f0553895a1..7d1f12447340f 100644
--- a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/components/context_menu_actions.tsx
+++ b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/components/context_menu_actions.tsx
@@ -22,6 +22,8 @@ type Props = {
     props: EuiButtonProps;
     children: JSX.Element;
   };
+  isOpen?: boolean;
+  onChange?: (isOpen: boolean) => void;
 } & (
   | {
       items: EuiContextMenuPanelProps['items'];
@@ -31,10 +33,22 @@ type Props = {
     }
 );
 
-export const ContextMenuActions = React.memo<Props>(({ button, ...props }) => {
-  const [isOpen, setIsOpen] = useState(false);
-  const handleCloseMenu = useCallback(() => setIsOpen(false), [setIsOpen]);
-  const handleToggleMenu = useCallback(() => setIsOpen(!isOpen), [isOpen]);
+export const ContextMenuActions = React.memo<Props>(({ button, onChange, isOpen, ...props }) => {
+  const [isOpenState, setIsOpenState] = useState(false);
+  const handleCloseMenu = useCallback(() => {
+    if (onChange) {
+      onChange(false);
+    } else {
+      setIsOpenState(false);
+    }
+  }, [setIsOpenState, onChange]);
+  const handleToggleMenu = useCallback(() => {
+    if (onChange) {
+      onChange(!isOpen);
+    } else {
+      setIsOpenState(!isOpenState);
+    }
+  }, [isOpenState, onChange, isOpen]);
 
   return (
     <EuiPopover
@@ -55,7 +69,7 @@ export const ContextMenuActions = React.memo<Props>(({ button, ...props }) => {
           />
         )
       }
-      isOpen={isOpen}
+      isOpen={isOpen === undefined ? isOpenState : isOpen}
       closePopover={handleCloseMenu}
     >
       {'items' in props ? (
diff --git a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/agent_details_page/components/actions_menu.tsx b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/agent_details_page/components/actions_menu.tsx
index 75a67fb9288e5..7afc57b30cef4 100644
--- a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/agent_details_page/components/actions_menu.tsx
+++ b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/agent_details_page/components/actions_menu.tsx
@@ -20,6 +20,7 @@ export const AgentDetailsActionMenu: React.FunctionComponent<{
   const hasWriteCapabilites = useCapabilities().write;
   const refreshAgent = useAgentRefresh();
   const [isReassignFlyoutOpen, setIsReassignFlyoutOpen] = useState(assignFlyoutOpenByDefault);
+  const isUnenrolling = agent.status === 'unenrolling';
 
   const onClose = useMemo(() => {
     if (onCancelReassign) {
@@ -59,7 +60,7 @@ export const AgentDetailsActionMenu: React.FunctionComponent<{
               defaultMessage="Assign new agent config"
             />
           </EuiContextMenuItem>,
-          <AgentUnenrollProvider key="unenrollAgent">
+          <AgentUnenrollProvider key="unenrollAgent" forceUnenroll={isUnenrolling}>
             {(unenrollAgentsPrompt) => (
               <EuiContextMenuItem
                 icon="cross"
@@ -68,10 +69,17 @@ export const AgentDetailsActionMenu: React.FunctionComponent<{
                   unenrollAgentsPrompt([agent.id], 1, refreshAgent);
                 }}
               >
-                <FormattedMessage
-                  id="xpack.ingestManager.agentList.unenrollOneButton"
-                  defaultMessage="Unenroll"
-                />
+                {isUnenrolling ? (
+                  <FormattedMessage
+                    id="xpack.ingestManager.agentList.forceUnenrollOneButton"
+                    defaultMessage="Force unenroll"
+                  />
+                ) : (
+                  <FormattedMessage
+                    id="xpack.ingestManager.agentList.unenrollOneButton"
+                    defaultMessage="Unenroll"
+                  />
+                )}
               </EuiContextMenuItem>
             )}
           </AgentUnenrollProvider>,
diff --git a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/agent_list_page/index.tsx b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/agent_list_page/index.tsx
index 034482c4cf9b5..3743f9b39191b 100644
--- a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/agent_list_page/index.tsx
+++ b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/agent_list_page/index.tsx
@@ -74,8 +74,12 @@ const RowActions = React.memo<{ agent: Agent; onReassignClick: () => void; refre
     const { getHref } = useLink();
     const hasWriteCapabilites = useCapabilities().write;
 
+    const isUnenrolling = agent.status === 'unenrolling';
+    const [isMenuOpen, setIsMenuOpen] = useState(false);
     return (
       <ContextMenuActions
+        isOpen={isMenuOpen}
+        onChange={(isOpen) => setIsMenuOpen(isOpen)}
         items={[
           <EuiContextMenuItem
             icon="inspect"
@@ -100,7 +104,7 @@ const RowActions = React.memo<{ agent: Agent; onReassignClick: () => void; refre
             />
           </EuiContextMenuItem>,
 
-          <AgentUnenrollProvider>
+          <AgentUnenrollProvider forceUnenroll={isUnenrolling}>
             {(unenrollAgentsPrompt) => (
               <EuiContextMenuItem
                 disabled={!hasWriteCapabilites}
@@ -108,13 +112,21 @@ const RowActions = React.memo<{ agent: Agent; onReassignClick: () => void; refre
                 onClick={() => {
                   unenrollAgentsPrompt([agent.id], 1, () => {
                     refresh();
+                    setIsMenuOpen(false);
                   });
                 }}
               >
-                <FormattedMessage
-                  id="xpack.ingestManager.agentList.unenrollOneButton"
-                  defaultMessage="Unenroll"
-                />
+                {isUnenrolling ? (
+                  <FormattedMessage
+                    id="xpack.ingestManager.agentList.forceUnenrollOneButton"
+                    defaultMessage="Force unenroll"
+                  />
+                ) : (
+                  <FormattedMessage
+                    id="xpack.ingestManager.agentList.unenrollOneButton"
+                    defaultMessage="Unenroll"
+                  />
+                )}
               </EuiContextMenuItem>
             )}
           </AgentUnenrollProvider>,
diff --git a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/components/agent_unenroll_provider.tsx b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/components/agent_unenroll_provider.tsx
index 90d8ff545341d..6f1cba70bbcee 100644
--- a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/components/agent_unenroll_provider.tsx
+++ b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/components/agent_unenroll_provider.tsx
@@ -14,6 +14,7 @@ import { agentRouteService } from '../../../services';
 
 interface Props {
   children: (unenrollAgents: UnenrollAgents) => React.ReactElement;
+  forceUnenroll?: boolean;
 }
 
 export type UnenrollAgents = (
@@ -24,7 +25,10 @@ export type UnenrollAgents = (
 
 type OnSuccessCallback = (agentsUnenrolled: string[]) => void;
 
-export const AgentUnenrollProvider: React.FunctionComponent<Props> = ({ children }) => {
+export const AgentUnenrollProvider: React.FunctionComponent<Props> = ({
+  children,
+  forceUnenroll = false,
+}) => {
   const core = useCore();
   const [agents, setAgents] = useState<string[] | string>([]);
   const [agentsCount, setAgentsCount] = useState<number>(0);
@@ -65,19 +69,24 @@ export const AgentUnenrollProvider: React.FunctionComponent<Props> = ({ children
       const { error } = await sendRequest<PostAgentUnenrollResponse>({
         path: agentRouteService.getUnenrollPath(agentId),
         method: 'post',
+        body: {
+          force: forceUnenroll,
+        },
       });
 
       if (error) {
         throw new Error(error.message);
       }
 
-      const successMessage = i18n.translate(
-        'xpack.ingestManager.unenrollAgents.successSingleNotificationTitle',
-        {
-          defaultMessage: "Unenrolling agent '{id}'",
-          values: { id: agentId },
-        }
-      );
+      const successMessage = forceUnenroll
+        ? i18n.translate('xpack.ingestManager.unenrollAgents.successForceSingleNotificationTitle', {
+            defaultMessage: "Agent '{id}' unenrolled",
+            values: { id: agentId },
+          })
+        : i18n.translate('xpack.ingestManager.unenrollAgents.successSingleNotificationTitle', {
+            defaultMessage: "Unenrolling agent '{id}'",
+            values: { id: agentId },
+          });
       core.notifications.toasts.addSuccess(successMessage);
 
       if (onSuccessCallback.current) {
@@ -107,11 +116,19 @@ export const AgentUnenrollProvider: React.FunctionComponent<Props> = ({ children
         <EuiConfirmModal
           title={
             isSingle && !unenrollByKuery ? (
-              <FormattedMessage
-                id="xpack.ingestManager.unenrollAgents.confirmModal.deleteSingleTitle"
-                defaultMessage="Unenroll agent '{id}'?"
-                values={{ id: agents[0] }}
-              />
+              forceUnenroll ? (
+                <FormattedMessage
+                  id="xpack.ingestManager.unenrollAgents.confirmModal.forceDeleteSingleTitle"
+                  defaultMessage="Force unenroll agent '{id}'?"
+                  values={{ id: agents[0] }}
+                />
+              ) : (
+                <FormattedMessage
+                  id="xpack.ingestManager.unenrollAgents.confirmModal.deleteSingleTitle"
+                  defaultMessage="Unenroll agent '{id}'?"
+                  values={{ id: agents[0] }}
+                />
+              )
             ) : (
               <FormattedMessage
                 id="xpack.ingestManager.unenrollAgents.confirmModal.deleteMultipleTitle"