Tempo: Update error messages (#70448)

Update error messages

public/app/plugins/datasource/tempo/QueryEditor/ServiceGraphSection.tsx

@@ -98,7 +98,8 @@ export function ServiceGraphSection({
           <a
             target="_blank"
             rel="noreferrer noopener"
-            href="https://grafana.com/docs/tempo/next/grafana-agent/service-graphs/"
+            href="https://grafana.com/docs/grafana/latest/datasources/tempo/#service-graph"
+            className={styles.link}
           >
             Tempo documentation
           </a>
@@ -133,4 +134,8 @@ const getStyles = (theme: GrafanaTheme2) => ({
     max-width: 75ch;
     margin-top: ${theme.spacing(2)};
   `,
+  link: css`
+    color: ${theme.colors.text.link};
+    text-decoration: underline;
+  `,
 });

public/app/plugins/datasource/tempo/configuration/TraceQLSearchTags.tsx

@@ -9,6 +9,7 @@ import { replaceAt } from '../SearchTraceQLEditor/utils';
 import { TraceqlFilter, TraceqlSearchScope } from '../dataquery.gen';
 import { TempoDatasource } from '../datasource';
 import { TempoJsonData } from '../types';
+import { getErrorMessage } from '../utils';
 
 interface Props extends DataSourcePluginOptionsEditorProps<TempoJsonData> {
   datasource?: TempoDatasource;
@@ -22,9 +23,9 @@ export function TraceQLSearchTags({ options, onOptionsChange, datasource }: Prop
 
     try {
       await datasource.languageProvider.start();
-    } catch (e) {
+    } catch (err) {
       // @ts-ignore
-      throw new Error(`${e.statusText}: ${e.data.error}`);
+      throw new Error(getErrorMessage(err.data.message, 'Unable to query Tempo'));
     }
   };
 

public/app/plugins/datasource/tempo/datasource.ts

@@ -59,6 +59,7 @@ import {
   createTableFrameFromTraceQlQuery,
 } from './resultTransformer';
 import { SearchQueryParams, TempoQuery, TempoJsonData } from './types';
+import { getErrorMessage } from './utils';
 
 export const DEFAULT_LIMIT = 20;
 
@@ -189,8 +190,8 @@ export class TempoDatasource extends DataSourceWithBackend<TempoQuery, TempoJson
                 data: [createTableFrameFromSearch(response.data.traces, this.instanceSettings)],
               };
             }),
-            catchError((error) => {
-              return of({ error: { message: error.data.message }, data: [] });
+            catchError((err) => {
+              return of({ error: { message: getErrorMessage(err.data.message) }, data: [] });
             })
           )
         );
@@ -233,8 +234,8 @@ export class TempoDatasource extends DataSourceWithBackend<TempoQuery, TempoJson
                   data: createTableFrameFromTraceQlQuery(response.data.traces, this.instanceSettings),
                 };
               }),
-              catchError((error) => {
-                return of({ error: { message: error.data.message }, data: [] });
+              catchError((err) => {
+                return of({ error: { message: getErrorMessage(err.data.message) }, data: [] });
               })
             )
           );
@@ -264,8 +265,8 @@ export class TempoDatasource extends DataSourceWithBackend<TempoQuery, TempoJson
                 data: createTableFrameFromTraceQlQuery(response.data.traces, this.instanceSettings),
               };
             }),
-            catchError((error) => {
-              return of({ error: { message: error.data.message }, data: [] });
+            catchError((err) => {
+              return of({ error: { message: getErrorMessage(err.data.message) }, data: [] });
             })
           )
         );
@@ -426,11 +427,19 @@ export class TempoDatasource extends DataSourceWithBackend<TempoQuery, TempoJson
       method: 'GET',
       url: `${this.instanceSettings.url}/api/echo`,
     };
-    const response = await lastValueFrom(getBackendSrv().fetch(options));
 
-    if (response?.ok) {
-      return { status: 'success', message: 'Data source is working' };
-    }
+    return await lastValueFrom(
+      getBackendSrv()
+        .fetch(options)
+        .pipe(
+          mergeMap(() => {
+            return of({ status: 'success', message: 'Data source successfully connected.' });
+          }),
+          catchError((err) => {
+            return of({ status: 'error', message: getErrorMessage(err.data.message, 'Unable to connect with Tempo') });
+          })
+        )
+    );
   }
 
   getQueryDisplayText(query: TempoQuery) {
@@ -522,7 +531,7 @@ function serviceMapQuery(request: DataQueryRequest<TempoQuery>, datasourceUid: s
     map((responses: DataQueryResponse[]) => {
       const errorRes = responses.find((res) => !!res.error);
       if (errorRes) {
-        throw new Error(errorRes.error!.message);
+        throw new Error(getErrorMessage(errorRes.error?.message));
       }
 
       const { nodes, edges } = mapPromMetricsToServiceMap(responses, request.range);
@@ -578,7 +587,7 @@ function rateQuery(
     map((responses: DataQueryResponse[]) => {
       const errorRes = responses.find((res) => !!res.error);
       if (errorRes) {
-        throw new Error(errorRes.error!.message);
+        throw new Error(getErrorMessage(errorRes.error?.message));
       }
       return {
         data: [responses[0]?.data ?? [], serviceMapResponse.data[0], serviceMapResponse.data[1]],
@@ -633,7 +642,7 @@ function errorAndDurationQuery(
     map((errorAndDurationResponse: DataQueryResponse[]) => {
       const errorRes = errorAndDurationResponse.find((res) => !!res.error);
       if (errorRes) {
-        throw new Error(errorRes.error!.message);
+        throw new Error(getErrorMessage(errorRes.error?.message));
       }
 
       const serviceGraphView = getServiceGraphView(

public/app/plugins/datasource/tempo/utils.ts

@@ -0,0 +1,5 @@
+export const getErrorMessage = (message: string | undefined, prefix?: string) => {
+  const err = message ? ` (${message})` : '';
+  let errPrefix = prefix ? prefix : 'Error';
+  return `${errPrefix}${err}. Please check the server logs for more details.`;
+};