From 9cbfe00c5c988198aafcbab95e4c1531d241e1a2 Mon Sep 17 00:00:00 2001
From: Julio Zynger <julio.zynger@soundcloud.com>
Date: Tue, 1 Mar 2022 14:17:28 +0100
Subject: [PATCH] Use ResponseErrorPanel

Signed-off-by: Julio Zynger <julio.zynger@soundcloud.com>
---
 .../components/PeriskopErrorsTable/PeriskopErrorsTable.tsx    | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/periskop/src/components/PeriskopErrorsTable/PeriskopErrorsTable.tsx b/plugins/periskop/src/components/PeriskopErrorsTable/PeriskopErrorsTable.tsx
index 2292ed0013..e7044a7037 100644
--- a/plugins/periskop/src/components/PeriskopErrorsTable/PeriskopErrorsTable.tsx
+++ b/plugins/periskop/src/components/PeriskopErrorsTable/PeriskopErrorsTable.tsx
@@ -25,6 +25,7 @@ import {
   Table,
   TableColumn,
   Progress,
+  ResponseErrorPanel,
   StatusWarning,
   StatusError,
   StatusPending,
@@ -32,7 +33,6 @@ import {
   EmptyState,
   Link,
 } from '@backstage/core-components';
-import Alert from '@material-ui/lab/Alert';
 import useAsync from 'react-use/lib/useAsync';
 import { periskopApiRef } from '../..';
 import { AggregatedError, NotFoundInInstance } from '../../types';
@@ -102,7 +102,7 @@ export const PeriskopErrorsTable = () => {
   if (loading) {
     return <Progress />;
   } else if (error) {
-    return <Alert severity="error">{error.message}</Alert>;
+    return <ResponseErrorPanel error={error} />;
   }
 
   const columns: TableColumn<AggregatedError>[] = [