[Dashboards] Fix backups service

src/platform/plugins/shared/dashboard/jest_setup.ts

@@ -24,9 +24,10 @@ setStubLogger();
 // Start the kibana services with stubs
 setStubKibanaServices();
 
-jest.mock('./public/services/dashboard_backup_service', () => {
+jest.mock('./public/services/dashboard_api_services', () => {
   return {
     getDashboardBackupService: () => mockDashboardBackupService,
+    initializeDashboardApiServices: () => jest.fn(),
   };
 });
 

src/platform/plugins/shared/dashboard/public/dashboard_api/load_dashboard_api/load_dashboard_api.test.ts

@@ -55,7 +55,7 @@ describe('loadDashboardApi', () => {
     });
 
     // eslint-disable-next-line @typescript-eslint/no-var-requires
-    require('../../services/dashboard_backup_service').getDashboardBackupService = () => ({
+    require('../../services/dashboard_api_services').getDashboardBackupService = () => ({
       getState: () => ({
         query: lastSavedQuery,
       }),

src/platform/plugins/shared/dashboard/public/dashboard_api/load_dashboard_api/load_dashboard_api.ts

@@ -12,7 +12,6 @@ import { dashboardClient } from '../../dashboard_client';
 import { getPanelSettings } from '../../panel_placement/get_panel_placement_settings';
 import { DEFAULT_PANEL_PLACEMENT_SETTINGS } from '../../plugin_constants';
 import { getAccessControlClient } from '../../services/access_control_service';
-import { getDashboardBackupService } from '../../services/dashboard_backup_service';
 import { coreServices } from '../../services/kibana_services';
 import { logger } from '../../services/logger';
 import { getLastSavedState } from '../default_dashboard_state';
@@ -22,6 +21,10 @@ import { startQueryPerformanceTracking } from '../performance/query_performance_
 import type { DashboardCreationOptions } from '../types';
 import { getUserAccessControlData } from './get_user_access_control_data';
 import { transformPanels } from './transform_panels';
+import {
+  getDashboardBackupService,
+  initializeDashboardApiServices,
+} from '../../services/dashboard_api_services';
 
 export async function loadDashboardApi({
   getCreationOptions,
@@ -65,6 +68,7 @@ export async function loadDashboardApi({
     return;
   }
 
+  await initializeDashboardApiServices();
   const unsavedChanges = creationOptions?.useSessionStorageIntegration
     ? getDashboardBackupService().getState(savedObjectId)
     : undefined;

src/platform/plugins/shared/dashboard/public/dashboard_api/save_modal/save_dashboard.ts

@@ -8,7 +8,7 @@
  */
 
 import { i18n } from '@kbn/i18n';
-import { getDashboardBackupService } from '../../services/dashboard_backup_service';
+import { getDashboardBackupService } from '../../services/dashboard_api_services';
 import { coreServices } from '../../services/kibana_services';
 import { dashboardClient } from '../../dashboard_client';
 import type { SaveDashboardProps, SaveDashboardReturn } from './types';

src/platform/plugins/shared/dashboard/public/dashboard_api/unsaved_changes_manager.test.ts

@@ -22,8 +22,6 @@ import type { initializeProjectRoutingManager } from './project_routing_manager'
 import type { DashboardPanel } from '../../server';
 import { getSampleDashboardState } from '../mocks';
 
-jest.mock('../services/dashboard_backup_service', () => ({}));
-
 const setStateMock = () => {};
 
 const layoutUnsavedChanges$ = new BehaviorSubject<{ panels?: DashboardState['panels'] }>({});
@@ -81,7 +79,7 @@ describe('unsavedChangesManager', () => {
     layoutUnsavedChanges$.next({});
 
     // eslint-disable-next-line @typescript-eslint/no-var-requires
-    require('../services/dashboard_backup_service').getDashboardBackupService = () => ({
+    require('../services/dashboard_api_services').getDashboardBackupService = () => ({
       setState: setBackupStateMock,
     });
   });

src/platform/plugins/shared/dashboard/public/dashboard_api/unsaved_changes_manager.ts

@@ -18,10 +18,8 @@ import type {
 
 import { of } from 'rxjs';
 import type { DashboardState } from '../../common';
-import {
-  getDashboardBackupService,
-  type DashboardBackupState,
-} from '../services/dashboard_backup_service';
+import { type DashboardBackupState } from '../services/dashboard_backup_service';
+import { getDashboardBackupService } from '../services/dashboard_api_services';
 import type { initializeLayoutManager } from './layout_manager';
 import type { initializeProjectRoutingManager } from './project_routing_manager';
 import type { initializeSettingsManager } from './settings_manager';

src/platform/plugins/shared/dashboard/public/dashboard_api/view_mode_manager.ts

@@ -13,7 +13,7 @@ import { BehaviorSubject } from 'rxjs';
 import type { SavedObjectAccessControl } from '@kbn/core-saved-objects-common';
 import type { DashboardUser } from './types';
 import { getAccessControlClient } from '../services/access_control_service';
-import { getDashboardBackupService } from '../services/dashboard_backup_service';
+import { getDashboardBackupService } from '../services/dashboard_api_services';
 import { getDashboardCapabilities } from '../utils/get_dashboard_capabilities';
 
 export function initializeViewModeManager({

src/platform/plugins/shared/dashboard/public/dashboard_app/no_data/dashboard_app_no_data.tsx

@@ -29,7 +29,7 @@ import {
   shareService,
   lensService,
 } from '../../services/kibana_services';
-import { getDashboardBackupService } from '../../services/dashboard_backup_service';
+import { getDashboardBackupService } from '../../services/dashboard_api_services';
 import { dashboardClient } from '../../dashboard_client';
 
 export const DashboardAppNoDataPage = ({

src/platform/plugins/shared/dashboard/public/dashboard_app/top_nav/share/share_options_utils.ts

@@ -17,7 +17,7 @@ import type { LocatorPublic } from '@kbn/share-plugin/common';
 import { toStoredFilters } from '@kbn/as-code-filters-transforms';
 import { topNavStrings } from '../../_dashboard_app_strings';
 import type { DashboardLocatorParams } from '../../../../common';
-import { getDashboardBackupService } from '../../../services/dashboard_backup_service';
+import { getDashboardBackupService } from '../../../services/dashboard_api_services';
 import { dataService, shareService } from '../../../services/kibana_services';
 import { logger } from '../../../services/logger';
 import { getDashboardCapabilities } from '../../../utils/get_dashboard_capabilities';

src/platform/plugins/shared/dashboard/public/dashboard_app/top_nav/share/show_share_modal.test.tsx

@@ -9,7 +9,7 @@
 
 import type { Capabilities } from '@kbn/core/public';
 import type { DashboardLocatorParams, DashboardState } from '../../../../common/types';
-import { getDashboardBackupService } from '../../../services/dashboard_backup_service';
+import { getDashboardBackupService } from '../../../services/dashboard_api_services';
 import { shareService } from '../../../services/kibana_services';
 import { showPublicUrlSwitch, ShowShareModal } from './show_share_modal';
 import type { AccessControlClient } from '@kbn/content-management-access-control-public';

src/platform/plugins/shared/dashboard/public/dashboard_app/top_nav/use_dashboard_menu_items.tsx

@@ -26,7 +26,7 @@ import { UI_SETTINGS } from '../../../common/constants';
 import { useDashboardApi } from '../../dashboard_api/use_dashboard_api';
 import { confirmDiscardUnsavedChanges } from '../../dashboard_listing/confirm_overlays';
 import { openSettingsFlyout } from '../../dashboard_renderer/settings/open_settings_flyout';
-import { getDashboardBackupService } from '../../services/dashboard_backup_service';
+import { getDashboardBackupService } from '../../services/dashboard_api_services';
 import type { SaveDashboardReturn } from '../../dashboard_api/save_modal/types';
 import { coreServices, shareService, dataService } from '../../services/kibana_services';
 import { getDashboardCapabilities } from '../../utils/get_dashboard_capabilities';

src/platform/plugins/shared/dashboard/public/dashboard_listing/dashboard_listing_empty_prompt.tsx

@@ -17,11 +17,8 @@ import {
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
 import React, { useCallback, useMemo } from 'react';
-
-import {
-  DASHBOARD_PANELS_UNSAVED_ID,
-  getDashboardBackupService,
-} from '../services/dashboard_backup_service';
+import { DASHBOARD_PANELS_UNSAVED_ID } from '../services/dashboard_backup_service';
+import { getDashboardBackupService } from '../services/dashboard_api_services';
 import { coreServices } from '../services/kibana_services';
 import { getDashboardCapabilities } from '../utils/get_dashboard_capabilities';
 import {

src/platform/plugins/shared/dashboard/public/dashboard_listing/dashboard_unsaved_listing.test.tsx

@@ -13,10 +13,8 @@ import { I18nProvider } from '@kbn/i18n-react';
 import { render, waitFor, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 
-import {
-  DASHBOARD_PANELS_UNSAVED_ID,
-  getDashboardBackupService,
-} from '../services/dashboard_backup_service';
+import { DASHBOARD_PANELS_UNSAVED_ID } from '../services/dashboard_backup_service';
+import { getDashboardBackupService } from '../services/dashboard_api_services';
 import { coreServices } from '../services/kibana_services';
 import type { DashboardUnsavedListingProps } from './dashboard_unsaved_listing';
 import { DashboardUnsavedListing } from './dashboard_unsaved_listing';

src/platform/plugins/shared/dashboard/public/dashboard_listing/dashboard_unsaved_listing.tsx

@@ -18,19 +18,17 @@ import {
   EuiTitle,
   euiBreakpoint,
 } from '@elastic/eui';
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
 
 import type { ViewMode } from '@kbn/presentation-publishing';
 import { css } from '@emotion/react';
 import { useMemoCss } from '@kbn/css-utils/public/use_memo_css';
 import type { DashboardState } from '../../server';
-import {
-  DASHBOARD_PANELS_UNSAVED_ID,
-  getDashboardBackupService,
-} from '../services/dashboard_backup_service';
+import { DASHBOARD_PANELS_UNSAVED_ID } from '../services/dashboard_backup_service';
 import { dashboardUnsavedListingStrings, getNewDashboardTitle } from './_dashboard_listing_strings';
 import { confirmDiscardUnsavedChanges } from './confirm_overlays';
 import { findService } from '../dashboard_client';
+import { getDashboardBackupService } from '../services/dashboard_api_services';
 
 const unsavedItemStyles = {
   item: (euiThemeContext: UseEuiTheme) =>
@@ -82,7 +80,12 @@ const DashboardUnsavedItem = ({
     <div css={styles.item} key={id}>
       <EuiFlexGroup alignItems="center" gutterSize="none" css={styles.heading} responsive={false}>
         <EuiFlexItem grow={false}>
-          <EuiIcon color="text" css={styles.icon} type={title ? 'dashboardApp' : 'clock'} />
+          <EuiIcon
+            color="text"
+            css={styles.icon}
+            type={title ? 'dashboardApp' : 'clock'}
+            aria-hidden={true}
+          />
         </EuiFlexItem>
         <EuiFlexItem grow={false}>
           <EuiTitle size="xxs">
@@ -145,7 +148,6 @@ export const DashboardUnsavedListing = ({
   refreshUnsavedDashboards,
 }: DashboardUnsavedListingProps) => {
   const [items, setItems] = useState<UnsavedItemMap>({});
-  const dashboardBackupService = useMemo(() => getDashboardBackupService(), []);
 
   const onOpen = useCallback(
     (id?: string) => {
@@ -157,11 +159,11 @@ export const DashboardUnsavedListing = ({
   const onDiscard = useCallback(
     (id?: string) => {
       confirmDiscardUnsavedChanges(() => {
-        dashboardBackupService.clearState(id);
+        getDashboardBackupService().clearState(id);
         refreshUnsavedDashboards();
       });
     },
-    [dashboardBackupService, refreshUnsavedDashboards]
+    [refreshUnsavedDashboards]
   );
 
   useEffect(() => {
@@ -183,7 +185,7 @@ export const DashboardUnsavedListing = ({
           hasError = true;
           if (result.error && result.notFound) {
             // Save object not found error
-            dashboardBackupService.clearState(result.id);
+            getDashboardBackupService().clearState(result.id);
           }
           return map;
         }
@@ -202,7 +204,7 @@ export const DashboardUnsavedListing = ({
     return () => {
       canceled = true;
     };
-  }, [dashboardBackupService, refreshUnsavedDashboards, unsavedDashboardIds]);
+  }, [refreshUnsavedDashboards, unsavedDashboardIds]);
 
   return unsavedDashboardIds.length === 0 ? null : (
     <>

src/platform/plugins/shared/dashboard/public/dashboard_listing/hooks/use_dashboard_listing_table.test.tsx

@@ -8,12 +8,11 @@
  */
 
 import { renderHook, act } from '@testing-library/react';
-
-import { getDashboardBackupService } from '../../services/dashboard_backup_service';
 import { coreServices } from '../../services/kibana_services';
 import { confirmCreateWithUnsaved } from '../confirm_overlays';
 import type { DashboardSavedObjectUserContent } from '../types';
 import { useDashboardListingTable } from './use_dashboard_listing_table';
+import { getDashboardBackupService } from '../../services/dashboard_api_services';
 
 const clearStateMock = jest.fn();
 const getDashboardUrl = jest.fn();

src/platform/plugins/shared/dashboard/public/dashboard_listing/hooks/use_dashboard_listing_table.tsx

@@ -25,7 +25,6 @@ import {
   findService,
 } from '../../dashboard_client';
 import { getAccessControlClient } from '../../services/access_control_service';
-import { getDashboardBackupService } from '../../services/dashboard_backup_service';
 import { getDashboardRecentlyAccessedService } from '../../services/dashboard_recently_accessed_service';
 import { coreServices, savedObjectsTaggingService } from '../../services/kibana_services';
 import { logger } from '../../services/logger';
@@ -41,6 +40,7 @@ import {
 import { confirmCreateWithUnsaved } from '../confirm_overlays';
 import { DashboardListingEmptyPrompt } from '../dashboard_listing_empty_prompt';
 import type { DashboardSavedObjectUserContent } from '../types';
+import { getDashboardBackupService } from '../../services/dashboard_api_services';
 
 type GetDetailViewLink =
   TableListViewTableProps<DashboardSavedObjectUserContent>['getDetailViewLink'];
@@ -90,10 +90,8 @@ export const useDashboardListingTable = ({
   const [pageDataTestSubject, setPageDataTestSubject] = useState<string>();
   const [hasInitialFetchReturned, setHasInitialFetchReturned] = useState(false);
 
-  const dashboardBackupService = useMemo(() => getDashboardBackupService(), []);
-
   const [unsavedDashboardIds, setUnsavedDashboardIds] = useState<string[]>(
-    dashboardBackupService.getDashboardIdsWithUnsavedChanges()
+    getDashboardBackupService().getDashboardIdsWithUnsavedChanges()
   );
 
   const accessControlClient = getAccessControlClient();
@@ -102,15 +100,15 @@ export const useDashboardListingTable = ({
   const initialPageSize = coreServices.uiSettings.get(SAVED_OBJECTS_PER_PAGE_SETTING);
 
   const createItem = useCallback(() => {
-    if (useSessionStorageIntegration && dashboardBackupService.dashboardHasUnsavedEdits()) {
+    if (useSessionStorageIntegration && getDashboardBackupService().dashboardHasUnsavedEdits()) {
       confirmCreateWithUnsaved(() => {
-        dashboardBackupService.clearState();
+        getDashboardBackupService().clearState();
         goToDashboard();
       }, goToDashboard);
       return;
     }
     goToDashboard();
-  }, [dashboardBackupService, goToDashboard, useSessionStorageIntegration]);
+  }, [goToDashboard, useSessionStorageIntegration]);
 
   const updateItemMeta = useCallback(
     async ({ id, ...updatedState }: Parameters<Required<OpenContentEditorParams>['onSave']>[0]) => {
@@ -123,9 +121,9 @@ export const useDashboardListingTable = ({
         ...updatedState,
       });
 
-      setUnsavedDashboardIds(dashboardBackupService.getDashboardIdsWithUnsavedChanges());
+      setUnsavedDashboardIds(getDashboardBackupService().getDashboardIdsWithUnsavedChanges());
     },
-    [dashboardBackupService]
+    []
   );
 
   const contentEditorValidators: OpenContentEditorParams['customValidators'] = useMemo(
@@ -263,35 +261,32 @@ export const useDashboardListingTable = ({
     [listingLimit, accessControlClient]
   );
 
-  const deleteItems = useCallback(
-    async (dashboardsToDelete: Array<{ id: string }>) => {
-      try {
-        const deleteStartTime = window.performance.now();
+  const deleteItems = useCallback(async (dashboardsToDelete: Array<{ id: string }>) => {
+    try {
+      const deleteStartTime = window.performance.now();
 
-        await asyncMap(dashboardsToDelete, async ({ id }) => {
-          await dashboardClient.delete(id);
-          dashboardBackupService.clearState(id);
-        });
+      await asyncMap(dashboardsToDelete, async ({ id }) => {
+        await dashboardClient.delete(id);
+        getDashboardBackupService().clearState(id);
+      });
 
-        const deleteDuration = window.performance.now() - deleteStartTime;
-        reportPerformanceMetricEvent(coreServices.analytics, {
-          eventName: SAVED_OBJECT_DELETE_TIME,
-          duration: deleteDuration,
-          meta: {
-            saved_object_type: DASHBOARD_SAVED_OBJECT_TYPE,
-            total: dashboardsToDelete.length,
-          },
-        });
-      } catch (error) {
-        coreServices.notifications.toasts.addError(error, {
-          title: dashboardListingErrorStrings.getErrorDeletingDashboardToast(),
-        });
-      }
+      const deleteDuration = window.performance.now() - deleteStartTime;
+      reportPerformanceMetricEvent(coreServices.analytics, {
+        eventName: SAVED_OBJECT_DELETE_TIME,
+        duration: deleteDuration,
+        meta: {
+          saved_object_type: DASHBOARD_SAVED_OBJECT_TYPE,
+          total: dashboardsToDelete.length,
+        },
+      });
+    } catch (error) {
+      coreServices.notifications.toasts.addError(error, {
+        title: dashboardListingErrorStrings.getErrorDeletingDashboardToast(),
+      });
+    }
 
-      setUnsavedDashboardIds(dashboardBackupService.getDashboardIdsWithUnsavedChanges());
-    },
-    [dashboardBackupService]
-  );
+    setUnsavedDashboardIds(getDashboardBackupService().getDashboardIdsWithUnsavedChanges());
+  }, []);
 
   const editItem = useCallback(
     ({ id }: { id: string | undefined }) => goToDashboard(id, 'edit'),

src/platform/plugins/shared/dashboard/public/dashboard_listing/index.tsx

@@ -18,10 +18,11 @@ const ListingTableLoadingIndicator = () => {
 };
 
 const LazyDashboardListing = React.lazy(async () => {
-  const [{ DashboardListingTable }] = await Promise.all([
+  const [{ DashboardListingTable, initializeDashboardApiServices }] = await Promise.all([
     import('../dashboard_renderer/dashboard_module'),
     untilPluginStartServicesReady(),
   ]);
+  await initializeDashboardApiServices();
   return { default: DashboardListingTable };
 });
 

src/platform/plugins/shared/dashboard/public/dashboard_renderer/dashboard_module.ts

@@ -20,3 +20,4 @@ export { UnlinkFromLibraryAction } from '../dashboard_actions/library_unlink_act
 export { CopyToDashboardAction } from '../dashboard_actions/copy_to_dashboard_action';
 export { AddSectionAction } from '../dashboard_actions/add_section_action';
 export { dashboardDrilldown } from '../dashboard_drilldown/dashboard_drilldown';
+export { initializeDashboardApiServices } from '../services/dashboard_api_services';