From b140142f6ade7490265110ae0dc766902c0b5aac Mon Sep 17 00:00:00 2001
From: Cristina Amico <criamico@users.noreply.github.com>
Date: Mon, 6 May 2024 12:19:13 +0200
Subject: [PATCH] [Fleet] Fix cloudflare template error (#182645)

## Summary

Cloudflare 8.24 doesn't install properly and the config tab also fails
with the same error. This PR fixes this error and also fixes a small UI
issue with max width not sets in configs tab.

The integration defines two possible options for auth (auth key or
token) but only one should be used. When both are set the [compile
template](https://github.com/elastic/kibana/blob/be3f66fd45db4001b9437281a2cb075e817fa25f/x-pack/plugins/fleet/server/services/epm/agent/agent.ts#L27)
fails with an error

## Before
![Screenshot 2024-05-03 at 16 16
35](https://github.com/elastic/kibana/assets/16084106/cb90e72a-7cef-46eb-8542-324cce45ac37)
![Screenshot 2024-05-03 at 16 20
01](https://github.com/elastic/kibana/assets/16084106/4ffacea4-ffa7-4a1a-bf81-24213fee48f3)

## After
![Screenshot 2024-05-06 at 10 58
57](https://github.com/elastic/kibana/assets/16084106/36ca8bea-87d7-4d01-8fda-50190feb9fbb)

(cherry picked from commit 1a3ff70c5e7ebdc308fe5022acee178a43302dc5)
---
 .../sections/epm/screens/detail/configs/index.tsx        | 9 +++++++--
 x-pack/plugins/fleet/server/services/epm/agent/agent.ts  | 1 +
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/x-pack/plugins/fleet/public/applications/integrations/sections/epm/screens/detail/configs/index.tsx b/x-pack/plugins/fleet/public/applications/integrations/sections/epm/screens/detail/configs/index.tsx
index 034bb842f1f6f..e42957995514c 100644
--- a/x-pack/plugins/fleet/public/applications/integrations/sections/epm/screens/detail/configs/index.tsx
+++ b/x-pack/plugins/fleet/public/applications/integrations/sections/epm/screens/detail/configs/index.tsx
@@ -5,6 +5,7 @@
  * 2.0.
  */
 import React from 'react';
+import styled from 'styled-components';
 import {
   EuiFlexGroup,
   EuiFlexItem,
@@ -27,6 +28,10 @@ import { PrereleaseCallout } from '../overview/overview';
 
 import { isPackagePrerelease } from '../../../../../../../../common/services';
 
+const FlexItemWithMaxWidth = styled(EuiFlexItem)`
+  max-width: 1000px;
+`;
+
 interface ConfigsProps {
   packageInfo: PackageInfo;
 }
@@ -57,7 +62,7 @@ export const Configs: React.FC<ConfigsProps> = ({ packageInfo }) => {
   return (
     <EuiFlexGroup data-test-subj="epm.Configs" alignItems="flexStart">
       <EuiFlexItem grow={1} />
-      <EuiFlexItem grow={6}>
+      <FlexItemWithMaxWidth grow={6}>
         {isLoading && !configs ? (
           <EuiSkeletonText lines={10} />
         ) : (
@@ -117,7 +122,7 @@ export const Configs: React.FC<ConfigsProps> = ({ packageInfo }) => {
             </EuiCodeBlock>
           </>
         )}
-      </EuiFlexItem>
+      </FlexItemWithMaxWidth>
     </EuiFlexGroup>
   );
 };
diff --git a/x-pack/plugins/fleet/server/services/epm/agent/agent.ts b/x-pack/plugins/fleet/server/services/epm/agent/agent.ts
index abe2153bb800f..9a26394cd1cb1 100644
--- a/x-pack/plugins/fleet/server/services/epm/agent/agent.ts
+++ b/x-pack/plugins/fleet/server/services/epm/agent/agent.ts
@@ -126,6 +126,7 @@ handlebars.registerHelper('contains', containsHelper);
 // and to respect any incoming newline we also need to double them, otherwise
 // they will be replaced with a space.
 function escapeStringHelper(str: string) {
+  if (!str) return undefined;
   return "'" + str.replace(/\'/g, "''").replace(/\n/g, '\n\n') + "'";
 }
 handlebars.registerHelper('escape_string', escapeStringHelper);