fix: links not working in empty list component

Author: awoloszyn22

src/components/Extensibility/ExtensibilityList.jsx

@@ -13,7 +13,7 @@ import { useGetCRbyPath } from './useGetCRbyPath';
 import ExtensibilityCreate from './ExtensibilityCreate';
 import {
   applyFormula,
-  getResourceDescAndUrl,
+  getResourceUrl,
   getTextSearchProperties,
   TranslationBundleContext,
   useCreateResourceDescription,
@@ -123,7 +123,7 @@ export const ExtensibilityListCore = ({
     defaultSearch: true,
   });
 
-  const { url: emptyListUrl } = getResourceDescAndUrl(description);
+  const { url: emptyListUrl } = getResourceUrl(description);
 
   return (
     <ResourcesList
@@ -142,7 +142,7 @@ export const ExtensibilityListCore = ({
           textSearchProperties(defaultSearchProperties),
       }}
       emptyListProps={{
-        subtitleText: newListProps?.description?.props?.i18nKey,
+        subtitleText: newListProps?.description,
         url: emptyListUrl,
       }}
     />

src/components/Extensibility/helpers/index.js

@@ -168,10 +168,9 @@ export const useCreateResourceDescription = (descID) => {
   }
 };
 
-export const getResourceDescAndUrl = (descID) => {
+export const getResourceUrl = (descID) => {
   if (!descID)
     return {
-      description: null,
       url: null,
     };
 
@@ -183,17 +182,11 @@ export const getResourceDescAndUrl = (descID) => {
 
     if (links?.length >= 1) {
       const matchedLink = links[0];
-      const processedTrans = trans.replace(
-        matchedLink.matchedText,
-        `<0>${matchedLink.urlText}</0>`,
-      );
       return {
-        description: processedTrans,
         url: matchedLink.url,
       };
     } else {
       return {
-        description: trans,
         url: null,
       };
     }

src/shared/components/EmptyListComponent/EmptyListComponent.tsx

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { Trans, useTranslation } from 'react-i18next';
+import { useTranslation } from 'react-i18next';
 import { Button, IllustratedMessage, Title } from '@ui5/webcomponents-react';
 import '@ui5/webcomponents-fiori/dist/illustrations/AllIllustrations';
 import { ExternalLink } from 'shared/components/ExternalLink/ExternalLink';
@@ -28,15 +28,6 @@ export const EmptyListComponent = ({
   image = 'NoEntries',
 }: EmptyListComponentProps) => {
   const { t } = useTranslation();
-  const subtitle = subtitleText ? (
-    <Trans
-      i18nKey={subtitleText}
-      defaults={subtitleText}
-      components={[<ExternalLink key={subtitleText} url={url} />]}
-    />
-  ) : (
-    ''
-  );
 
   if (showButton === undefined) {
     showButton = typeof onClick === 'function';
@@ -57,7 +48,9 @@ export const EmptyListComponent = ({
             {titleText}
           </Title>
         }
-        subtitle={<span className="sap-margin-top-small">{subtitle}</span>}
+        subtitle={
+          <span className="sap-margin-top-small">{subtitleText ?? ''}</span>
+        }
       >
         <div className="emptyListComponent__buttons">
           {showButton && <Button onClick={onClick}>{buttonText}</Button>}