diff --git a/src/components/view-header/ViewHeader.tsx b/src/components/view-header/ViewHeader.tsx
index 30e144da6c..f4c0fe0647 100644
--- a/src/components/view-header/ViewHeader.tsx
+++ b/src/components/view-header/ViewHeader.tsx
@@ -12,15 +12,18 @@ import {
ToolbarItem,
Badge,
Select,
+ ButtonProps,
} from "@patternfly/react-core";
import { HelpContext } from "../help-enabler/HelpHeader";
import { useTranslation } from "react-i18next";
import { PageBreadCrumbs } from "../bread-crumb/PageBreadCrumbs";
+import { ExternalLink } from "../external-link/ExternalLink";
export type ViewHeaderProps = {
titleKey: string;
badge?: string;
subKey: string;
+ subKeyLinkProps?: ButtonProps;
selectItems?: ReactElement[];
isEnabled?: boolean;
onSelect?: (value: string) => void;
@@ -31,6 +34,7 @@ export const ViewHeader = ({
titleKey,
badge,
subKey,
+ subKeyLinkProps,
selectItems,
isEnabled = true,
onSelect,
@@ -98,7 +102,16 @@ export const ViewHeader = ({
{enabled && (
- {t(subKey)}
+
+ {t(subKey)}
+ {subKeyLinkProps && (
+
+ )}
+
)}
diff --git a/src/stories/ViewHeader.stories.tsx b/src/stories/ViewHeader.stories.tsx
index cb9f6a3c0a..cad7095fbf 100644
--- a/src/stories/ViewHeader.stories.tsx
+++ b/src/stories/ViewHeader.stories.tsx
@@ -22,6 +22,10 @@ Extended.args = {
titleKey: "This is the title",
badge: "badge",
subKey: "This is the description.",
+ subKeyLinkProps: {
+ title: "More information",
+ href: "http://google.com",
+ },
selectItems: [
First item