[Discover] Fix Discover tab initialization

src/platform/plugins/shared/discover/public/application/main/components/single_tab_view/initialization_error.tsx

@@ -10,13 +10,23 @@
 import { SavedObjectNotFound } from '@kbn/kibana-utils-plugin/public';
 import useMount from 'react-use/lib/useMount';
 import { redirectWhenMissing } from '@kbn/kibana-utils-plugin/public';
-import React from 'react';
+import React, { useMemo } from 'react';
+import type { SerializedError } from '@reduxjs/toolkit';
 import { useDiscoverServices } from '../../../../hooks/use_discover_services';
 import { BrandedLoadingIndicator } from './branded_loading_indicator';
 import { useInternalStateSelector } from '../../state_management/redux';
 import { DiscoverError } from '../../../../components/common/error_alert';
 
-export const InitializationError = ({ error }: { error: Error }) => {
+export const InitializationError = ({
+  error: originalError,
+}: {
+  error: Error | SerializedError;
+}) => {
+  const error = useMemo(
+    () => (originalError instanceof Error ? originalError : new Error(originalError.message)),
+    [originalError]
+  );
+
   if (error instanceof SavedObjectNotFound) {
     return <RedirectWhenSavedObjectNotFound error={error} />;
   }

src/platform/plugins/shared/discover/public/application/main/components/single_tab_view/single_tab_view.tsx

@@ -10,6 +10,7 @@
 import React, { useEffect } from 'react';
 import { type IKbnUrlStateStorage } from '@kbn/kibana-utils-plugin/public';
 import type { DataView, DataViewSpec } from '@kbn/data-views-plugin/common';
+import useLatest from 'react-use/lib/useLatest';
 import { createDataViewDataSource } from '../../../../../common/data_sources';
 import type { MainHistoryLocationState } from '../../../../../common';
 import { useDiscoverServices } from '../../../../hooks/use_discover_services';
@@ -24,6 +25,7 @@ import {
   useCurrentTabRuntimeState,
   useCurrentTabSelector,
   useCurrentTabAction,
+  TabInitializationStatus,
 } from '../../state_management/redux';
 import type {
   CustomizationCallback,
@@ -38,7 +40,6 @@ import { NoDataPage } from './no_data_page';
 import { DiscoverMainProvider } from '../../state_management/discover_state_provider';
 import { BrandedLoadingIndicator } from './branded_loading_indicator';
 import { DiscoverMainApp } from './main_app';
-import { useAsyncFunction } from '../../hooks/use_async_function';
 import { ScopedServicesProvider } from '../../../../components/scoped_services_provider';
 import { HideTabsBar } from '../tabs_view/hide_tabs_bar';
 import { InitializationError } from './initialization_error';
@@ -53,15 +54,6 @@ export interface SingleTabViewProps {
   searchSessionManager: DiscoverSearchSessionManager;
 }
 
-interface SessionInitializationState {
-  showNoDataPage: boolean;
-}
-
-type InitializeSingleSession = (options?: {
-  dataViewSpec?: DataViewSpec | undefined;
-  defaultUrlState?: DiscoverAppState;
-}) => Promise<SessionInitializationState>;
-
 export const SingleTabView = ({
   customizationContext,
   customizationCallbacks,
@@ -73,8 +65,9 @@ export const SingleTabView = ({
   const dispatch = useInternalStateDispatch();
   const services = useDiscoverServices();
 
-  const initializationState = useInternalStateSelector((state) => state.initializationState);
+  const appInitializationState = useInternalStateSelector((state) => state.initializationState);
   const currentTabId = useCurrentTabSelector((tab) => tab.id);
+  const currentTabInitializationState = useCurrentTabSelector((tab) => tab.initializationState);
   const currentStateContainer = useCurrentTabRuntimeState(
     runtimeStateManager,
     (tab) => tab.stateContainer$
@@ -98,8 +91,14 @@ export const SingleTabView = ({
   const adHocDataViews = useRuntimeState(runtimeStateManager.adHocDataViews$);
 
   const initializeSingleTab = useCurrentTabAction(internalStateActions.initializeSingleTab);
-  const [initializeTabState, initializeTab] = useAsyncFunction<InitializeSingleSession>(
-    async ({ dataViewSpec, defaultUrlState } = {}) => {
+  const initializeTab = useLatest(
+    async ({
+      dataViewSpec,
+      defaultUrlState,
+    }: {
+      dataViewSpec?: DataViewSpec | undefined;
+      defaultUrlState?: DiscoverAppState;
+    } = {}) => {
       const stateContainer = getDiscoverStateContainer({
         tabId: currentTabId,
         services,
@@ -115,7 +114,7 @@ export const SingleTabView = ({
         services,
       });
 
-      return dispatch(
+      dispatch(
         initializeSingleTab({
           initializeSingleTabParams: {
             stateContainer,
@@ -125,38 +124,31 @@ export const SingleTabView = ({
           },
         })
       );
-    },
-    currentStateContainer && currentCustomizationService
-      ? { loading: false, value: { showNoDataPage: false } }
-      : { loading: true }
+    }
   );
 
   useEffect(() => {
-    if (!currentStateContainer && !currentCustomizationService) {
+    if (currentTabInitializationState.initializationStatus === TabInitializationStatus.NotStarted) {
       const historyLocationState = services.getScopedHistory<
         MainHistoryLocationState & { defaultState?: DiscoverAppState }
       >()?.location.state;
 
-      initializeTab({
+      initializeTab.current({
         dataViewSpec: historyLocationState?.dataViewSpec,
         defaultUrlState: historyLocationState?.defaultState,
       });
     }
-  }, [currentCustomizationService, currentStateContainer, initializeTab, services]);
-
-  if (initializeTabState.loading) {
-    return <BrandedLoadingIndicator />;
-  }
+  }, [currentTabInitializationState.initializationStatus, initializeTab, services]);
 
-  if (initializeTabState.error) {
-    return <InitializationError error={initializeTabState.error} />;
+  if (currentTabInitializationState.initializationStatus === TabInitializationStatus.Error) {
+    return <InitializationError error={currentTabInitializationState.error} />;
   }
 
-  if (initializeTabState.value.showNoDataPage) {
+  if (currentTabInitializationState.initializationStatus === TabInitializationStatus.NoData) {
     return (
       <HideTabsBar>
         <NoDataPage
-          {...initializationState}
+          {...appInitializationState}
           onDataViewCreated={async (dataViewUnknown) => {
             await dispatch(internalStateActions.loadDataViewList());
             dispatch(
@@ -166,14 +158,14 @@ export const SingleTabView = ({
               })
             );
             const dataView = dataViewUnknown as DataView;
-            initializeTab({
+            initializeTab.current({
               defaultUrlState: dataView.id
                 ? { dataSource: createDataViewDataSource({ dataViewId: dataView.id }) }
                 : undefined,
             });
           }}
           onESQLNavigationComplete={() => {
-            initializeTab();
+            initializeTab.current();
           }}
         />
       </HideTabsBar>

src/platform/plugins/shared/discover/public/application/main/components/tabs_view/use_preview_data.ts

@@ -172,7 +172,7 @@ const getPreviewDataObservable = (
           }
 
           return {
-            status: getPreviewStatus(fetchStatus),
+            status: tabState.forceFetchOnSelect ? TabStatus.DEFAULT : getPreviewStatus(fetchStatus),
             query: getPreviewQuery(tabState.appState.query, derivedDataViewName),
             title: getPreviewTitle(tabState.appState.query, derivedDataViewName),
           };