Merge pull request #2088 from epwinchell/page_header_fix

Fix: PageHeader component
RedHatInsights · Oct 23, 2024 · b427e19 · b427e19
2 parents 00f5508 + d0b77c9
commit b427e19
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 21 deletions.
diff --git a/packages/components/src/PageHeader/PageHeaderTitle.tsx b/packages/components/src/PageHeader/PageHeaderTitle.tsx
@@ -24,7 +24,7 @@ const PageHeaderTitle: React.FC<PageHeaderTitleProps> = ({ className, title, act
 
   return (
     <Flex justifyContent={{ default: 'justifyContentSpaceBetween' }}>
-      <FlexItem className="pf-v5-u-flex-grow-1">
+      <div className="pf-v5-u-flex-grow-1">
         <Title
           headingLevel="h1"
           size="2xl"
@@ -37,7 +37,7 @@ const PageHeaderTitle: React.FC<PageHeaderTitleProps> = ({ className, title, act
         >
           {title}
         </Title>
-      </FlexItem>
+      </div>
       {actionsContent ? <FlexItem>{actionsContent}</FlexItem> : null}
     </Flex>
   );

diff --git a/packages/components/src/PageHeader/__snapshots__/PageHeaderTitle.test.js.snap b/packages/components/src/PageHeader/__snapshots__/PageHeaderTitle.test.js.snap
@@ -14,33 +14,29 @@ exports[`PageHeader component should render 1`] = `
     <div
       className="pf-v5-l-flex pf-m-justify-content-space-between"
     >
-      <FlexItem
+      <div
         className="pf-v5-u-flex-grow-1"
       >
-        <div
-          className="pf-v5-u-flex-grow-1"
+        <Title
+          className=""
+          data-ouia-component-id="OUIA-Generated-RHI/Header-true-1"
+          data-ouia-component-type="RHI/Header"
+          data-ouia-safe={true}
+          headingLevel="h1"
+          size="2xl"
+          widget-type="InsightsPageHeaderTitle"
         >
-          <Title
-            className=""
+          <h1
+            className="pf-v5-c-title pf-m-2xl"
             data-ouia-component-id="OUIA-Generated-RHI/Header-true-1"
             data-ouia-component-type="RHI/Header"
             data-ouia-safe={true}
-            headingLevel="h1"
-            size="2xl"
             widget-type="InsightsPageHeaderTitle"
           >
-            <h1
-              className="pf-v5-c-title pf-m-2xl"
-              data-ouia-component-id="OUIA-Generated-RHI/Header-true-1"
-              data-ouia-component-type="RHI/Header"
-              data-ouia-safe={true}
-              widget-type="InsightsPageHeaderTitle"
-            >
-              Something
-            </h1>
-          </Title>
-        </div>
-      </FlexItem>
+            Something
+          </h1>
+        </Title>
+      </div>
     </div>
   </Flex>
 </PageHeaderTitle>