Fixes #35497 - New host UI - Link to host group

theforeman · Sep 7, 2022 · 022d365 · 022d365
1 parent 122f537
commit 022d365
Showing 1 changed file with 27 additions and 1 deletion.
diff --git a/webpack/assets/javascripts/react_app/components/HostDetails/DetailsCard/index.js b/webpack/assets/javascripts/react_app/components/HostDetails/DetailsCard/index.js
@@ -20,6 +20,7 @@ import SkeletonLoader from '../../common/SkeletonLoader';
 import { STATUS } from '../../../constants';
 import DefaultLoaderEmptyState from './DefaultLoaderEmptyState';
 import PowerStatusDropDown from './PowerStatus/PowerStatusDropDown';
+import { foremanUrl } from '../../../common/helpers';
 
 import './styles.scss';
 
@@ -34,6 +35,7 @@ const DetailsCard = ({
     owner_id: ownerID,
     owner_name: ownerName,
     hostgroup_name: hostgroupName,
+    hostgroup_id: hostgroupId,
     permissions: { power_hosts: hasPowerPermission } = {},
   },
 }) => (
@@ -106,7 +108,29 @@ const DetailsCard = ({
                 emptyState={<DefaultLoaderEmptyState />}
                 status={status}
               >
-                {hostgroupName}
+                <a
+                  href={foremanUrl(
+                    `/hostgroups/${hostgroupId}-${(hostgroupName || '').replace(
+                      '.',
+                      '-'
+                    )}/edit`
+                  )}
+                  target="_blank"
+                  rel="noreferrer"
+                >
+                  {hostgroupName}
+                </a>
+                &nbsp;
+                <a
+                  href={foremanUrl(
+                    `/hosts?search=hostgroup="${hostgroupName}"`
+                  )}
+                  className="disabled-text"
+                  target="_blank"
+                  rel="noreferrer"
+                >
+                  <i className="fa fa-search" />
+                </a>
               </SkeletonLoader>
             </DescriptionListDescription>
           </DescriptionListGroup>
@@ -148,6 +172,7 @@ DetailsCard.propTypes = {
   hostDetails: PropTypes.shape({
     comment: PropTypes.string,
     hostgroup_name: PropTypes.string,
+    hostgroup_id: PropTypes.number,
     ip: PropTypes.string,
     ip6: PropTypes.string,
     mac: PropTypes.string,
@@ -163,6 +188,7 @@ DetailsCard.defaultProps = {
   hostDetails: {
     comment: undefined,
     hostgroup_name: undefined,
+    hostgroup_id: undefined,
     ip: undefined,
     ip6: undefined,
     mac: undefined,