feat: bump to lastest alpha2 - tests failing

Author: nicolethoen

package-lock.json

@@ -72,9 +72,9 @@
     "webpack-merge": "^5.10.0"
   },
   "dependencies": {
-    "@patternfly/react-core": "5.3.3",
-    "@patternfly/react-icons": "5.3.2",
-    "@patternfly/react-styles": "5.3.1",
+    "@patternfly/react-core": "6.0.0-alpha.64",
+    "@patternfly/react-icons": "6.0.0-alpha.24",
+    "@patternfly/react-styles": "6.0.0-alpha.24",
     "react": "^18",
     "react-dom": "^18",
     "sirv-cli": "^2.0.2"

package.json

@@ -24,7 +24,7 @@ interface IAppLayout {
 
 const AppLayout: React.FunctionComponent<IAppLayout> = ({ children }) => {
   const [sidebarOpen, setSidebarOpen] = React.useState(true);
-  const Header = (
+  const masthead = (
     <Masthead>
       <MastheadToggle>
         <Button variant="plain" onClick={() => setSidebarOpen(!sidebarOpen)} aria-label="Global navigation">
@@ -119,7 +119,7 @@ const AppLayout: React.FunctionComponent<IAppLayout> = ({ children }) => {
   return (
     <Page
       mainContainerId={pageId}
-      header={Header}
+      masthead={masthead}
       sidebar={sidebarOpen && Sidebar}
       skipToContent={PageSkipToContent}>
       {children}

src/app/AppLayout/AppLayout.tsx

@@ -5,8 +5,6 @@ import {
   EmptyState,
   EmptyStateBody,
   EmptyStateFooter,
-  EmptyStateHeader,
-  EmptyStateIcon,
   PageSection,
 } from '@patternfly/react-core';
 import { useHistory } from 'react-router-dom';
@@ -24,8 +22,7 @@ const NotFound: React.FunctionComponent = () => {
 
   return (
     <PageSection>
-      <EmptyState variant="full">
-        <EmptyStateHeader titleText="404 Page not found" icon={<EmptyStateIcon icon={ExclamationTriangleIcon} />} headingLevel="h1" />
+      <EmptyState titleText="404 Page not found" variant="full" icon={ExclamationTriangleIcon} >
         <EmptyStateBody>
           We didn&apos;t find a page that matches the address you navigated to.
         </EmptyStateBody><EmptyStateFooter>

src/app/NotFound/NotFound.tsx

@@ -6,8 +6,6 @@ import {
   EmptyStateActions,
   EmptyStateBody,
   EmptyStateFooter,
-  EmptyStateHeader,
-  EmptyStateIcon,
   EmptyStateVariant,
   PageSection,
   Text,
@@ -22,8 +20,7 @@ export interface ISupportProps {
 // eslint-disable-next-line prefer-const
 let Support: React.FunctionComponent<ISupportProps> = () => (
   <PageSection>
-    <EmptyState variant={EmptyStateVariant.full}>
-      <EmptyStateHeader titleText="Empty State (Stub Support Module)" icon={<EmptyStateIcon icon={CubesIcon} />} headingLevel="h1" />
+    <EmptyState variant={EmptyStateVariant.full} titleText="Empty State (Stub Support Module)" icon={CubesIcon} >
       <EmptyStateBody>
         <TextContent>
           <Text component="p">

src/app/Support/Support.tsx

@@ -4,8 +4,8 @@ body,
   height: 100%;
 }
 
-.pf-v5-c-content {
-  --pf-v5-c-content--small--Color: var(--pf-v5-global--palette--green-500); /* changes all <small> color to --pf-v5-global--palette--green-500 */
-  --pf-v5-c-content--blockquote--BorderLeftColor: var(--pf-v5-global--palette--cyan-600); /* changes all <blockquote> left border color to --pf-v5-global--palette--cyan-600 */
-  --pf-v5-c-content--hr--BackgroundColor: var(--pf-v5-global--palette--gold-500); /* changes a <hr> color to --pf-v5-global--palette--gold-500 */
+.pf-v6-c-content {
+  --pf-v6-c-content--small--Color: red; /* changes all <small> color to --pf-v5-global--palette--green-500 */
+  --pf-v6-c-content--blockquote--BorderLeftColor: purple; /* changes all <blockquote> left border color to --pf-v5-global--palette--cyan-600 */
+  --pf-v6-c-content--hr--BackgroundColor: yellow; /* changes a <hr> color to --pf-v5-global--palette--gold-500 */
 }