Merge pull request #103 from keithchong/7267-AddCommonDetailsPageTitle

Add Common Details Page Title (#7267)

Author: keithchong

src/gitops/utils/components/DetailsPageTitle/DetailsPageTitle.tsx

@@ -0,0 +1,31 @@
+import { FC, ReactNode } from 'react';
+
+import { Flex, PageBreadcrumb, PageGroup, PageSection } from '@patternfly/react-core';
+
+import './details-page-title.scss';
+
+type DetailsPageTitleProps = {
+  breadcrumb: ReactNode;
+};
+
+export const PaneHeading: React.FC = ({ children }) => (
+  <Flex
+    alignItems={{ default: 'alignItemsCenter' }}
+    justifyContent={{ default: 'justifyContentSpaceBetween' }}
+  >
+    {children}
+  </Flex>
+);
+
+const DetailsPageTitle: FC<DetailsPageTitleProps> = ({ breadcrumb, children }) => (
+  <div>
+    <PageGroup>
+      <PageBreadcrumb>{breadcrumb}</PageBreadcrumb>
+      <PageSection className="details-page-title" hasBodyWrapper={false}>
+        {children}
+      </PageSection>
+    </PageGroup>
+  </div>
+);
+
+export default DetailsPageTitle;

src/gitops/utils/components/DetailsPageTitle/details-page-title.scss

@@ -0,0 +1,3 @@
+.details-page-title {
+  padding-block-start: var(--pf-t--global--spacer--sm);
+}