Add filter for outdated agents (#6529)

* Add upgrade agents global action * Add Upgrade result modal * Update CHANGELOG * Minor fixes * Add unit tests * Improve upgrade progress message * Remove wazuh-endpoints plugin * Fix file name * Fix import * Fix get tasks status for readonly user * Improve return condition * Improve error message for Timeout status * Add tooltipo to timeout status * Modularize get status functions * Fix status name and key values * Separate upgrade service in two services * Add filter for outdated agents * Update CHANGELOG * Update unit tests * Update agents-table unit tests * Minor fixes * Fix unit test snapshot * Change unknown with N/A for groups and os charts * Change unknown with N/A for groups and os charts * Add tooltip when there are no selected agents * Fix IDs field name * Fix result paginations * Fix IDs labels * Fix agents table global actions * Add tooltip to filter switch when there are no outdated agents * Implement WzButton instead EuiSwitch plus EuiToolTip --------- Co-authored-by: Federico Rodriguez <federico.rodriguez@wazuh.com>
wazuh · Mar 22, 2024 · c5824d7 · c5824d7
1 parent a8a459b
commit c5824d7
Show file tree

Hide file tree

Showing 20 changed files with 667 additions and 417 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -10,7 +10,7 @@ All notable changes to the Wazuh app project will be documented in this file.
 - Added AngularJS dependencies [#6145](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6145)
 - Added a migration task to setup the configuration using a configuration file [#6337](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6337)
 - Added the ability to manage the API hosts from the Server APIs [#6337](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6337) [#6519](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6519)
-- Added edit agent groups and upgrade agents actions to Endpoints Summary [#6250](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6250) [#6476](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6476) [#6274](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6274) [#6501](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6501)
+- Improve fleet management by adding 'Edit Agent Groups' and 'Upgrade Agents' actions, as well as a filter to show only outdated agents [#6250](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6250) [#6476](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6476) [#6274](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6274) [#6501](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6501) [#6529](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6529)
 - Added propagation of updates from the table to dashboard visualizations in Endpoints summary [#6460](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6460)
 - Handle index pattern selector on new discover [#6499](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6499)
 

diff --git a/plugins/main/public/components/agents/syscollector/__snapshots__/inventory.test.tsx.snap b/plugins/main/public/components/agents/syscollector/__snapshots__/inventory.test.tsx.snap
@@ -141,7 +141,7 @@ exports[`Inventory component A Apple agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -544,7 +544,7 @@ exports[`Inventory component A Apple agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -897,7 +897,7 @@ exports[`Inventory component A Apple agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -1303,7 +1303,7 @@ exports[`Inventory component A Apple agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -1711,7 +1711,7 @@ exports[`Inventory component A Apple agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -2289,7 +2289,7 @@ exports[`Inventory component A Linux agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -2691,7 +2691,7 @@ exports[`Inventory component A Linux agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -3075,7 +3075,7 @@ exports[`Inventory component A Linux agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -3480,7 +3480,7 @@ exports[`Inventory component A Linux agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -3888,7 +3888,7 @@ exports[`Inventory component A Linux agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -4587,7 +4587,7 @@ exports[`Inventory component A Windows agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -4990,7 +4990,7 @@ exports[`Inventory component A Windows agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -5367,7 +5367,7 @@ exports[`Inventory component A Windows agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -5770,7 +5770,7 @@ exports[`Inventory component A Windows agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -6080,7 +6080,7 @@ exports[`Inventory component A Windows agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"
@@ -6464,7 +6464,7 @@ exports[`Inventory component A Windows agent should be well rendered. 1`] = `
                 class="euiFlexItem"
               >
                 <div
-                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                 >
                   <div
                     class="euiFlexItem euiFlexItem--flexGrowZero wz-flex-basis-auto"

diff --git a/plugins/main/public/components/common/buttons/button.tsx b/plugins/main/public/components/common/buttons/button.tsx
@@ -15,38 +15,39 @@ import {
   EuiButtonEmpty,
   EuiButtonIcon,
   EuiLink,
-  EuiToolTip
+  EuiToolTip,
+  EuiSwitch,
 } from '@elastic/eui';
 
-enum WzButtonType{
+enum WzButtonType {
   default = 'default',
   empty = 'empty',
   icon = 'icon',
-  link = 'link'
+  link = 'link',
+  switch = 'switch',
 }
 
-interface WzButtonProps{
-  buttonType?: WzButtonType
-  tooltip?: any
-  rest?: any
-};
-
-const WzButtons: {[key in WzButtonType]: React.FunctionComponent} = {
-  'default': EuiButton,
-  'empty': EuiButtonEmpty,
-  'icon': EuiButtonIcon,
-  'link': EuiLink,
+interface WzButtonProps {
+  buttonType?: WzButtonType;
+  tooltip?: any;
+  rest?: any;
 }
 
-export const WzButton = ({buttonType = WzButtonType.default, tooltip, ...rest}: WzButtonProps) => {
+const WzButtons: { [key in WzButtonType]: React.FunctionComponent } = {
+  default: EuiButton,
+  empty: EuiButtonEmpty,
+  icon: EuiButtonIcon,
+  link: EuiLink,
+  switch: EuiSwitch,
+};
+
+export const WzButton = ({
+  buttonType = WzButtonType.default,
+  tooltip,
+  ...rest
+}: WzButtonProps) => {
   const Button = WzButtons[buttonType];
-
-  const button = <Button {...rest} />
-  return tooltip ? 
-    <EuiToolTip
-      {...tooltip}
-    >
-      {button}
-    </EuiToolTip>
-  : button
-}
+
+  const button = <Button {...rest} />;
+  return tooltip ? <EuiToolTip {...tooltip}>{button}</EuiToolTip> : button;
+};
diff --git a/plugins/main/public/components/common/tables/__snapshots__/table-wz-api.test.tsx.snap b/plugins/main/public/components/common/tables/__snapshots__/table-wz-api.test.tsx.snap
@@ -62,9 +62,10 @@ exports[`Table WZ API component renders correctly to match the snapshot 1`] = `
                   <EuiFlexGroup
                     alignItems="center"
                     responsive={false}
+                    wrap={true}
                   >
                     <div
-                      className="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+                      className="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
                     >
                       <EuiFlexItem
                         className="wz-flex-basis-auto"

diff --git a/plugins/main/public/components/common/tables/table-wz-api.tsx b/plugins/main/public/components/common/tables/table-wz-api.tsx
@@ -197,7 +197,7 @@ export function TableWzAPI({
     <>
       <EuiFlexGroup wrap alignItems='center' responsive={false}>
         <EuiFlexItem>
-          <EuiFlexGroup alignItems='center' responsive={false}>
+          <EuiFlexGroup wrap alignItems='center' responsive={false}>
             <EuiFlexItem className='wz-flex-basis-auto' grow={false}>
               {rest.title && (
                 <EuiTitle size='s'>