Handle linking to unregistered hosts (#1560)

* Handle linking to unregistered hosts

* Add host link test for unregistered nodes

* Add ClusterNodeLink component

* Use ClusterNodeLink component for cluster node linking

assets/js/components/ClusterDetails/AscsErsClusterDetails.jsx

@@ -6,7 +6,7 @@ import Table from '@components/Table';
 import ListView from '@components/ListView';
 import ProviderLabel from '@components/ProviderLabel';
 import DottedPagination from '@components/DottedPagination';
-import HostLink from '@components/HostLink';
+import ClusterNodeLink from '@components/ClusterDetails/ClusterNodeLink';
 import SapSystemLink from '@components/SapSystemLink';
 import { renderEnsaVersion } from '@components/SapSystemDetails';
 
@@ -23,7 +23,9 @@ const nodeDetailsConfig = {
     {
       title: 'Hostname',
       key: '',
-      render: (_, { id, name }) => <HostLink hostId={id}>{name}</HostLink>,
+      render: (_, { id, name }) => (
+        <ClusterNodeLink hostId={id}>{name}</ClusterNodeLink>
+      ),
     },
     {
       title: 'Role',

assets/js/components/ClusterDetails/AscsErsClusterDetails.stories.jsx

@@ -76,6 +76,18 @@ export const Single = {
   ),
 };
 
+export const WithUnregisteredHost = {
+  args: {
+    ...Single.args,
+    hosts: Single.args.hosts.slice(0, 1),
+  },
+  render: (args) => (
+    <ContainerWrapper>
+      <AscsErsClusterDetails {...args} />
+    </ContainerWrapper>
+  ),
+};
+
 export const MultiSID = {
   args: {
     ...Single.args,

assets/js/components/ClusterDetails/AscsErsClusterDetails.test.jsx

@@ -104,13 +104,7 @@ describe('ClusterDetails AscsErsClusterDetails component', () => {
 
     nodes.forEach(
       async (
-        {
-          id: clusterID,
-          name: nodeName,
-          role,
-          virtual_ip: virtualIp,
-          filesysten,
-        },
+        { id: hostId, name: nodeName, role, virtual_ip: virtualIp, filesysten },
         index
       ) => {
         await waitFor(() => {
@@ -119,7 +113,7 @@ describe('ClusterDetails AscsErsClusterDetails component', () => {
           expect(hostnameCell).toHaveTextContent(nodeName);
           expect(hostnameCell)
             .querySelector('a')
-            .toHaveAttributes('href', clusterID);
+            .toHaveAttributes('href', hostId);
           expect(row.querySelector('td:nth-child(1)')).toHaveTextContent(role);
           expect(row.querySelector('td:nth-child(2)')).toHaveTextContent(
             virtualIp
@@ -200,4 +194,32 @@ describe('ClusterDetails AscsErsClusterDetails component', () => {
     expect(sidContainer).toHaveTextContent(sid);
     expect(sidContainer.querySelector('a')).toBeNull();
   });
+
+  it('should not display a host link for unregistered hosts', () => {
+    const {
+      name,
+      cib_last_written: cibLastWritten,
+      provider,
+      details,
+    } = clusterFactory.build({ type: 'ascs_ers' });
+
+    const hosts = buildHostsFromAscsErsClusterDetails(details);
+    const unregisteredHost = hosts.pop();
+
+    renderWithRouter(
+      <AscsErsClusterDetails
+        clusterName={name}
+        hosts={hosts}
+        cibLastWritten={cibLastWritten}
+        provider={provider}
+        sapSystems={[]}
+        details={details}
+      />
+    );
+    const unregisteredHostContainer = screen.getByText(
+      unregisteredHost.hostname
+    );
+
+    expect(unregisteredHostContainer).not.toHaveAttribute('href');
+  });
 });

assets/js/components/ClusterDetails/ClusterNodeLink.jsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import { EOS_WARNING_OUTLINED } from 'eos-icons-react';
+
+import Tooltip from '@components/Tooltip';
+import HostLink from '@components/HostLink';
+
+function ClusterNodeLink({ hostId, children }) {
+  if (hostId) {
+    return <HostLink hostId={hostId}>{children}</HostLink>;
+  }
+  return (
+    <span className="group flex items-center relative">
+      <EOS_WARNING_OUTLINED size="base" className="centered fill-yellow-500" />
+      <span className="ml-1 truncate max-w-[100px]">{children}</span>
+      <Tooltip
+        tooltipText="Host currently not registered."
+        width="w-52 -translate-x-1/3"
+      />
+    </span>
+  );
+}
+
+export default ClusterNodeLink;

assets/js/components/ClusterDetails/ClusterNodeLink.test.jsx

@@ -0,0 +1,28 @@
+import React from 'react';
+import { screen, render } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import { renderWithRouter } from '@lib/test-utils';
+import ClusterNodeLink from '@components/ClusterDetails/ClusterNodeLink';
+import { hostFactory } from '@lib/test-utils/factories';
+
+describe('ClusterNodeLink', () => {
+  it('renders HostLink when hostId is provided', () => {
+    const { id, hostname } = hostFactory.build();
+
+    renderWithRouter(<ClusterNodeLink hostId={id}>{hostname}</ClusterNodeLink>);
+
+    const hostLinkElement = screen.getByRole('link', { hostname });
+
+    expect(hostLinkElement).toBeInTheDocument();
+    expect(hostLinkElement).toHaveAttribute('href', `/hosts/${id}`);
+  });
+
+  it('renders warning span when hostId is not provided', () => {
+    const { hostname } = hostFactory.build();
+
+    render(<ClusterNodeLink>{hostname}</ClusterNodeLink>);
+    expect(
+      screen.getByText('Host currently not registered.')
+    ).toBeInTheDocument();
+  });
+});

assets/js/components/ClusterDetails/HanaClusterDetails.jsx

@@ -10,7 +10,7 @@ import ListView from '@components/ListView';
 import Table from '@components/Table';
 import Tooltip from '@components/Tooltip';
 import TriggerChecksExecutionRequest from '@components/TriggerChecksExecutionRequest';
-import HostLink from '@components/HostLink';
+import ClusterNodeLink from '@components/ClusterDetails/ClusterNodeLink';
 import ChecksResultOverview from '@components/ClusterDetails/ChecksResultOverview';
 import ProviderLabel from '@components/ProviderLabel';
 import SapSystemLink from '@components/SapSystemLink';
@@ -34,7 +34,7 @@ const siteDetailsConfig = {
       title: 'Hostname',
       key: '',
       render: (_, hostData) => (
-        <HostLink hostId={hostData.id}>{hostData.name}</HostLink>
+        <ClusterNodeLink hostId={hostData.id}>{hostData.name}</ClusterNodeLink>
       ),
     },
     { title: 'Role', key: 'hana_status' },

assets/js/components/ClusterDetails/HanaClusterDetails.stories.jsx

@@ -80,6 +80,13 @@ export const Hana = {
   },
 };
 
+export const WithUnregisteredHost = {
+  args: {
+    ...Hana.args,
+    hosts: hosts.slice(0, 1),
+  },
+};
+
 export const WithNoSelectedChecks = {
   args: {
     ...Hana.args,

assets/js/components/ClusterDetails/HanaClusterDetails.test.jsx

@@ -6,6 +6,7 @@ import { renderWithRouter } from '@lib/test-utils';
 import {
   clusterFactory,
   hostFactory,
+  hanaClusterDetailsNodesFactory,
   checksExecutionCompletedFactory,
   checksExecutionRunningFactory,
   sapSystemFactory,
@@ -181,4 +182,51 @@ describe('HanaClusterDetails component', () => {
     expect(sidContainer).toHaveTextContent(sid);
     expect(sidContainer.querySelector('a')).toBeNull();
   });
+
+  it('should display a host link in the site details if the host is registered', () => {
+    const registeredClusterNode = hanaClusterDetailsNodesFactory.build();
+
+    const {
+      clusterID,
+      clusterName,
+      cib_last_written: cibLastWritten,
+      type: clusterType,
+      sid,
+      provider,
+      details,
+    } = clusterFactory.build({ details: { nodes: [registeredClusterNode] } });
+
+    const host = hostFactory.build({
+      hostname: registeredClusterNode.name,
+      cluster_id: clusterID,
+    });
+
+    const sapSystems = sapSystemFactory.buildList(2, { tenant: sid });
+
+    renderWithRouter(
+      <HanaClusterDetails
+        clusterID={clusterID}
+        clusterName={clusterName}
+        selectedChecks={[]}
+        hasSelectedChecks={false}
+        hosts={[host]}
+        clusterType={clusterType}
+        cibLastWritten={cibLastWritten}
+        sid={sid}
+        provider={provider}
+        sapSystems={sapSystems}
+        details={details}
+        lastExecution={null}
+      />
+    );
+
+    const registeredHostContainer = screen.getByText(
+      registeredClusterNode.name
+    );
+
+    expect(registeredHostContainer).toHaveAttribute(
+      'href',
+      `/hosts/${host.id}`
+    );
+  });
 });