From 156fb3d33c83bb7c455e0cbfa0ada5217612fa1b Mon Sep 17 00:00:00 2001
From: Nicolas Chaulet <n.chaulet@gmail.com>
Date: Wed, 13 Jan 2021 07:30:21 -0400
Subject: [PATCH] [Fleet] Only display logs UI for agent >= 7.11 (#87926)

---
 .../components/agent_logs/agent_logs.tsx      | 37 ++++++++++++++++---
 1 file changed, 31 insertions(+), 6 deletions(-)

diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_details_page/components/agent_logs/agent_logs.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_details_page/components/agent_logs/agent_logs.tsx
index 95c630e3b368..7326d2efb856 100644
--- a/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_details_page/components/agent_logs/agent_logs.tsx
+++ b/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_details_page/components/agent_logs/agent_logs.tsx
@@ -15,6 +15,8 @@ import {
   EuiFilterGroup,
   EuiPanel,
   EuiButtonEmpty,
+  EuiCallOut,
+  EuiLink,
 } from '@elastic/eui';
 import useMeasure from 'react-use/lib/useMeasure';
 import { FormattedMessage } from '@kbn/i18n/react';
@@ -184,7 +186,7 @@ export const AgentLogsUI: React.FunctionComponent<AgentLogsProps> = memo(({ agen
   const [logsPanelRef, { height: logPanelHeight }] = useMeasure();
 
   const agentVersion = agent.local_metadata?.elastic?.agent?.version;
-  const isLogLevelSelectionAvailable = useMemo(() => {
+  const isLogFeatureAvailable = useMemo(() => {
     if (!agentVersion) {
       return false;
     }
@@ -195,6 +197,31 @@ export const AgentLogsUI: React.FunctionComponent<AgentLogsProps> = memo(({ agen
     return semverGte(agentVersionWithPrerelease, '7.11.0');
   }, [agentVersion]);
 
+  if (!isLogFeatureAvailable) {
+    return (
+      <EuiCallOut
+        size="m"
+        color="warning"
+        title={
+          <FormattedMessage
+            id="xpack.fleet.agentLogs.oldAgentWarningTitle"
+            defaultMessage="The Logs view requires Elastic Agent 7.11 or higher. To upgrade an agent, go to the Actions menu, or {downloadLink} a newer version."
+            values={{
+              downloadLink: (
+                <EuiLink href="https://ela.st/download-elastic-agent" external target="_blank">
+                  <FormattedMessage
+                    id="xpack.fleet.agentLogs.downloadLink"
+                    defaultMessage="download"
+                  />
+                </EuiLink>
+              ),
+            }}
+          />
+        }
+      />
+    );
+  }
+
   return (
     <WrapperFlexGroup direction="column" gutterSize="m">
       <EuiFlexItem grow={false}>
@@ -271,11 +298,9 @@ export const AgentLogsUI: React.FunctionComponent<AgentLogsProps> = memo(({ agen
           />
         </EuiPanel>
       </EuiFlexItem>
-      {isLogLevelSelectionAvailable && (
-        <EuiFlexItem grow={false}>
-          <SelectLogLevel agent={agent} />
-        </EuiFlexItem>
-      )}
+      <EuiFlexItem grow={false}>
+        <SelectLogLevel agent={agent} />
+      </EuiFlexItem>
     </WrapperFlexGroup>
   );
 });