The check update button does not show the date of the last scan

CHANGELOG.md

@@ -7,7 +7,7 @@ All notable changes to the Wazuh app project will be documented in this file.
 ### Added
 
 - Support for Wazuh 4.8.0
-- Added the ability to check if there are available updates from the UI. [#6093](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6093) [#6256](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6256)
+- Added the ability to check if there are available updates from the UI. [#6093](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6093) [#6256](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6256) [#6328](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6328)
 - Added remember server address check [#5791](https://github.com/wazuh/wazuh-dashboard-plugins/pull/5791)
 - Added the ssl_agent_ca configuration to the SSL Settings form [#6083](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6083)
 - Added global vulnerabilities dashboards [#5896](https://github.com/wazuh/wazuh-dashboard-plugins/pull/5896) [#6179](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6179) [#6173](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6173) [#6147](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6147) [#6231](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6231) [#6246](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6246) [#6338] (https://github.com/wazuh/wazuh-dashboard-plugins/pull/6338)

plugins/main/opensearch_dashboards.json

@@ -19,7 +19,8 @@
     "opensearchDashboardsReact",
     "opensearchDashboardsUtils",
     "opensearchDashboardsLegacy",
-    "wazuhCheckUpdates"
+    "wazuhCheckUpdates",
+    "wazuhCore"
   ],
   "optionalPlugins": [
     "security",
@@ -29,4 +30,4 @@
   ],
   "server": true,
   "ui": true
-}
+}

plugins/main/public/components/settings/api/api-table.js

@@ -35,9 +35,11 @@ import { compose } from 'redux';
 import { UI_ERROR_SEVERITIES } from '../../../react-services/error-orchestrator/types';
 import { UI_LOGGER_LEVELS } from '../../../../common/constants';
 import { getErrorOrchestrator } from '../../../react-services/common-services';
-import { getWazuhCheckUpdatesPlugin } from '../../../kibana-services';
+import {
+  getWazuhCheckUpdatesPlugin,
+  getWazuhCorePlugin,
+} from '../../../kibana-services';
 import { AvailableUpdatesFlyout } from './available-updates-flyout';
-import { formatUIDate } from '../../../react-services/time-service';
 
 export const ApiTable = compose(
   withErrorBoundary,
@@ -47,13 +49,10 @@ export const ApiTable = compose(
     constructor(props) {
       super(props);
 
-      const { getAvailableUpdates } = getWazuhCheckUpdatesPlugin();
-
       this.state = {
         apiEntries: [],
         refreshingEntries: false,
         availableUpdates: {},
-        getAvailableUpdates,
         refreshingAvailableUpdates: true,
         apiAvailableUpdateDetails: undefined,
       };
@@ -62,9 +61,8 @@ export const ApiTable = compose(
     async getApisAvailableUpdates(forceUpdate = false) {
       try {
         this.setState({ refreshingAvailableUpdates: true });
-        const availableUpdates = await this.state.getAvailableUpdates(
-          forceUpdate,
-        );
+        const availableUpdates =
+          await getWazuhCheckUpdatesPlugin().getAvailableUpdates(forceUpdate);
         this.setState({ availableUpdates });
       } catch (error) {
         const options = {
@@ -553,10 +551,8 @@ export const ApiTable = compose(
                       title='Last check'
                       content={
                         this.state.availableUpdates?.last_check_date
-                          ? formatUIDate(
-                              new Date(
-                                this.state.availableUpdates.last_check_date,
-                              ),
+                          ? getWazuhCorePlugin().utils.formatUIDate(
+                              this.state.availableUpdates.last_check_date,
                             )
                           : '-'
                       }

plugins/main/public/kibana-services.ts

@@ -45,6 +45,8 @@ export const [getWzCurrentAppID, setWzCurrentAppID] =
   createGetterSetter<NavigationPublicPluginStart>('WzCurrentAppID');
 export const [getWazuhCheckUpdatesPlugin, setWazuhCheckUpdatesPlugin] =
   createGetterSetter<WazuhCheckUpdatesPluginStart>('WazuhCheckUpdatesPlugin');
+export const [getWazuhCorePlugin, setWazuhCorePlugin] =
+  createGetterSetter<WazuhCheckUpdatesPluginStart>('WazuhCorePlugin');
 export const [getHeaderActionMenuMounter, setHeaderActionMenuMounter] =
   createGetterSetter<AppMountParameters['setHeaderActionMenu']>(
     'headerActionMenuMounter',

plugins/main/public/plugin.ts

@@ -24,6 +24,7 @@ import {
   setWzCurrentAppID,
   setWazuhCheckUpdatesPlugin,
   setHeaderActionMenuMounter,
+  setWazuhCorePlugin,
 } from './kibana-services';
 import {
   AppPluginStartDependencies,
@@ -221,6 +222,7 @@ export class WazuhPlugin
     setOverlays(core.overlays);
     setErrorOrchestrator(ErrorOrchestratorService);
     setWazuhCheckUpdatesPlugin(plugins.wazuhCheckUpdates);
+    setWazuhCorePlugin(plugins.wazuhCore);
     return {};
   }
 }

plugins/wazuh-check-updates/public/components/updates-notification.scss

@@ -1,11 +1,3 @@
-.euiBody--hasFlyout {
-    .wz-check-updates-bottom-bar {
-      margin-left: 320px;
-    }
-
-    &.euiBody-hasOverlayMask {
-      .wz-check-updates-bottom-bar {
-        margin-left: 0px;
-      }
-    }
-  }
+.wz-check-updates-bottom-bar {
+  margin-left: 320px;
+}

plugins/wazuh-check-updates/public/components/updates-notification.test.tsx

@@ -27,6 +27,11 @@ jest.mock('../plugin-services', () => ({
       },
     },
   }),
+  getWazuhCore: jest.fn().mockReturnValue({
+    hooks: {
+      useDockedSideNav: () => false,
+    },
+  }),
 }));
 
 jest.mock('react-use/lib/useObservable', () => () => {});

plugins/wazuh-check-updates/public/components/updates-notification.tsx

@@ -11,7 +11,7 @@ import React, { useEffect, useState } from 'react';
 import { FormattedMessage, I18nProvider } from '@osd/i18n/react';
 import { useUserPreferences } from '../hooks';
 import { areThereNewUpdates } from '../utils';
-import { getCore } from '../plugin-services';
+import { getCore, getWazuhCore } from '../plugin-services';
 import { AvailableUpdates } from '../../../wazuh-check-updates/common/types';
 import { getAvailableUpdates } from '../services';
 import { RedirectAppLinks } from '../../../../src/plugins/opensearch_dashboards_react/public';
@@ -22,6 +22,8 @@ export const UpdatesNotification = () => {
   const [isDismissed, setIsDismissed] = useState(false);
   const [dismissFutureUpdates, setDismissFutureUpdates] = useState(false);
 
+  const sideNavDocked = getWazuhCore().hooks.useDockedSideNav();
+
   const {
     userPreferences,
     error: userPreferencesError,
@@ -57,7 +59,7 @@ export const UpdatesNotification = () => {
 
   const mustNotifyUser = areThereNewUpdates(
     availableUpdates?.apis_available_updates,
-    userPreferences.last_dismissed_updates
+    userPreferences.last_dismissed_updates,
   );
 
   const handleOnChangeDismiss = (checked: boolean) => {
@@ -67,7 +69,7 @@ export const UpdatesNotification = () => {
   const handleOnClose = () => {
     updateUserPreferences({
       last_dismissed_updates: availableUpdates?.apis_available_updates?.map(
-        (apiAvailableUpdates) => {
+        apiAvailableUpdates => {
           const {
             api_id,
             last_available_major,
@@ -80,7 +82,7 @@ export const UpdatesNotification = () => {
             last_minor: last_available_minor?.tag,
             last_patch: last_available_patch?.tag,
           };
-        }
+        },
       ),
       ...(dismissFutureUpdates ? { hide_update_notifications: true } : {}),
     });
@@ -89,55 +91,66 @@ export const UpdatesNotification = () => {
 
   return mustNotifyUser ? (
     <I18nProvider>
-      <EuiBottomBar className="wz-check-updates-bottom-bar">
-        <EuiFlexGroup justifyContent="spaceBetween" alignItems="center" gutterSize="m">
+      <EuiBottomBar
+        className={sideNavDocked ? 'wz-check-updates-bottom-bar' : ''}
+      >
+        <EuiFlexGroup
+          justifyContent='spaceBetween'
+          alignItems='center'
+          gutterSize='m'
+        >
           <EuiFlexItem grow={false}>
-            <EuiFlexGroup gutterSize="m" alignItems="center">
+            <EuiFlexGroup gutterSize='m' alignItems='center'>
               <EuiFlexItem grow={false} style={{ maxWidth: 'max-content' }}>
                 <EuiText>
                   <FormattedMessage
-                    id="wazuhCheckUpdates.updatesNotification.message"
-                    defaultMessage="New release is available!"
+                    id='wazuhCheckUpdates.updatesNotification.message'
+                    defaultMessage='New release is available!'
                   />
                 </EuiText>
               </EuiFlexItem>
               <EuiFlexItem grow={false} style={{ maxWidth: 'max-content' }}>
                 <RedirectAppLinks application={getCore().application}>
                   <EuiButtonEmpty
-                    color="ghost"
+                    color='ghost'
                     href={getCore().application.getUrlForApp('server-apis', {
                       path: '#/settings?tab=api',
                     })}
                   >
                     <FormattedMessage
-                      id="wazuhCheckUpdates.updatesNotification.linkText"
-                      defaultMessage="Go to the API configuration page for details"
+                      id='wazuhCheckUpdates.updatesNotification.linkText'
+                      defaultMessage='Go to the API configuration page for details'
                     />
                   </EuiButtonEmpty>
                 </RedirectAppLinks>
               </EuiFlexItem>
             </EuiFlexGroup>
           </EuiFlexItem>
           <EuiFlexItem grow={false}>
-            <EuiFlexGroup gutterSize="m" alignItems="center">
+            <EuiFlexGroup gutterSize='m' alignItems='center'>
               <EuiFlexItem grow={false}>
                 <EuiCheckbox
-                  id="check-dismiss-in-notification"
+                  id='check-dismiss-in-notification'
                   label={
                     <FormattedMessage
-                      id="wazuhCheckUpdates.updatesNotification.dismissCheckText"
-                      defaultMessage="Disable updates notifications"
+                      id='wazuhCheckUpdates.updatesNotification.dismissCheckText'
+                      defaultMessage='Disable updates notifications'
                     />
                   }
                   checked={dismissFutureUpdates}
-                  onChange={(e) => handleOnChangeDismiss(e.target.checked)}
+                  onChange={e => handleOnChangeDismiss(e.target.checked)}
                 />
               </EuiFlexItem>
               <EuiFlexItem grow={false} style={{ maxWidth: 'max-content' }}>
-                <EuiButton fill size="s" iconType="cross" onClick={() => handleOnClose()}>
+                <EuiButton
+                  fill
+                  size='s'
+                  iconType='cross'
+                  onClick={() => handleOnClose()}
+                >
                   <FormattedMessage
-                    id="wazuhCheckUpdates.updatesNotification.closeButtonText"
-                    defaultMessage="Dismiss"
+                    id='wazuhCheckUpdates.updatesNotification.closeButtonText'
+                    defaultMessage='Dismiss'
                   />
                 </EuiButton>
               </EuiFlexItem>

plugins/wazuh-core/public/hooks/index.ts

@@ -0,0 +1 @@
+export { useDockedSideNav } from './use-docked-side-nav';

plugins/wazuh-core/public/hooks/use-docked-side-nav.tsx

@@ -0,0 +1,20 @@
+import { useEffect, useState } from 'react';
+import { getChrome } from '../plugin-services';
+
+export const useDockedSideNav = () => {
+  const [sideNavDocked, setSideNavDocked] = useState<boolean>(false);
+
+  useEffect(() => {
+    const isNavDrawerSubscription = getChrome()
+      .getIsNavDrawerLocked$()
+      .subscribe((value: boolean) => {
+        setSideNavDocked(value);
+      });
+
+    return () => {
+      isNavDrawerSubscription.unsubscribe();
+    };
+  }, []);
+
+  return sideNavDocked;
+};

plugins/wazuh-core/public/plugin-services.ts

@@ -1,5 +1,11 @@
-import { CoreStart, IUiSettingsClient } from 'opensearch-dashboards/public';
+import {
+  ChromeStart,
+  CoreStart,
+  IUiSettingsClient,
+} from 'opensearch-dashboards/public';
 import { createGetterSetter } from '../../../src/plugins/opensearch_dashboards_utils/common';
 
+export const [getChrome, setChrome] = createGetterSetter<ChromeStart>('Chrome');
 export const [getCore, setCore] = createGetterSetter<CoreStart>('Core');
-export const [getUiSettings, setUiSettings] = createGetterSetter<IUiSettingsClient>('UiSettings');
+export const [getUiSettings, setUiSettings] =
+  createGetterSetter<IUiSettingsClient>('UiSettings');

plugins/wazuh-core/public/plugin.ts

@@ -1,7 +1,8 @@
 import { CoreSetup, CoreStart, Plugin } from 'opensearch-dashboards/public';
 import { WazuhCorePluginSetup, WazuhCorePluginStart } from './types';
-import { setCore, setUiSettings } from './plugin-services';
+import { setChrome, setCore, setUiSettings } from './plugin-services';
 import * as utils from './utils';
+import * as hooks from './hooks';
 
 export class WazuhCorePlugin
   implements Plugin<WazuhCorePluginSetup, WazuhCorePluginStart>
@@ -11,11 +12,13 @@ export class WazuhCorePlugin
   }
 
   public start(core: CoreStart): WazuhCorePluginStart {
+    setChrome(core.chrome);
     setCore(core);
     setUiSettings(core.uiSettings);
 
     return {
       utils,
+      hooks,
     };
   }
 

plugins/wazuh-core/public/types.ts

@@ -1,6 +1,7 @@
 export interface WazuhCorePluginSetup {}
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface WazuhCorePluginStart {
+  hooks: { useDockedSideNav: () => boolean };
   utils: { formatUIDate: (date: Date) => string };
 }