Merge pull request #71 from fhlavac/main

fix(title): Fix title in UnavailableContent
patternfly · Nov 2, 2023 · 8b77723 · 8b77723
2 parents 8b6a783 + 2dc60e6
commit 8b77723
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 5 deletions.
diff --git a/packages/module/src/UnavailableContent/UnavailableContent.tsx b/packages/module/src/UnavailableContent/UnavailableContent.tsx
@@ -23,7 +23,7 @@ const UnavailableContent: React.FunctionComponent<UnavailableContentProps> = ({
   const classes = useStyles();
   return (
     <EmptyState variant={EmptyStateVariant.lg} className={clsx(classes.emptyStateUnavailable)}>
-      <EmptyStateHeader title="This page is temporarily unavailable" icon={<EmptyStateIcon icon={ExclamationCircleIcon} />} />
+      <EmptyStateHeader titleText="This page is temporarily unavailable" icon={<EmptyStateIcon icon={ExclamationCircleIcon} />} headingLevel="h5" />
       <EmptyStateBody>
         Try refreshing the page. If the problem persists, contact your organization administrator or visit our{' '}
         <Button component='a' className={clsx(classes.emptyStateLinkButton)} variant='link' href={statusPageUrl} target="_blank" rel="noopener noreferrer">

diff --git a/packages/module/src/UnavailableContent/__snapshots__/UnavailableContent.test.tsx.snap b/packages/module/src/UnavailableContent/__snapshots__/UnavailableContent.test.tsx.snap
@@ -13,7 +13,6 @@ exports[`Unavailable component should render with a link 1`] = `
         >
           <div
             class="pf-v5-c-empty-state__header"
-            title="This page is temporarily unavailable"
           >
             <div
               class="pf-v5-c-empty-state__icon"
@@ -32,6 +31,15 @@ exports[`Unavailable component should render with a link 1`] = `
                 />
               </svg>
             </div>
+            <div
+              class="pf-v5-c-empty-state__title"
+            >
+              <h5
+                class="pf-v5-c-empty-state__title-text"
+              >
+                This page is temporarily unavailable
+              </h5>
+            </div>
           </div>
           <div
             class="pf-v5-c-empty-state__body"
@@ -66,7 +74,6 @@ exports[`Unavailable component should render with a link 1`] = `
       >
         <div
           class="pf-v5-c-empty-state__header"
-          title="This page is temporarily unavailable"
         >
           <div
             class="pf-v5-c-empty-state__icon"
@@ -85,6 +92,15 @@ exports[`Unavailable component should render with a link 1`] = `
               />
             </svg>
           </div>
+          <div
+            class="pf-v5-c-empty-state__title"
+          >
+            <h5
+              class="pf-v5-c-empty-state__title-text"
+            >
+              This page is temporarily unavailable
+            </h5>
+          </div>
         </div>
         <div
           class="pf-v5-c-empty-state__body"
@@ -176,7 +192,6 @@ exports[`Unavailable component should render with no link 1`] = `
         >
           <div
             class="pf-v5-c-empty-state__header"
-            title="This page is temporarily unavailable"
           >
             <div
               class="pf-v5-c-empty-state__icon"
@@ -195,6 +210,15 @@ exports[`Unavailable component should render with no link 1`] = `
                 />
               </svg>
             </div>
+            <div
+              class="pf-v5-c-empty-state__title"
+            >
+              <h5
+                class="pf-v5-c-empty-state__title-text"
+              >
+                This page is temporarily unavailable
+              </h5>
+            </div>
           </div>
           <div
             class="pf-v5-c-empty-state__body"
@@ -229,7 +253,6 @@ exports[`Unavailable component should render with no link 1`] = `
       >
         <div
           class="pf-v5-c-empty-state__header"
-          title="This page is temporarily unavailable"
         >
           <div
             class="pf-v5-c-empty-state__icon"
@@ -248,6 +271,15 @@ exports[`Unavailable component should render with no link 1`] = `
               />
             </svg>
           </div>
+          <div
+            class="pf-v5-c-empty-state__title"
+          >
+            <h5
+              class="pf-v5-c-empty-state__title-text"
+            >
+              This page is temporarily unavailable
+            </h5>
+          </div>
         </div>
         <div
           class="pf-v5-c-empty-state__body"