[embeddable] fix PresentationPanelError component throws when error.m…

…essage is empty string (elastic#186098)

Closes elastic#186080

PR resolves issue by updating `Markdown` component to not throw when
`readOnly` and `content` is empty. Components should only throw on
catastrophic errors. In this case, Markdown can safely render an empty
markdown. This is a better out come then crashing an application.

### Test instructions
Follow steps from elastic#186095 and
verify dashboard does not crash

---------

Co-authored-by: Kibana Machine <[email protected]>

packages/shared-ux/markdown/impl/markdown.tsx

@@ -84,9 +84,6 @@ export const Markdown = ({
 
   // Render EuiMarkdownFormat when readOnly set to true
   if (readOnly) {
-    if (!children && !markdownContent) {
-      throw new Error('Markdown content is required in [readOnly] mode');
-    }
     return (
       <EuiMarkdownFormat
         textSize={'relative'}
@@ -99,7 +96,7 @@ export const Markdown = ({
         // There was a trick to pass style as a part of props in the legacy React <Markdown> component
         style={restProps.style}
       >
-        {children ?? markdownContent!}
+        {children ?? markdownContent ?? ''}
       </EuiMarkdownFormat>
     );
   }

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

@@ -0,0 +1,23 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import React from 'react';
+import { render, screen, waitFor } from '@testing-library/react';
+import { PresentationPanelError } from './presentation_panel_error';
+
+describe('PresentationPanelError', () => {
+  test('should display error', async () => {
+    render(<PresentationPanelError error={new Error('Simulated error')} />);
+    await waitFor(() => screen.getByTestId('errorMessageMarkdown'));
+  });
+
+  test('should display error with empty message', async () => {
+    render(<PresentationPanelError error={new Error('')} />);
+    await waitFor(() => screen.getByTestId('errorMessageMarkdown'));
+  });
+});

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

@@ -14,6 +14,7 @@ import { useStateFromPublishingSubject } from '@kbn/presentation-publishing';
 import { renderSearchError } from '@kbn/search-errors';
 import { Markdown } from '@kbn/shared-ux-markdown';
 import { Subscription } from 'rxjs';
+import { i18n } from '@kbn/i18n';
 import { editPanelAction } from '../panel_actions/panel_actions';
 import { getErrorCallToAction } from './presentation_panel_strings';
 import { DefaultPresentationPanelApi } from './types';
@@ -82,7 +83,11 @@ export const PresentationPanelError = ({
         searchErrorDisplay?.body ?? (
           <EuiText size="s">
             <Markdown data-test-subj="errorMessageMarkdown" readOnly>
-              {error.message}
+              {error.message?.length
+                ? error.message
+                : i18n.translate('presentationPanel.emptyErrorMessage', {
+                    defaultMessage: 'Error',
+                  })}
             </Markdown>
           </EuiText>
         )