From 290aef5c25ce9297aa16e00a13c042f05e777b68 Mon Sep 17 00:00:00 2001
From: JuanGarriuz <juan.garcia@wazuh.com>
Date: Wed, 5 Jun 2024 13:00:30 +0200
Subject: [PATCH 01/12] Fix minor visuals bugs and duplicated code

---
 .../public/components/common/wazuh-discover/discover.scss | 4 +++-
 .../components/common/wazuh-discover/wz-discover.tsx      | 1 -
 plugins/main/public/styles/common.scss                    | 8 --------
 3 files changed, 3 insertions(+), 10 deletions(-)

diff --git a/plugins/main/public/components/common/wazuh-discover/discover.scss b/plugins/main/public/components/common/wazuh-discover/discover.scss
index 75347f3b07..c7fe605474 100644
--- a/plugins/main/public/components/common/wazuh-discover/discover.scss
+++ b/plugins/main/public/components/common/wazuh-discover/discover.scss
@@ -8,7 +8,9 @@
   }
 
   .discoverDataGrid {
-    height: calc(100vh - 458px);
+    .euiDataGrid__virtualized {
+      height: fit-content !important;
+    }
   }
 
   .discoverChartContainer {
diff --git a/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx b/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
index 9fc73e4748..9358102bf6 100644
--- a/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
+++ b/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
@@ -187,7 +187,6 @@ const WazuhDiscoverComponent = (props: WazuhDiscoverProps) => {
       <EuiPageTemplate
         className='discoverContainer'
         restrictWidth='100%'
-        fullHeight={true}
         grow
         paddingSize='none'
         pageContentProps={{ color: 'transparent' }}
diff --git a/plugins/main/public/styles/common.scss b/plugins/main/public/styles/common.scss
index a3ed6c0295..c2de869880 100644
--- a/plugins/main/public/styles/common.scss
+++ b/plugins/main/public/styles/common.scss
@@ -1818,14 +1818,6 @@ iframe.width-changed {
   z-index: 9999;
 }
 
-/* OSD Data grid full screen with dock navigation left sidebar */
-
-.dataGridDockedNav {
-  &.euiDataGrid--fullScreen {
-    left: 320px;
-  }
-}
-
 .wz-app {
   .euiPage {
     background-color: transparent;

From f9ec29e65d7851d6cbc8d23c48695407b221ed74 Mon Sep 17 00:00:00 2001
From: JuanGarriuz <juan.garcia@wazuh.com>
Date: Wed, 5 Jun 2024 17:21:31 +0200
Subject: [PATCH 02/12] Remove fit-content

---
 .../public/components/common/wazuh-discover/discover.scss   | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/plugins/main/public/components/common/wazuh-discover/discover.scss b/plugins/main/public/components/common/wazuh-discover/discover.scss
index c7fe605474..159db037c4 100644
--- a/plugins/main/public/components/common/wazuh-discover/discover.scss
+++ b/plugins/main/public/components/common/wazuh-discover/discover.scss
@@ -7,12 +7,6 @@
     top: auto;
   }
 
-  .discoverDataGrid {
-    .euiDataGrid__virtualized {
-      height: fit-content !important;
-    }
-  }
-
   .discoverChartContainer {
     min-height: 234px;
     .dshLayout-isMaximizedPanel {

From 7503ff42b1ffe955e447d5b8c59763d572d92a57 Mon Sep 17 00:00:00 2001
From: JuanGarriuz <juan.garcia@wazuh.com>
Date: Wed, 5 Jun 2024 17:34:17 +0200
Subject: [PATCH 03/12] discoverdatagrid remove

---
 .../public/components/common/wazuh-discover/wz-discover.tsx     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx b/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
index 9358102bf6..1f8945619c 100644
--- a/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
+++ b/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
@@ -233,7 +233,7 @@ const WazuhDiscoverComponent = (props: WazuhDiscoverProps) => {
                   </EuiPanel>
                 </EuiPanel>
               </EuiFlexItem>
-              <EuiFlexItem grow={false} className='discoverDataGrid'>
+              <EuiFlexItem grow={false}>
                 <EuiDataGrid
                   {...dataGridProps}
                   className={sideNavDocked ? 'dataGridDockedNav' : ''}

From d5f67f837e071e71957a22d3fc14ab7f39802d19 Mon Sep 17 00:00:00 2001
From: JuanGarriuz <juan.garcia@wazuh.com>
Date: Wed, 5 Jun 2024 17:45:04 +0200
Subject: [PATCH 04/12] Fix minor visual bugs

---
 .../public/components/common/wazuh-discover/discover.scss   | 6 ------
 .../public/components/common/wazuh-discover/wz-discover.tsx | 1 +
 2 files changed, 1 insertion(+), 6 deletions(-)

diff --git a/plugins/main/public/components/common/wazuh-discover/discover.scss b/plugins/main/public/components/common/wazuh-discover/discover.scss
index 159db037c4..34d1ba2bed 100644
--- a/plugins/main/public/components/common/wazuh-discover/discover.scss
+++ b/plugins/main/public/components/common/wazuh-discover/discover.scss
@@ -1,6 +1,4 @@
 .discoverContainer {
-  height: calc(100vh - 104px);
-
   .euiDataGrid--fullScreen {
     height: calc(100vh - 49px);
     bottom: 0;
@@ -18,7 +16,3 @@
     }
   }
 }
-
-.headerIsExpanded .discoverContainer {
-  height: calc(100vh - 153px);
-}
diff --git a/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx b/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
index 1f8945619c..831fa107e0 100644
--- a/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
+++ b/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
@@ -187,6 +187,7 @@ const WazuhDiscoverComponent = (props: WazuhDiscoverProps) => {
       <EuiPageTemplate
         className='discoverContainer'
         restrictWidth='100%'
+        fullHeight={true}
         grow
         paddingSize='none'
         pageContentProps={{ color: 'transparent' }}

From de7cae54ca941080e939854c3dc90cfe3909ec9f Mon Sep 17 00:00:00 2001
From: JuanGarriuz <juan.garcia@wazuh.com>
Date: Thu, 6 Jun 2024 09:30:06 +0200
Subject: [PATCH 05/12] Update CHANGELOG.md

---
 CHANGELOG.md | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 69852789fc..ab315f28d2 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -49,7 +49,8 @@ All notable changes to the Wazuh app project will be documented in this file.
 - Fixed an error of malformed table row on the generation of PDF reports [#6558](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6558)
 - Fixed the sample alerts scripts to generate valid IP ranges and file hashes [#6667](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6667)
 - Fixed cronjob max seconds interval validation [#6730](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6730)
-
+- Fixed styles in small height viewports[#6747](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6747)
+  
 ### Removed
 
 - Removed some branding references across the application. [#6155](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6155)

From d3bde9b446e7afbf1df25ccecaf5894fdd801be7 Mon Sep 17 00:00:00 2001
From: JuanGarriuz <juan.garcia@wazuh.com>
Date: Thu, 6 Jun 2024 09:30:43 +0200
Subject: [PATCH 06/12] Update CHANGELOG typo

---
 CHANGELOG.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ab315f28d2..cb24a6bcb1 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -49,7 +49,7 @@ All notable changes to the Wazuh app project will be documented in this file.
 - Fixed an error of malformed table row on the generation of PDF reports [#6558](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6558)
 - Fixed the sample alerts scripts to generate valid IP ranges and file hashes [#6667](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6667)
 - Fixed cronjob max seconds interval validation [#6730](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6730)
-- Fixed styles in small height viewports[#6747](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6747)
+- Fixed styles in small height viewports [#6747](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6747)
   
 ### Removed
 

From 37299ceedbd79792d6f916d5c93aa859633a018a Mon Sep 17 00:00:00 2001
From: Luciano Gorza <lucianogorza@gmail.com>
Date: Thu, 6 Jun 2024 14:11:49 -0300
Subject: [PATCH 07/12] Fix invalid date in grid in Firefox and Safari

---
 .../components/common/wazuh-discover/render-columns.tsx       | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/plugins/main/public/components/common/wazuh-discover/render-columns.tsx b/plugins/main/public/components/common/wazuh-discover/render-columns.tsx
index b428b62735..ce68ffdd4f 100644
--- a/plugins/main/public/components/common/wazuh-discover/render-columns.tsx
+++ b/plugins/main/public/components/common/wazuh-discover/render-columns.tsx
@@ -85,8 +85,4 @@ export const wzDiscoverRenderColumns: tDataGridRenderColumn[] = [
         <div>{renderMitreTechnique(value)}</div>
       ),
   },
-  {
-    id: 'timestamp',
-    render: value => formatUIDate(value),
-  },
 ];

From f5ee25b7eefbe4586b01b6783bd2cc6d9a6aa31a Mon Sep 17 00:00:00 2001
From: Luciano Gorza <lucianogorza@gmail.com>
Date: Thu, 6 Jun 2024 17:17:18 -0300
Subject: [PATCH 08/12] Fix data grid full screen height and scroll

---
 .../wazuh-data-grid/wazuh-data-grid.scss      | 21 ++++++++++++-------
 .../common/wazuh-discover/discover.scss       |  5 +++++
 .../common/wazuh-discover/wz-discover.tsx     |  2 +-
 .../threat-hunting/dashboard/dashboard.tsx    |  4 ++--
 .../dashboard/threat_hunting_dashboard.scss   | 13 ++++++++++++
 .../dashboards/inventory/inventory.scss       |  2 +-
 6 files changed, 35 insertions(+), 12 deletions(-)

diff --git a/plugins/main/public/components/common/wazuh-data-grid/wazuh-data-grid.scss b/plugins/main/public/components/common/wazuh-data-grid/wazuh-data-grid.scss
index 772f0d521e..41c30dc82a 100644
--- a/plugins/main/public/components/common/wazuh-data-grid/wazuh-data-grid.scss
+++ b/plugins/main/public/components/common/wazuh-data-grid/wazuh-data-grid.scss
@@ -1,14 +1,19 @@
 .wazuhDataGridContainer {
-    max-width: 100%;
-    min-width: 100%;
+  max-width: 100%;
+  min-width: 100%;
 
-    .euiDataGrid--fullScreen {
-        height: calc(100vh - 49px);
-        bottom: 0;
-        top: auto;
+  .euiDataGrid--fullScreen {
+    height: calc(100vh - 49px);
+    bottom: 0;
+    top: auto;
+
+    .euiDataGrid__virtualized {
+      height: calc(100vh - 147px) !important;
+      width: 100% !important;
     }
+  }
 }
 
 .headerIsExpanded .wazuhDataGridContainer {
-    height: calc(100vh - 153px);
-}
\ No newline at end of file
+  height: calc(100vh - 153px);
+}
diff --git a/plugins/main/public/components/common/wazuh-discover/discover.scss b/plugins/main/public/components/common/wazuh-discover/discover.scss
index 34d1ba2bed..4db531c19f 100644
--- a/plugins/main/public/components/common/wazuh-discover/discover.scss
+++ b/plugins/main/public/components/common/wazuh-discover/discover.scss
@@ -3,6 +3,11 @@
     height: calc(100vh - 49px);
     bottom: 0;
     top: auto;
+
+    .euiDataGrid__virtualized {
+      height: calc(100vh - 147px) !important;
+      width: 100% !important;
+    }
   }
 
   .discoverChartContainer {
diff --git a/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx b/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
index 831fa107e0..590275133c 100644
--- a/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
+++ b/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
@@ -234,7 +234,7 @@ const WazuhDiscoverComponent = (props: WazuhDiscoverProps) => {
                   </EuiPanel>
                 </EuiPanel>
               </EuiFlexItem>
-              <EuiFlexItem grow={false}>
+              <EuiFlexItem>
                 <EuiDataGrid
                   {...dataGridProps}
                   className={sideNavDocked ? 'dataGridDockedNav' : ''}
diff --git a/plugins/main/public/components/overview/threat-hunting/dashboard/dashboard.tsx b/plugins/main/public/components/overview/threat-hunting/dashboard/dashboard.tsx
index 1a890f4b6f..d8a0751b4d 100644
--- a/plugins/main/public/components/overview/threat-hunting/dashboard/dashboard.tsx
+++ b/plugins/main/public/components/overview/threat-hunting/dashboard/dashboard.tsx
@@ -225,7 +225,7 @@ const DashboardTH: React.FC = () => {
           <DiscoverNoResults />
         ) : null}
         {!isDataSourceLoading && dataSource && results?.hits?.total > 0 ? (
-          <>
+          <div className='th-container'>
             <SampleDataWarning />
             <div className='th-dashboard-responsive'>
               <DashboardByRenderer
@@ -333,7 +333,7 @@ const DashboardTH: React.FC = () => {
                 </EuiFlyout>
               )}
             </div>
-          </>
+          </div>
         ) : null}
       </>
     </I18nProvider>
diff --git a/plugins/main/public/components/overview/threat-hunting/dashboard/threat_hunting_dashboard.scss b/plugins/main/public/components/overview/threat-hunting/dashboard/threat_hunting_dashboard.scss
index c8e78aed47..659e9d91ae 100644
--- a/plugins/main/public/components/overview/threat-hunting/dashboard/threat_hunting_dashboard.scss
+++ b/plugins/main/public/components/overview/threat-hunting/dashboard/threat_hunting_dashboard.scss
@@ -8,3 +8,16 @@
     }
   }
 }
+
+.th-container {
+  .euiDataGrid--fullScreen {
+    height: calc(100vh - 49px);
+    bottom: 0;
+    top: auto;
+
+    .euiDataGrid__virtualized {
+      height: calc(100vh - 147px) !important;
+      width: 100% !important;
+    }
+  }
+}
diff --git a/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss b/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss
index f007243e93..8a107fa1d1 100644
--- a/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss
+++ b/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss
@@ -12,7 +12,7 @@
     top: auto;
 
     .euiDataGrid__virtualized {
-      height: calc(100vh - 152px) !important;
+      height: calc(100vh - 147px) !important;
       width: 100% !important;
     }
   }

From beb296801016f51ec062b2ad6f966d1eb437d48a Mon Sep 17 00:00:00 2001
From: Luciano Gorza <lucianogorza@gmail.com>
Date: Thu, 6 Jun 2024 17:29:10 -0300
Subject: [PATCH 09/12] Set min width to wazuh discover flyout field headers

---
 plugins/main/public/components/common/doc-viewer/doc-viewer.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/main/public/components/common/doc-viewer/doc-viewer.tsx b/plugins/main/public/components/common/doc-viewer/doc-viewer.tsx
index 70315ae2fc..933dcfac3e 100644
--- a/plugins/main/public/components/common/doc-viewer/doc-viewer.tsx
+++ b/plugins/main/public/components/common/doc-viewer/doc-viewer.tsx
@@ -134,7 +134,7 @@ const DocViewer = (props: tDocViewerProps) => {
                             {...fieldIconProps}
                           />
                         </EuiFlexItem>
-                        <EuiFlexItem style={{ maxWidth: '25vw' }}>
+                        <EuiFlexItem style={{ maxWidth: '25vw', minWidth: '200px' }}>
                           <span style={{ wordBreak: 'break-all' }}>
                             <b>{displayName}</b>
                           </span>

From 454b8c50f9f5f000ad9a0ae0157ffe6ba1e4ee36 Mon Sep 17 00:00:00 2001
From: JuanGarriuz <juan.garcia@wazuh.com>
Date: Fri, 7 Jun 2024 09:17:39 +0200
Subject: [PATCH 10/12] Change JSON view to a text view

---
 .../techniques/components/rule-details.tsx    | 131 +++++++++++-------
 1 file changed, 80 insertions(+), 51 deletions(-)

diff --git a/plugins/main/public/components/overview/mitre/framework/components/techniques/components/rule-details.tsx b/plugins/main/public/components/overview/mitre/framework/components/techniques/components/rule-details.tsx
index cab102dca7..d735da3bf5 100644
--- a/plugins/main/public/components/overview/mitre/framework/components/techniques/components/rule-details.tsx
+++ b/plugins/main/public/components/overview/mitre/framework/components/techniques/components/rule-details.tsx
@@ -26,7 +26,7 @@ const complianceEquivalences = {
   'nist-800-53': 'NIST-800-53',
 };
 
-const getValueAsString = (value) => {
+const getValueAsString = value => {
   if (value && typeof value === 'object' && value.constructor === Object) {
     let list: any[] = [];
     Object.keys(value).forEach((key, idx) => {
@@ -36,7 +36,7 @@ const getValueAsString = (value) => {
           {value[key]}
           {idx < Object.keys(value).length - 1 && ', '}
           <br />
-        </span>
+        </span>,
       );
     });
     return (
@@ -53,28 +53,36 @@ const getValueAsString = (value) => {
  * Build an object with the compliance info about a rule
  * @param {Object} ruleInfo
  */
-const buildCompliance = (ruleInfo) => {
+const buildCompliance = ruleInfo => {
   if (!ruleInfo) return {};
   const compliance = {};
-  const complianceKeys = ['gdpr', 'gpg13', 'hipaa', 'nist-800-53', 'pci', 'mitre'];
-  Object.keys(ruleInfo).forEach((key) => {
-    if (complianceKeys.includes(key) && ruleInfo[key].length) compliance[key] = ruleInfo[key];
+  const complianceKeys = [
+    'gdpr',
+    'gpg13',
+    'hipaa',
+    'nist-800-53',
+    'pci',
+    'mitre',
+  ];
+  Object.keys(ruleInfo).forEach(key => {
+    if (complianceKeys.includes(key) && ruleInfo[key].length)
+      compliance[key] = ruleInfo[key];
   });
   return compliance || {};
 };
 
-const getFormattedDetails = (value) => {
+const getFormattedDetails = value => {
   if (Array.isArray(value) && value[0].type) {
     let link = '';
     let name = '';
 
-    value.forEach((item) => {
+    value.forEach(item => {
       if (item.type === 'cve') {
         name = item.name;
       }
       if (item.type === 'link') {
         link = (
-          <EuiLink href={item.name} target="_blank" rel="noopener noreferrer">
+          <EuiLink href={item.name} target='_blank' rel='noopener noreferrer'>
             {item.name}
           </EuiLink>
         );
@@ -87,11 +95,15 @@ const getFormattedDetails = (value) => {
     );
   } else {
     const _value = typeof value === 'string' ? value : getValueAsString(value);
-    return <WzTextWithTooltipTruncated position="top">{_value}</WzTextWithTooltipTruncated>;
+    return (
+      <WzTextWithTooltipTruncated position='top'>
+        {_value}
+      </WzTextWithTooltipTruncated>
+    );
   }
 };
 
-const getComplianceKey = (key) => {
+const getComplianceKey = key => {
   if (key === 'pci') {
     return 'rule.pci_dss';
   }
@@ -120,11 +132,11 @@ const RuleDetails = (props: Props) => {
   const compliance = useMemo(() => buildCompliance(ruleData), [ruleData]);
   const id = ruleData.id;
 
-  const addFilter = (value) => {
+  const addFilter = value => {
     onClick && onClick(value);
   };
 
-  const renderCompliance = (compliance) => {
+  const renderCompliance = compliance => {
     if (!compliance || Object.keys(compliance).length === 0) {
       return <div>No compliance information available</div>;
     }
@@ -136,11 +148,15 @@ const RuleDetails = (props: Props) => {
           .sort()
           .map((complianceCategory, index) => {
             return (
-              <EuiFlexItem key={`rule-compliance-${complianceCategory}-${index}`}>
-                <div style={styleTitle}>{complianceEquivalences[complianceCategory]}</div>
+              <EuiFlexItem
+                key={`rule-compliance-${complianceCategory}-${index}`}
+              >
+                <div style={styleTitle}>
+                  {complianceEquivalences[complianceCategory]}
+                </div>
                 <div>
                   {compliance[complianceCategory]
-                    .map((comp) => {
+                    .map(comp => {
                       const filter = {
                         [getComplianceKey(complianceCategory)]: comp,
                       };
@@ -149,11 +165,11 @@ const RuleDetails = (props: Props) => {
                           key={`rule-compliance-tooltip-${complianceCategory}-${
                             Math.random() * (index - 0) + index
                           }`}
-                          position="top"
+                          position='top'
                           content={`Filter by this compliance`}
                         >
                           <EuiBadge
-                            color="hollow"
+                            color='hollow'
                             onClick={() => addFilter(filter)}
                             onClickAriaLabel={comp}
                             title={null}
@@ -171,41 +187,48 @@ const RuleDetails = (props: Props) => {
       </EuiFlexGrid>
     );
   };
-  const renderDetails = (details) => {
+  const renderDetails = details => {
     if (!details) return null;
 
     const detailsToRender: any = [];
-    const capitalize = (str) => str[0].toUpperCase() + str.slice(1);
+    const capitalize = str => str[0].toUpperCase() + str.slice(1);
     // Exclude group key of details
     Object.keys(details)
-      .filter((key) => key !== 'group')
-      .forEach((key) => {
+      .filter(key => key !== 'group')
+      .forEach(key => {
         const detail = details[key];
-        const detailValue = typeof detail === 'object' ? JSON.stringify(detail) : detail;
         detailsToRender.push(
-          <EuiFlexItem key={key} grow={1} style={{ maxWidth: 'calc(25% - 24px)', maxHeight: 45 }}>
+          <EuiFlexItem
+            key={key}
+            grow={1}
+            style={{ maxWidth: 'calc(25% - 24px)', maxHeight: 45 }}
+          >
             <b style={{ paddingBottom: 6 }}>{capitalize(key)}</b>
-            {detailValue === '' ? 'true' : getFormattedDetails(detailValue)}
-          </EuiFlexItem>
+            {detail === '' ? 'true' : getFormattedDetails(detail)}
+          </EuiFlexItem>,
         );
       });
     return <EuiFlexGrid columns={4}>{detailsToRender}</EuiFlexGrid>;
   };
 
-  const renderGroups = (groups) => {
+  const renderGroups = groups => {
     if (!groups) return null;
     const listGroups: any = [];
     groups.forEach((group, index) => {
-      const groupValue = typeof group === 'object' ? JSON.stringify(group) : group;
+      const groupValue =
+        typeof group === 'object' ? JSON.stringify(group) : group;
       listGroups.push(
         <span key={groupValue}>
           <EuiLink onClick={() => addFilter({ 'rule.groups': groupValue })}>
-            <EuiToolTip position="top" content={`Filter by this group: ${groupValue}`}>
+            <EuiToolTip
+              position='top'
+              content={`Filter by this group: ${groupValue}`}
+            >
               <span>{groupValue}</span>
             </EuiToolTip>
           </EuiLink>
           {index < groups.length - 1 && ', '}
-        </span>
+        </span>,
       );
     });
     return (
@@ -218,27 +241,29 @@ const RuleDetails = (props: Props) => {
   const renderInfo = (id, level, file, path, groups) => {
     return (
       <EuiFlexGrid columns={4}>
-        <EuiFlexItem key="id" grow={1}>
+        <EuiFlexItem key='id' grow={1}>
           <b style={{ paddingBottom: 6 }}>ID</b>
-          <EuiToolTip position="top" content={`Filter by this rule ID: ${id}`}>
+          <EuiToolTip position='top' content={`Filter by this rule ID: ${id}`}>
             <EuiLink onClick={() => addFilter({ 'rule.id': id })}>{id}</EuiLink>
           </EuiToolTip>
         </EuiFlexItem>
-        <EuiFlexItem key="level" grow={1}>
+        <EuiFlexItem key='level' grow={1}>
           <b style={{ paddingBottom: 6 }}>Level</b>
-          <EuiToolTip position="top" content={`Filter by this level: ${level}`}>
-            <EuiLink onClick={async () => addFilter({ 'rule.level': level })}>{level}</EuiLink>
+          <EuiToolTip position='top' content={`Filter by this level: ${level}`}>
+            <EuiLink onClick={async () => addFilter({ 'rule.level': level })}>
+              {level}
+            </EuiLink>
           </EuiToolTip>
         </EuiFlexItem>
-        <EuiFlexItem key="file" grow={1}>
+        <EuiFlexItem key='file' grow={1}>
           <b style={{ paddingBottom: 6 }}>File</b>
           {file}
         </EuiFlexItem>
-        <EuiFlexItem key="path" grow={1}>
+        <EuiFlexItem key='path' grow={1}>
           <b style={{ paddingBottom: 6 }}>Path</b>
           {path}
         </EuiFlexItem>
-        <EuiFlexItem key="Groups" grow={1}>
+        <EuiFlexItem key='Groups' grow={1}>
           <b style={{ paddingBottom: 6 }}>Groups</b>
           {renderGroups(groups)}
         </EuiFlexItem>
@@ -247,55 +272,59 @@ const RuleDetails = (props: Props) => {
   };
 
   return (
-    <EuiFlexGroup direction="column" gutterSize="none">
+    <EuiFlexGroup direction='column' gutterSize='none'>
       <EuiFlexItem style={{ marginTop: 8 }}>
         <EuiAccordion
-          id="Info"
+          id='Info'
           buttonContent={
-            <EuiTitle size="s">
+            <EuiTitle size='s'>
               <h3>Information</h3>
             </EuiTitle>
           }
           extraAction={
             <EuiLink
               href={`#/manager/rules?tab=rules&redirectRule=${id}`}
-              target="_blank"
+              target='_blank'
               style={{ paddingTop: 5 }}
-              rel="noopener noreferrer"
+              rel='noopener noreferrer'
             >
-              <EuiIcon type="popout" color="primary" />
+              <EuiIcon type='popout' color='primary' />
               &nbsp; View in Rules
             </EuiLink>
           }
           initialIsOpen={true}
         >
-          <div className="flyout-row details-row">{renderInfo(id, level, file, path, groups)}</div>
+          <div className='flyout-row details-row'>
+            {renderInfo(id, level, file, path, groups)}
+          </div>
         </EuiAccordion>
       </EuiFlexItem>
       <EuiFlexItem style={{ marginTop: 8 }}>
         <EuiAccordion
-          id="Details"
+          id='Details'
           buttonContent={
-            <EuiTitle size="s">
+            <EuiTitle size='s'>
               <h3>Details</h3>
             </EuiTitle>
           }
           initialIsOpen={true}
         >
-          <div className="flyout-row details-row">{renderDetails(details)}</div>
+          <div className='flyout-row details-row'>{renderDetails(details)}</div>
         </EuiAccordion>
       </EuiFlexItem>
       <EuiFlexItem style={{ marginTop: 8 }}>
         <EuiAccordion
-          id="Compliance"
+          id='Compliance'
           buttonContent={
-            <EuiTitle size="s">
+            <EuiTitle size='s'>
               <h3>Compliance</h3>
             </EuiTitle>
           }
           initialIsOpen={true}
         >
-          <div className="flyout-row details-row">{renderCompliance(compliance)}</div>
+          <div className='flyout-row details-row'>
+            {renderCompliance(compliance)}
+          </div>
         </EuiAccordion>
       </EuiFlexItem>
     </EuiFlexGroup>

From 3125b26c1863141b76bfcdad517878986df2886d Mon Sep 17 00:00:00 2001
From: JuanGarriuz <juan.garcia@wazuh.com>
Date: Fri, 7 Jun 2024 16:52:36 +0200
Subject: [PATCH 11/12] Pinned agent resolve

---
 .../components/common/wazuh-data-grid/wazuh-data-grid.scss    | 4 ++++
 .../public/components/common/wazuh-discover/discover.scss     | 4 ++++
 .../threat-hunting/dashboard/threat_hunting_dashboard.scss    | 4 ++++
 .../vulnerabilities/dashboards/inventory/inventory.scss       | 4 ++++
 4 files changed, 16 insertions(+)

diff --git a/plugins/main/public/components/common/wazuh-data-grid/wazuh-data-grid.scss b/plugins/main/public/components/common/wazuh-data-grid/wazuh-data-grid.scss
index 41c30dc82a..92c1ab500e 100644
--- a/plugins/main/public/components/common/wazuh-data-grid/wazuh-data-grid.scss
+++ b/plugins/main/public/components/common/wazuh-data-grid/wazuh-data-grid.scss
@@ -2,6 +2,10 @@
   max-width: 100%;
   min-width: 100%;
 
+  .euiDataGrid__virtualized {
+    height: max-content !important;
+  }
+
   .euiDataGrid--fullScreen {
     height: calc(100vh - 49px);
     bottom: 0;
diff --git a/plugins/main/public/components/common/wazuh-discover/discover.scss b/plugins/main/public/components/common/wazuh-discover/discover.scss
index 4db531c19f..1bd68be0bc 100644
--- a/plugins/main/public/components/common/wazuh-discover/discover.scss
+++ b/plugins/main/public/components/common/wazuh-discover/discover.scss
@@ -1,4 +1,8 @@
 .discoverContainer {
+  .euiDataGrid__virtualized {
+    height: max-content !important;
+  }
+
   .euiDataGrid--fullScreen {
     height: calc(100vh - 49px);
     bottom: 0;
diff --git a/plugins/main/public/components/overview/threat-hunting/dashboard/threat_hunting_dashboard.scss b/plugins/main/public/components/overview/threat-hunting/dashboard/threat_hunting_dashboard.scss
index 659e9d91ae..a44ea6bd14 100644
--- a/plugins/main/public/components/overview/threat-hunting/dashboard/threat_hunting_dashboard.scss
+++ b/plugins/main/public/components/overview/threat-hunting/dashboard/threat_hunting_dashboard.scss
@@ -9,6 +9,10 @@
   }
 }
 
+.euiDataGrid__virtualized {
+  height: max-content !important;
+}
+
 .th-container {
   .euiDataGrid--fullScreen {
     height: calc(100vh - 49px);
diff --git a/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss b/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss
index 8a107fa1d1..4844141f13 100644
--- a/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss
+++ b/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss
@@ -1,6 +1,10 @@
 .vulsInventoryContainer {
   height: calc(100vh - 104px);
 
+  .euiDataGrid__virtualized {
+    height: max-content !important;
+  }
+
   // This makes the table not generate an unnecessary scroll when filtering data from 1 page and then do another search for more pages.
   .vulsInventoryDataGrid {
     height: calc(100vh - 216px) !important;

From a01c16c825f08cb38f095756f15dd8441b05e582 Mon Sep 17 00:00:00 2001
From: Federico Rodriguez <federico.rodriguez@wazuh.com>
Date: Fri, 7 Jun 2024 18:42:51 +0200
Subject: [PATCH 12/12] Fix flyout date format with pinned agent

---
 .../flyout-technique-columns.tsx              |  56 ++++----
 .../flyout-technique/flyout-technique.tsx     | 122 +++++++++---------
 2 files changed, 95 insertions(+), 83 deletions(-)

diff --git a/plugins/main/public/components/overview/mitre/framework/components/techniques/components/flyout-technique/flyout-technique-columns.tsx b/plugins/main/public/components/overview/mitre/framework/components/techniques/components/flyout-technique/flyout-technique-columns.tsx
index e9a98dc8dc..cecfb004d3 100644
--- a/plugins/main/public/components/overview/mitre/framework/components/techniques/components/flyout-technique/flyout-technique-columns.tsx
+++ b/plugins/main/public/components/overview/mitre/framework/components/techniques/components/flyout-technique/flyout-technique-columns.tsx
@@ -1,9 +1,15 @@
 import React from 'react';
-import { formatUIDate, AppNavigate } from '../../../../../../../../react-services';
+import {
+  formatUIDate,
+  AppNavigate,
+} from '../../../../../../../../react-services';
 import { tDataGridColumn } from '../../../../../../../common/data-grid';
 import { EuiLink, EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
 import { getCore } from '../../../../../../../../kibana-services';
-import { rules, endpointSummary } from '../../../../../../../../utils/applications';
+import {
+  rules,
+  endpointSummary,
+} from '../../../../../../../../utils/applications';
 import { RedirectAppLinks } from '../../../../../../../../../../../src/plugins/opensearch_dashboards_react/public';
 
 const navigateTo = (ev, section, params) => {
@@ -11,18 +17,18 @@ const navigateTo = (ev, section, params) => {
 };
 
 const renderTechniques = (value: []) => {
-  const techniques = value.map((technique) => {
-    /* 
+  const techniques = value.map(technique => {
+    /*
       ToDo:
       This link redirect to the Intelligence tab and open the flyout technique detail
-      This must be replaced by the RedirectAppLinks but right now the RedirectAppLinks is not working, 
+      This must be replaced by the RedirectAppLinks but right now the RedirectAppLinks is not working,
       doesn't open the tab and the flyout technique, so we are using the AppNavigate.navigateToModule
     */
     return (
       <EuiFlexItem key={technique}>
         <EuiLink
           key={technique}
-          onClick={(e) =>
+          onClick={e =>
             navigateTo(e, 'overview', {
               tab: 'mitre',
               tabView: 'intelligence',
@@ -38,24 +44,28 @@ const renderTechniques = (value: []) => {
   });
 
   return (
-    <EuiFlexGroup gutterSize="s" direction="column">
+    <EuiFlexGroup gutterSize='s' direction='column'>
       {techniques}
     </EuiFlexGroup>
   );
 };
 
 export const techniquesColumns: tDataGridColumn[] = [
-  { id: 'timestamp', displayAsText: 'Time', render: (value) => formatUIDate(value) },
+  {
+    id: 'timestamp',
+    displayAsText: 'Time',
+    render: value => formatUIDate(value),
+  },
   {
     id: 'agent.id',
     displayAsText: 'Agent',
-    render: (agentId) => (
+    render: agentId => (
       <RedirectAppLinks application={getCore().application}>
         <EuiLink
           href={`${endpointSummary.id}#/agents?tab=welcome&agent=${agentId}`}
         >
           {agentId}
-        </EuiLink >
+        </EuiLink>
       </RedirectAppLinks>
     ),
   },
@@ -63,20 +73,18 @@ export const techniquesColumns: tDataGridColumn[] = [
   {
     id: 'rule.mitre.id',
     displayAsText: 'Technique(s)',
-    render: (value) => renderTechniques(value),
+    render: value => renderTechniques(value),
   },
   { id: 'rule.mitre.tactic', displayAsText: 'Tactic(s)' },
   { id: 'rule.level', displayAsText: 'Level' },
   {
     id: 'rule.id',
     displayAsText: 'Rule ID',
-    render: (value) => (
+    render: value => (
       <RedirectAppLinks application={getCore().application}>
-        <EuiLink
-          href={`${rules.id}#/manager/?tab=rules&redirectRule=${value}`}
-        >
+        <EuiLink href={`${rules.id}#/manager/?tab=rules&redirectRule=${value}`}>
           {value}
-        </EuiLink >
+        </EuiLink>
       </RedirectAppLinks>
     ),
   },
@@ -84,24 +92,26 @@ export const techniquesColumns: tDataGridColumn[] = [
 ];
 
 export const agentTechniquesColumns: tDataGridColumn[] = [
-  { id: 'timestamp', displayAsText: 'Time' },
+  {
+    id: 'timestamp',
+    displayAsText: 'Time',
+    render: value => formatUIDate(value),
+  },
   {
     id: 'rule.mitre.id',
     displayAsText: 'Technique(s)',
-    render: (value) => renderTechniques(value),
+    render: value => renderTechniques(value),
   },
   { id: 'rule.mitre.tactic', displayAsText: 'Tactic(s)' },
   { id: 'rule.level', displayAsText: 'Level' },
   {
     id: 'rule.id',
     displayAsText: 'Rule ID',
-    render: (value) => (
+    render: value => (
       <RedirectAppLinks application={getCore().application}>
-        <EuiLink
-          href={`${rules.id}#/manager/?tab=rules&redirectRule=${value}`}
-        >
+        <EuiLink href={`${rules.id}#/manager/?tab=rules&redirectRule=${value}`}>
           {value}
-        </EuiLink >
+        </EuiLink>
       </RedirectAppLinks>
     ),
   },
diff --git a/plugins/main/public/components/overview/mitre/framework/components/techniques/components/flyout-technique/flyout-technique.tsx b/plugins/main/public/components/overview/mitre/framework/components/techniques/components/flyout-technique/flyout-technique.tsx
index ce53b5ffad..b4d3b68f00 100644
--- a/plugins/main/public/components/overview/mitre/framework/components/techniques/components/flyout-technique/flyout-technique.tsx
+++ b/plugins/main/public/components/overview/mitre/framework/components/techniques/components/flyout-technique/flyout-technique.tsx
@@ -37,7 +37,10 @@ import { UI_LOGGER_LEVELS } from '../../../../../../../../../common/constants';
 import { UI_ERROR_SEVERITIES } from '../../../../../../../../react-services/error-orchestrator/types';
 import { getErrorOrchestrator } from '../../../../../../../../react-services/common-services';
 import { WzFlyout } from '../../../../../../../../components/common/flyouts';
-import { techniquesColumns, agentTechniquesColumns } from './flyout-technique-columns';
+import {
+  techniquesColumns,
+  agentTechniquesColumns,
+} from './flyout-technique-columns';
 import { PatternDataSource } from '../../../../../../../../components/common/data-source';
 import { WazuhFlyoutDiscover } from '../../../../../../../common/wazuh-discover/wz-flyout-discover';
 import { tFilterParams } from '../../../../mitre';
@@ -45,13 +48,6 @@ import TechniqueRowDetails from './technique-row-details';
 import { buildPhraseFilter } from '../../../../../../../../../../../src/plugins/data/common';
 import store from '../../../../../../../../redux/store';
 
-const md = new MarkdownIt({
-  html: true,
-  linkify: true,
-  breaks: true,
-  typographer: true,
-});
-
 type tFlyoutTechniqueProps = {
   currentTechnique: string;
   onChangeFlyout: (value: boolean) => void;
@@ -87,7 +83,7 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
   };
 
   useEffect(() => {
-    const componentDidUpdate = async (prevProps) => {
+    const componentDidUpdate = async prevProps => {
       const { currentTechnique } = props;
       if (prevProps.currentTechnique !== currentTechnique) {
         await getTechniqueData();
@@ -104,7 +100,7 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
         state.techniqueData.replaced_external_references &&
         state.techniqueData.replaced_external_references.length > 0
       ) {
-        state.techniqueData.replaced_external_references.forEach((reference) => {
+        state.techniqueData.replaced_external_references.forEach(reference => {
           $(`.technique-reference-${reference.index}`).each(function () {
             $(this).off();
           });
@@ -119,12 +115,12 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
       state.techniqueData.replaced_external_references &&
       state.techniqueData.replaced_external_references.length > 0
     ) {
-      state.techniqueData.replaced_external_references.forEach((reference) => {
+      state.techniqueData.replaced_external_references.forEach(reference => {
         $(`.technique-reference-citation-${reference.index}`).each(function () {
           $(this).off();
           $(this).click(() => {
             $(`.euiFlyoutBody__overflow`).scrollTop(
-              $(`#technique-reference-${reference.index}`).position().top - 150
+              $(`#technique-reference-${reference.index}`).position().top - 150,
             );
           });
         });
@@ -137,18 +133,31 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
       setIsLoading(true);
       setState({ techniqueData: {} });
       const { currentTechnique } = props;
-      const techniqueResponse = await WzRequest.apiReq('GET', '/mitre/techniques', {
-        params: {
-          q: `external_id=${currentTechnique}`,
+      const techniqueResponse = await WzRequest.apiReq(
+        'GET',
+        '/mitre/techniques',
+        {
+          params: {
+            q: `external_id=${currentTechnique}`,
+          },
         },
-      });
-      const [techniqueData] = (((techniqueResponse || {}).data || {}).data || {}).affected_items;
-      const tacticsResponse = await WzRequest.apiReq('GET', '/mitre/tactics', {});
-      const tacticsData = (((tacticsResponse || {}).data || {}).data || {}).affected_items;
+      );
+      const [techniqueData] = (
+        ((techniqueResponse || {}).data || {}).data || {}
+      ).affected_items;
+      const tacticsResponse = await WzRequest.apiReq(
+        'GET',
+        '/mitre/tactics',
+        {},
+      );
+      const tacticsData = (((tacticsResponse || {}).data || {}).data || {})
+        .affected_items;
 
       techniqueData.tactics &&
-        (techniqueData.tactics = techniqueData.tactics.map((tacticID) => {
-          const tactic = tacticsData.find((tacticData) => tacticData.id === tacticID);
+        (techniqueData.tactics = techniqueData.tactics.map(tacticID => {
+          const tactic = tacticsData.find(
+            tacticData => tacticData.id === tacticID,
+          );
           return { id: tactic.external_id, name: tactic.name };
         }));
       const { name, mitre_version, tactics } = techniqueData;
@@ -184,8 +193,8 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
             <EuiLoadingContent lines={1} />
           </div>
         )) || (
-          <EuiTitle size="m">
-            <h2 id="flyoutSmallTitle">{techniqueData.name}</h2>
+          <EuiTitle size='m'>
+            <h2 id='flyoutSmallTitle'>{techniqueData.name}</h2>
           </EuiTitle>
         )}
       </EuiFlyoutHeader>
@@ -197,8 +206,12 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
     const key = Object.keys(filter)[0];
     const value = filter[key];
     const valuesArray = Array.isArray(value) ? [...value] : [value];
-    valuesArray.map((item) => {
-      const formattedFilter = buildPhraseFilter({ name: key, type: 'string' }, item, indexPattern);
+    valuesArray.map(item => {
+      const formattedFilter = buildPhraseFilter(
+        { name: key, type: 'string' },
+        item,
+        indexPattern,
+      );
       if (formattedFilter) {
         filtersToAdd.push(formattedFilter);
       }
@@ -217,7 +230,7 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
     return <TechniqueRowDetails {...props} onRuleItemClick={onItemClick} />;
   };
 
-  const getDiscoverColums = () => {
+  const getDiscoverColumns = () => {
     // when the agent is pinned
     const agentId = store.getState().appStateReducers?.currentAgentData?.id;
     return agentId ? agentTechniquesColumns : techniquesColumns;
@@ -226,27 +239,16 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
   const renderBody = () => {
     const { currentTechnique } = props;
     const { techniqueData } = state;
-    const link = `https://attack.mitre.org/techniques/${currentTechnique}/`;
-    const formattedDescription = techniqueData.description ? (
-      <div
-        className="wz-markdown-margin wz-markdown-wrapper"
-        dangerouslySetInnerHTML={{
-          __html: md.render(techniqueData.description),
-        }}
-      ></div>
-    ) : (
-      techniqueData.description
-    );
     const data = [
       {
         title: 'ID',
         description: (
           <EuiToolTip
-            position="top"
+            position='top'
             content={`Open ${currentTechnique} details in the Intelligence section`}
           >
             <EuiLink
-              onClick={(e) => {
+              onClick={e => {
                 AppNavigate.navigateToModule(e, 'overview', {
                   tab: 'mitre',
                   tabView: 'intelligence',
@@ -264,15 +266,15 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
       {
         title: 'Tactics',
         description: techniqueData.tactics
-          ? techniqueData.tactics.map((tactic) => {
+          ? techniqueData.tactics.map(tactic => {
               return (
                 <>
                   <EuiToolTip
-                    position="top"
+                    position='top'
                     content={`Open ${tactic.name} details in the Intelligence section`}
                   >
                     <EuiLink
-                      onClick={(e) => {
+                      onClick={e => {
                         AppNavigate.navigateToModule(e, 'overview', {
                           tab: 'mitre',
                           tabView: 'intelligence',
@@ -299,16 +301,16 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
     return (
       <EuiFlyoutBody>
         <EuiAccordion
-          id="details"
+          id='details'
           buttonContent={
-            <EuiTitle size="s">
+            <EuiTitle size='s'>
               <h3>Technique details</h3>
             </EuiTitle>
           }
           initialIsOpen={true}
         >
-          <div className="flyout-row details-row">
-            <EuiFlexGroup direction="column" gutterSize="none">
+          <div className='flyout-row details-row'>
+            <EuiFlexGroup direction='column' gutterSize='none'>
               {(Object.keys(techniqueData).length === 0 && (
                 <EuiFlexItem>
                   <EuiLoadingContent lines={2} />
@@ -323,42 +325,42 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
           </div>
         </EuiAccordion>
 
-        <EuiSpacer size="s" />
+        <EuiSpacer size='s' />
         <EuiAccordion
           style={{ textDecoration: 'none' }}
           id={'recent_events'}
-          className="events-accordion"
+          className='events-accordion'
           buttonContent={
-            <EuiTitle size="s">
+            <EuiTitle size='s'>
               <h3>
                 Recent events
                 <span style={{ marginLeft: 16 }}>
                   <span>
                     <EuiToolTip
-                      position="top"
+                      position='top'
                       content={'Show ' + currentTechnique + ' in Dashboard'}
                     >
                       <EuiIcon
-                        onMouseDown={(e) => {
+                        onMouseDown={e => {
                           openDashboard(e, currentTechnique);
                           e.stopPropagation();
                         }}
-                        color="primary"
-                        type="visualizeApp"
+                        color='primary'
+                        type='visualizeApp'
                         style={{ marginRight: '10px' }}
                       ></EuiIcon>
                     </EuiToolTip>
                     <EuiToolTip
-                      position="top"
+                      position='top'
                       content={'Inspect ' + currentTechnique + ' in Events'}
                     >
                       <EuiIcon
-                        onMouseDown={(e) => {
+                        onMouseDown={e => {
                           openDiscover(e, currentTechnique);
                           e.stopPropagation();
                         }}
-                        color="primary"
-                        type="discoverApp"
+                        color='primary'
+                        type='discoverApp'
                       ></EuiIcon>
                     </EuiToolTip>
                   </span>
@@ -366,13 +368,13 @@ export const FlyoutTechnique = (props: tFlyoutTechniqueProps) => {
               </h3>
             </EuiTitle>
           }
-          paddingSize="none"
+          paddingSize='none'
           initialIsOpen={true}
         >
-          <div className="details-row">
+          <div className='details-row'>
             <WazuhFlyoutDiscover
               DataSource={PatternDataSource}
-              tableColumns={getDiscoverColums()}
+              tableColumns={getDiscoverColumns()}
               filterManager={filterManager}
               initialFetchFilters={filterParams.filters}
               expandedRowComponent={expandedRow}