From 2a636a95b8efcb95a75b5a77cbc9f186e4beeed0 Mon Sep 17 00:00:00 2001
From: Patrik Oldsberg <poldsberg@gmail.com>
Date: Tue, 14 Nov 2023 10:55:54 +0100
Subject: [PATCH] catalog: switch table srOnly labels back to Typography

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
---
 .../src/components/CatalogTable/CatalogTable.tsx       | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/plugins/catalog/src/components/CatalogTable/CatalogTable.tsx b/plugins/catalog/src/components/CatalogTable/CatalogTable.tsx
index 4e338b5205..04584f688a 100644
--- a/plugins/catalog/src/components/CatalogTable/CatalogTable.tsx
+++ b/plugins/catalog/src/components/CatalogTable/CatalogTable.tsx
@@ -34,6 +34,7 @@ import {
   useEntityList,
   useStarredEntities,
 } from '@backstage/plugin-catalog-react';
+import Typography from '@material-ui/core/Typography';
 import { withStyles } from '@material-ui/core/styles';
 import { visuallyHidden } from '@mui/utils';
 import Edit from '@material-ui/icons/Edit';
@@ -146,8 +147,7 @@ export const CatalogTable = (props: CatalogTableProps) => {
       return {
         icon: () => (
           <>
-            {/* eslint-disable-next-line react/forbid-elements */}
-            <span style={visuallyHidden}>{title}</span>
+            <Typography style={visuallyHidden}>{title}</Typography>
             <OpenInNew fontSize="small" />
           </>
         ),
@@ -166,8 +166,7 @@ export const CatalogTable = (props: CatalogTableProps) => {
       return {
         icon: () => (
           <>
-            {/* eslint-disable-next-line react/forbid-elements */}
-            <span style={visuallyHidden}>{title}</span>
+            <Typography style={visuallyHidden}>{title}</Typography>
             <Edit fontSize="small" />
           </>
         ),
@@ -187,8 +186,7 @@ export const CatalogTable = (props: CatalogTableProps) => {
         cellStyle: { paddingLeft: '1em' },
         icon: () => (
           <>
-            {/* eslint-disable-next-line react/forbid-elements */}
-            <span style={visuallyHidden}>{title}</span>
+            <Typography style={visuallyHidden}>{title}</Typography>
             {isStarred ? <YellowStar /> : <StarBorder />}
           </>
         ),