[Ingest Pipelines] Avoid show empty object in error message (#209093)

Fixes: https://github.com/elastic/kibana/issues/206989

## Summary

It seems that for some error responses, ES returns a string with an
empty object instead of a message. This is happening, for instance, when
the error is `Not found`. This PR ensures that some message is shown, if
message is present, it shows the message. Otherwise it shows the error
cause.

### Screenshots
| With message | Without message |
| --- | --- |
| <img width="1264" alt="Screenshot 2025-01-31 at 12 57 23"
src="https://github.com/user-attachments/assets/5fd9dd08-393d-4f00-9194-e9d359199684"
/> | <img width="1268" alt="Screenshot 2025-01-31 at 12 54 11"
src="https://github.com/user-attachments/assets/ad2cbf5d-5e78-4e68-b4d3-1a16c9a3d009"
/> |
| <img width="1260" alt="Screenshot 2025-01-31 at 12 58 31"
src="https://github.com/user-attachments/assets/fe355b78-e3c8-43fb-a2bb-aaa900232df7"
/> | <img width="1258" alt="Screenshot 2025-01-31 at 12 30 15"
src="https://github.com/user-attachments/assets/477e9267-f684-4233-92b5-bba1743de00c"
/>|
<img width="637" alt="Screenshot 2025-01-31 at 12 58 42"
src="https://github.com/user-attachments/assets/fd217688-3735-4147-ba11-84d7ac5062af"
/> | <img width="1260" alt="Screenshot 2025-01-31 at 12 29 39"
src="https://github.com/user-attachments/assets/12034a08-a3a0-4ab8-bfd1-99e657c7bd68"
/> |
<img width="909" alt="Screenshot 2025-01-31 at 12 58 48"
src="https://github.com/user-attachments/assets/ce24ad2c-7076-4f33-9e16-2cd9c782ef4f"
/> | <img width="1264" alt="Screenshot 2025-01-31 at 12 59 07"
src="https://github.com/user-attachments/assets/f3ffee16-7307-4362-bcbd-0d8661ffb8f0"
/> |




### How to test it:
* Navigate to the edit form for a non-existing pipeline
`app/management/ingest/ingest_pipelines/edit/non-existin-pipeline`
* Navigate to the clone form for a non-existing pipeline
`app/management/ingest/ingest_pipelines/create/non-existin-pipeline`

x-pack/platform/plugins/shared/ingest_pipelines/public/application/sections/pipelines_clone/pipelines_clone.tsx

@@ -13,6 +13,7 @@ import { FormattedMessage } from '@kbn/i18n-react';
 import { SectionLoading, useKibana, attemptToURIDecode } from '../../../shared_imports';
 
 import { PipelinesCreate } from '../pipelines_create';
+import { getErrorText } from '../utils';
 
 export interface ParamProps {
   sourceName: string;
@@ -36,7 +37,7 @@ export const PipelinesClone: FunctionComponent<RouteComponentProps<ParamProps>>
 
   useEffect(() => {
     if (error && !isLoading) {
-      services.notifications!.toasts.addError(error, {
+      services.notifications!.toasts.addError(new Error(getErrorText(error)), {
         title: i18n.translate('xpack.ingestPipelines.clone.loadSourcePipelineErrorTitle', {
           defaultMessage: 'Cannot load {name}.',
           values: { name: sourceName },

x-pack/platform/plugins/shared/ingest_pipelines/public/application/sections/pipelines_edit/pipelines_edit.tsx

@@ -23,6 +23,7 @@ import { useKibana, SectionLoading, attemptToURIDecode } from '../../../shared_i
 import { getListPath } from '../../services/navigation';
 import { PipelineForm } from '../../components';
 import { useRedirectToPathOrRedirectPath } from '../../hooks';
+import { getErrorText } from '../utils';
 
 interface MatchParams {
   name: string;
@@ -136,7 +137,7 @@ export const PipelinesEdit: React.FunctionComponent<RouteComponentProps<MatchPar
             />
           </h2>
         }
-        body={<p>{error.message}</p>}
+        body={<p>{getErrorText(error)}</p>}
         actions={
           <EuiButton onClick={resendRequest} iconType="refresh" color="danger">
             <FormattedMessage

x-pack/platform/plugins/shared/ingest_pipelines/public/application/sections/pipelines_list/main.tsx

@@ -40,6 +40,7 @@ import { PipelineTable } from './table';
 import { PipelineDetailsFlyout } from './details_flyout';
 import { PipelineNotFoundFlyout } from './not_found_flyout';
 import { PipelineDeleteModal } from './delete_modal';
+import { getErrorText } from '../utils';
 
 const getPipelineNameFromLocation = (location: Location) => {
   const { pipeline } = parse(location.search.substring(1));
@@ -114,7 +115,7 @@ export const PipelinesList: React.FunctionComponent<RouteComponentProps> = ({
             />
           </h2>
         }
-        body={<p>{error.message}</p>}
+        body={<p>{getErrorText(error)}</p>}
         actions={
           <EuiButton onClick={resendRequest} iconType="refresh" color="danger">
             <FormattedMessage

x-pack/platform/plugins/shared/ingest_pipelines/public/application/sections/utils.test.ts

@@ -0,0 +1,36 @@
+/*
+ * 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; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { getErrorText } from './utils';
+
+describe('getErrorText', () => {
+  it('it returns the message if present', () => {
+    expect(
+      getErrorText({
+        error: 'Some error',
+        message: 'Some message',
+      })
+    ).toBe('Some message');
+  });
+
+  it('it returns the error if no message', () => {
+    expect(
+      getErrorText({
+        error: 'Some error',
+      })
+    ).toBe('Some error');
+  });
+
+  it('it returns the error if message is empty', () => {
+    expect(
+      getErrorText({
+        error: 'Some error',
+        message: '{}',
+      })
+    ).toBe('Some error');
+  });
+});

x-pack/platform/plugins/shared/ingest_pipelines/public/application/sections/utils.ts

@@ -0,0 +1,12 @@
+/*
+ * 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; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { Error } from '../../shared_imports';
+
+export const getErrorText = (error: Error) => {
+  return error.message && error.message !== '{}' ? error.message : error.error;
+};

x-pack/platform/plugins/shared/ingest_pipelines/public/application/services/api.ts

@@ -15,6 +15,7 @@ import {
   SendRequestResponse,
   sendRequest as _sendRequest,
   useRequest as _useRequest,
+  Error as _Error,
 } from '../../shared_imports';
 import { UiMetricService } from './ui_metric';
 import {
@@ -29,7 +30,7 @@ export class ApiService {
   private client: HttpSetup | undefined;
   private uiMetricService: UiMetricService | undefined;
 
-  private useRequest<R = any, E = Error>(config: UseRequestConfig) {
+  private useRequest<R = any, E = _Error>(config: UseRequestConfig) {
     if (!this.client) {
       throw new Error('Api service has not be initialized.');
     }