undo lastValueFrom change, fix jest tests, apply review feedback

src/plugins/embeddable/public/lib/embeddables/embeddable.tsx

@@ -9,7 +9,7 @@
 import fastIsEqual from 'fast-deep-equal';
 import { cloneDeep } from 'lodash';
 import * as Rx from 'rxjs';
-import { lastValueFrom, merge } from 'rxjs';
+import { merge } from 'rxjs';
 import { debounceTime, distinctUntilChanged, map, skip } from 'rxjs/operators';
 import { RenderCompleteDispatcher } from '@kbn/kibana-utils-plugin/public';
 import { Adapters } from '../types';
@@ -346,7 +346,13 @@ export abstract class Embeddable<
   }
 
   public async untilInitializationFinished(): Promise<void> {
-    return lastValueFrom(this.initializationFinished);
+    return new Promise((resolve) => {
+      this.initializationFinished.subscribe({
+        complete: () => {
+          resolve();
+        },
+      });
+    });
   }
 
   /**

src/plugins/presentation_panel/public/panel_actions/customize_panel_action/custom_time_range_badge.test.ts

@@ -54,8 +54,8 @@ describe('custom time range badge action', () => {
   it('calls onChange when time range changes', () => {
     const onChange = jest.fn();
     updateTimeRange(mockTimeRange);
-    updateTimeRange(undefined);
     action.subscribeToCompatibilityChanges(context, onChange);
+    updateTimeRange(undefined);
     expect(onChange).toHaveBeenCalledWith(false, action);
   });
 });

src/plugins/presentation_panel/public/panel_actions/edit_panel_action/edit_panel_action.test.tsx

@@ -64,8 +64,8 @@ describe('Edit panel action', () => {
 
   it('calls onChange when view mode changes', () => {
     const onChange = jest.fn();
-    updateViewMode('view');
     action.subscribeToCompatibilityChanges(context, onChange);
+    updateViewMode('view');
     expect(onChange).toHaveBeenCalledWith(false, action);
   });
 });

src/plugins/presentation_panel/public/panel_component/presentation_panel.tsx

@@ -16,6 +16,7 @@ import useAsync from 'react-use/lib/useAsync';
 import { untilPluginStartServicesReady } from '../kibana_services';
 import { PresentationPanelError } from './presentation_panel_error';
 import { DefaultPresentationPanelApi, PresentationPanelProps } from './types';
+import { getErrorLoadingPanel } from './presentation_panel_strings';
 
 export const PresentationPanel = <
   ApiType extends DefaultPresentationPanelApi = DefaultPresentationPanelApi,
@@ -37,15 +38,15 @@ export const PresentationPanel = <
     return { Panel, unwrappedComponent };
   }, []);
 
-  if (error) {
+  if (error || (!loading && (!value?.Panel || !value?.unwrappedComponent))) {
     return (
       <EuiFlexGroup
         alignItems="center"
         className="eui-fullHeight embPanel__error"
         data-test-subj="embeddableError"
         justifyContent="center"
       >
-        <PresentationPanelError error={error} />
+        <PresentationPanelError error={error ?? new Error(getErrorLoadingPanel())} />
       </EuiFlexGroup>
     );
   }

src/plugins/presentation_panel/public/panel_component/presentation_panel_strings.ts

@@ -30,6 +30,11 @@ export const getErrorCallToAction = (title: string) =>
     values: { value: title },
   });
 
+export const getErrorLoadingPanel = () =>
+  i18n.translate('presentationPanel.error.errorWhenLoadingPanel', {
+    defaultMessage: 'An error occurred while loading this panel.',
+  });
+
 export const getEditTitleAriaLabel = (title?: string) =>
   i18n.translate('presentationPanel.header.titleAriaLabel', {
     defaultMessage: 'Click to edit title: {title}',