fix(links): update CryostatLink to handle partial paths (#1567)

(cherry picked from commit cce8173)

src/app/Shared/Components/CryostatLink.tsx

@@ -14,10 +14,29 @@
  * limitations under the License.
  */
 
-import { toPath } from '@app/utils/utils';
+import { BASEPATH, toPath } from '@app/utils/utils';
 import React from 'react';
-import { Link } from 'react-router-dom-v5-compat';
+import { Link, LinkProps, Path, To } from 'react-router-dom-v5-compat';
 
-export const CryostatLink: React.FC<{ to: string; onClick? }> = ({ to, onClick, ...props }) => {
-  return <Link to={toPath(to)} onClick={onClick} {...props}></Link>;
+export interface CryostatLinkProps extends LinkProps {}
+
+/**
+ * Formats a To (string | Partial\<Path\>) by prepending a basepath if necessary
+ * @param {string | Partial<Path>} destination - the target destination
+ */
+const toDestination = (destination: To) => {
+  if (BASEPATH) {
+    if (typeof destination === 'string') {
+      return toPath(destination);
+    } else {
+      (destination as Partial<Path>).pathname = `/${BASEPATH}${(destination as Partial<Path>).pathname}`;
+      return destination as Partial<Path>;
+    }
+  } else {
+    return destination;
+  }
+};
+
+export const CryostatLink: React.FC<CryostatLinkProps> = ({ to, onClick, ...props }) => {
+  return <Link to={toDestination(to)} onClick={onClick} {...props}></Link>;
 };

src/app/Topology/Entity/EntityDetails.tsx

@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import { CryostatLink } from '@app/Shared/Components/CryostatLink';
 import { LinearDotSpinner } from '@app/Shared/Components/LinearDotSpinner';
 import { EnvironmentNode, MBeanMetrics, MBeanMetricsResponse, TargetNode } from '@app/Shared/Services/api.types';
 import { isTargetNode } from '@app/Shared/Services/api.utils';
@@ -50,7 +51,6 @@ import { css } from '@patternfly/react-styles';
 import { ExpandableRowContent, Table, Tbody, Td, Th, Thead, Tr } from '@patternfly/react-table';
 import { GraphElement, NodeStatus } from '@patternfly/react-topology';
 import * as React from 'react';
-import { Link } from 'react-router-dom-v5-compat';
 import { catchError, concatMap, map, of } from 'rxjs';
 import { EmptyText } from '../../Shared/Components/EmptyText';
 import { NodeAction } from '../Actions/types';
@@ -555,9 +555,9 @@ export const TargetResourceItem: React.FC<{
         />
         <Td key={`${resourceType}-resource-name`} dataLabel={'Resource'}>
           {
-            <Link {...getLinkPropsForTargetResource(resourceType)} onClick={switchTarget}>
+            <CryostatLink {...getLinkPropsForTargetResource(resourceType)} onClick={switchTarget}>
               {splitWordsOnUppercase(resourceType, true).join(' ')}
-            </Link>
+            </CryostatLink>
           }
         </Td>
         <Td key={`${resourceType}-resource-count`} dataLabel={'Total'} textCenter>