diff --git a/ui/package.json b/ui/package.json
index d1c2519f5..a9c41dc57 100644
--- a/ui/package.json
+++ b/ui/package.json
@@ -22,9 +22,9 @@
     "gen:src": "./scripts/generate-client.sh"
   },
   "dependencies": {
-    "@patternfly/patternfly": "^4.224.2",
-    "@patternfly/react-core": "^4.276.8",
-    "@patternfly/react-icons": "^4.93.6",
+    "@patternfly/patternfly": "^5.4.2",
+    "@patternfly/react-core": "^5.4.8",
+    "@patternfly/react-icons": "^5.4.2",
     "axios": "^0.21.4",
     "formik": "^2.4.2",
     "history": "^5.0.1",
diff --git a/ui/src/components/AppHeaderLayout.tsx b/ui/src/components/AppHeaderLayout.tsx
index 1a59fcc85..588dc7415 100644
--- a/ui/src/components/AppHeaderLayout.tsx
+++ b/ui/src/components/AppHeaderLayout.tsx
@@ -17,11 +17,13 @@ export default function AppHeaderLayout({ logo, main, ending }: Props): ReactEle
   return (
     <Masthead>
       <MastheadMain>
-        <MastheadBrand className="pf-u-mr-xl">{logo}</MastheadBrand>
+        <MastheadBrand component="a" className="pf-v5-u-mr-xl">
+          {logo}
+        </MastheadBrand>
         <ToolbarItem variant="separator" />
         {main}
       </MastheadMain>
-      <MastheadContent className="pf-u-flex-direction-row-reverse">
+      <MastheadContent className="pf-v5-u-flex-direction-row-reverse">
         <div>{ending}</div>
       </MastheadContent>
     </Masthead>
diff --git a/ui/src/components/Countdown.tsx b/ui/src/components/Countdown.tsx
index 49c1e95d1..c1f955b7e 100644
--- a/ui/src/components/Countdown.tsx
+++ b/ui/src/components/Countdown.tsx
@@ -25,15 +25,15 @@ function ModifiableTimeUnit({
   onChange = (): void => {},
 }: ModifiableTimeUnitProps): ReactElement {
   return (
-    <span className="pf-u-display-inline-flex pf-u-flex-direction-column pf-u-align-items-center">
+    <span className="pf-v5-u-display-inline-flex pf-v5-u-flex-direction-column pf-v5-u-align-items-center">
       <span>
         {`${value}`.padStart(2, '0')}
         {notation}
       </span>
-      <span className="pf-u-display-inline-flex">
+      <span className="pf-v5-u-display-inline-flex">
         <Button
           variant="plain"
-          className="pf-u-mr-sm pf-u-p-0"
+          className="pf-v5-u-mr-sm pf-v5-u-p-0"
           aria-label="Increment"
           onClick={(): void => {
             onChange(notation, 'inc');
@@ -43,7 +43,7 @@ function ModifiableTimeUnit({
         </Button>
         <Button
           variant="plain"
-          className="pf-u-p-0"
+          className="pf-v5-u-p-0"
           aria-label="Decrement"
           onClick={(): void => {
             onChange(notation, 'dec');
diff --git a/ui/src/components/FullPageError.tsx b/ui/src/components/FullPageError.tsx
index 83b79585d..5b6cecc2c 100644
--- a/ui/src/components/FullPageError.tsx
+++ b/ui/src/components/FullPageError.tsx
@@ -11,9 +11,9 @@ export default function FullPageError({
   IconComponent = AlertCircle,
 }: Props): ReactElement {
   return (
-    <div className="pf-u-display-flex pf-u-align-items-center pf-u-justify-content-center pf-u-h-100">
-      <IconComponent className="pf-u-mr-md" size={64} />
-      <span className="pf-u-font-size-4xl">{message}</span>
+    <div className="pf-v5-u-display-flex pf-v5-u-align-items-center pf-v5-u-justify-content-center pf-v5-u-h-100">
+      <IconComponent className="pf-v5-u-mr-md" size={64} />
+      <span className="pf-v5-u-font-size-4xl">{message}</span>
     </div>
   );
 }
diff --git a/ui/src/components/FullPageSpinner.tsx b/ui/src/components/FullPageSpinner.tsx
index 916197353..322ea32f8 100644
--- a/ui/src/components/FullPageSpinner.tsx
+++ b/ui/src/components/FullPageSpinner.tsx
@@ -3,9 +3,9 @@ import { RingLoader } from 'react-spinners';
 
 export default function FullPageSpinner(): ReactElement {
   return (
-    <div className="pf-u-display-flex pf-u-flex-direction-column pf-u-align-items-center pf-u-justify-content-center pf-u-h-100">
+    <div className="pf-v5-u-display-flex pf-v5-u-flex-direction-column pf-v5-u-align-items-center pf-v5-u-justify-content-center pf-v5-u-h-100">
       <RingLoader loading size={128} color="currentColor" />
-      <span className="pf-u-font-size-4xl">Loading...</span>
+      <span className="pf-v5-u-font-size-4xl">Loading...</span>
     </div>
   );
 }
diff --git a/ui/src/components/forms/FileUploadFormField.tsx b/ui/src/components/forms/FileUploadFormField.tsx
index feea194fe..880160e90 100644
--- a/ui/src/components/forms/FileUploadFormField.tsx
+++ b/ui/src/components/forms/FileUploadFormField.tsx
@@ -1,6 +1,16 @@
 import React, { ReactElement, ReactNode } from 'react';
 import { useField } from 'formik';
-import { FormGroup, Popover, FileUpload, ValidatedOptions } from '@patternfly/react-core';
+import {
+  FormGroup,
+  Popover,
+  FileUpload,
+  ValidatedOptions,
+  Icon,
+  FormHelperText,
+  HelperText,
+  HelperTextItem,
+  DropEvent,
+} from '@patternfly/react-core';
 import { HelpIcon } from '@patternfly/react-icons';
 
 type Props = {
@@ -22,10 +32,7 @@ export default function FileUploadFormField({
   const [filename, setFilename] = React.useState('');
   const [isLoading, setIsLoading] = React.useState(false);
 
-  const handleFileInputChange = (
-    event: React.ChangeEvent<HTMLInputElement> | React.DragEvent<HTMLElement>,
-    file: File
-  ) => {
+  const handleFileInputChange = (event: DropEvent, file: File) => {
     setFilename(file.name);
   };
 
@@ -59,15 +66,15 @@ export default function FileUploadFormField({
               aria-label={`Help for ${name}`}
               onClick={(e) => e.preventDefault()}
               aria-describedby={id}
-              className="pf-c-form__group-label-help"
+              className="pf-v5-c-form__group-label-help"
             >
-              <HelpIcon noVerticalAlign />
+              <Icon>
+                <HelpIcon />
+              </Icon>
             </button>
           </Popover>
         ) : undefined
       }
-      validated={meta.error ? ValidatedOptions.error : ValidatedOptions.default}
-      helperTextInvalid={meta.error}
     >
       <FileUpload
         id={id}
@@ -77,16 +84,23 @@ export default function FileUploadFormField({
         type="text"
         hideDefaultPreview
         onFileInputChange={handleFileInputChange}
-        onDataChange={handleTextOrDataChange}
-        onTextChange={handleTextOrDataChange}
-        onReadStarted={handleFileReadStarted}
-        onReadFinished={handleFileReadFinished}
+        onDataChange={(_event, value: string) => handleTextOrDataChange(value)}
+        onTextChange={(_event, value: string) => handleTextOrDataChange(value)}
+        onReadStarted={(_event, _fileHandle: File) => handleFileReadStarted(_fileHandle)}
+        onReadFinished={(_event, _fileHandle: File) => handleFileReadFinished(_fileHandle)}
         onClearClick={handleClear}
         isLoading={isLoading}
         browseButtonText="Upload"
         aria-describedby={`${id}-helper`}
         validated={meta.error ? ValidatedOptions.error : ValidatedOptions.default}
       />
+      <FormHelperText>
+        <HelperText>
+          <HelperTextItem variant={meta.error ? ValidatedOptions.error : ValidatedOptions.default}>
+            {meta.error}
+          </HelperTextItem>
+        </HelperText>
+      </FormHelperText>
     </FormGroup>
   );
 }
diff --git a/ui/src/components/forms/NumberFormField.tsx b/ui/src/components/forms/NumberFormField.tsx
index 25617b0fb..77d35eef5 100644
--- a/ui/src/components/forms/NumberFormField.tsx
+++ b/ui/src/components/forms/NumberFormField.tsx
@@ -1,6 +1,13 @@
 import React, { ReactElement } from 'react';
 import { useField } from 'formik';
-import { FormGroup, NumberInput, ValidatedOptions } from '@patternfly/react-core';
+import {
+  FormGroup,
+  FormHelperText,
+  HelperText,
+  HelperTextItem,
+  NumberInput,
+  ValidatedOptions,
+} from '@patternfly/react-core';
 
 type Props = {
   name: string;
@@ -39,14 +46,7 @@ export default function NumberFormField({
   };
 
   return (
-    <FormGroup
-      label={label}
-      fieldId={id}
-      isRequired={required}
-      validated={meta.error ? ValidatedOptions.error : ValidatedOptions.default}
-      helperTextInvalid={meta.error}
-      className="capitalize"
-    >
+    <FormGroup label={label} fieldId={id} isRequired={required} className="capitalize">
       <NumberInput
         id={id}
         name={name}
@@ -60,6 +60,13 @@ export default function NumberFormField({
         isDisabled={disabled}
         validated={meta.error ? ValidatedOptions.error : ValidatedOptions.default}
       />
+      <FormHelperText>
+        <HelperText>
+          <HelperTextItem variant={meta.error ? ValidatedOptions.error : ValidatedOptions.default}>
+            {meta.error}
+          </HelperTextItem>
+        </HelperText>
+      </FormHelperText>
     </FormGroup>
   );
 }
diff --git a/ui/src/components/forms/TextFormField.tsx b/ui/src/components/forms/TextFormField.tsx
index a241c126f..d69e2b638 100644
--- a/ui/src/components/forms/TextFormField.tsx
+++ b/ui/src/components/forms/TextFormField.tsx
@@ -1,6 +1,15 @@
 import React, { ReactElement, ReactNode } from 'react';
 import { useField } from 'formik';
-import { FormGroup, Popover, TextInput, ValidatedOptions } from '@patternfly/react-core';
+import {
+  FormGroup,
+  FormHelperText,
+  HelperText,
+  HelperTextItem,
+  Icon,
+  Popover,
+  TextInput,
+  ValidatedOptions,
+} from '@patternfly/react-core';
 import { HelpIcon } from '@patternfly/react-icons';
 
 type Props = {
@@ -41,20 +50,20 @@ export default function TextFormField({
               aria-label={`Help for ${name}`}
               onClick={(e) => e.preventDefault()}
               aria-describedby={id}
-              className="pf-c-form__group-label-help"
+              className="pf-v5-c-form__group-label-help"
             >
-              <HelpIcon noVerticalAlign />
+              <Icon>
+                <HelpIcon />
+              </Icon>
             </button>
           </Popover>
         ) : undefined
       }
-      validated={meta.error ? ValidatedOptions.error : ValidatedOptions.default}
-      helperTextInvalid={meta.error}
     >
       <TextInput
         id={id}
         name={name}
-        onChange={onChange}
+        onChange={(event, _value: string) => onChange(_value, event)}
         type="text"
         value={field.value} // eslint-disable-line @typescript-eslint/no-unsafe-assignment
         placeholder={placeholder}
@@ -63,6 +72,13 @@ export default function TextFormField({
         aria-describedby={`${id}-helper`}
         validated={meta.error ? ValidatedOptions.error : ValidatedOptions.default}
       />
+      <FormHelperText>
+        <HelperText>
+          <HelperTextItem variant={meta.error ? ValidatedOptions.error : ValidatedOptions.default}>
+            {meta.error}
+          </HelperTextItem>
+        </HelperText>
+      </FormHelperText>
     </FormGroup>
   );
 }
diff --git a/ui/src/containers/AppHeader/ProductLogoTile.tsx b/ui/src/containers/AppHeader/ProductLogoTile.tsx
index 5e39cd06f..481c5bb04 100644
--- a/ui/src/containers/AppHeader/ProductLogoTile.tsx
+++ b/ui/src/containers/AppHeader/ProductLogoTile.tsx
@@ -14,7 +14,7 @@ export default function ProductLogoTile(): ReactElement {
         </Link>
       </FlexItem>
       <FlexItem>
-        <span className="pf-u-font-family-redhatVF-heading-sans-serif pf-u-font-size-lg">
+        <span className="pf-v5-u-font-family-redhatVF-heading-sans-serif pf-v5-u-font-size-lg">
           Infra
         </span>
         <Version />
diff --git a/ui/src/containers/AppHeader/Version.tsx b/ui/src/containers/AppHeader/Version.tsx
index 7c33d56ec..9620b2c67 100644
--- a/ui/src/containers/AppHeader/Version.tsx
+++ b/ui/src/containers/AppHeader/Version.tsx
@@ -27,7 +27,7 @@ export default function Version(): ReactElement {
   if (loading)
     return (
       <VersionContent
-        icon={<Spinner isSVG size="md" aria-label="Loading version information" />}
+        icon={<Spinner  size="md" aria-label="Loading version information" />}
         text="Loading..."
       />
     );
diff --git a/ui/src/containers/ClusterInfoPage/DeleteClusterModal.tsx b/ui/src/containers/ClusterInfoPage/DeleteClusterModal.tsx
index 14626b1f0..65385e42f 100644
--- a/ui/src/containers/ClusterInfoPage/DeleteClusterModal.tsx
+++ b/ui/src/containers/ClusterInfoPage/DeleteClusterModal.tsx
@@ -43,7 +43,7 @@ export default function DeleteClusterModal({ cluster, onCancel, onDeleted }: Pro
         header={`Are you sure you want to delete ${cluster.ID}?`}
         buttons={buttons}
       >
-        <span className="pf-u-danger-color-100 pf-u-font-size-2xl">
+        <span className="pf-v5-u-danger-color-100 pf-v5-u-font-size-2xl">
           This action cannot be undone.
         </span>
       </Modal>
@@ -64,7 +64,7 @@ export default function DeleteClusterModal({ cluster, onCancel, onDeleted }: Pro
     const message = `Cannot delete cluster. Server error occurred: "${error.message}".`;
     return (
       <InformationalModal header={`Failed to delete ${cluster.ID}!`} onAcknowledged={onCancel}>
-        <span className="pf-u-danger-color-100 pf-u-font-size-2xl">{message}</span>
+        <span className="pf-v5-u-danger-color-100 pf-v5-u-font-size-2xl">{message}</span>
       </InformationalModal>
     );
   }
@@ -73,7 +73,7 @@ export default function DeleteClusterModal({ cluster, onCancel, onDeleted }: Pro
   const message = `Cluster ${cluster.ID} is being destroyed now.`;
   return (
     <InformationalModal header={`Successfully deleted ${cluster.ID}!`} onAcknowledged={onDeleted}>
-      <span className="pf-u-success-color-100 pf-u-font-size-2xl">{message}</span>
+      <span className="pf-v5-u-success-color-100 pf-v5-u-font-size-2xl">{message}</span>
     </InformationalModal>
   );
 }
diff --git a/ui/src/containers/ClusterInfoPage/DownloadArtifactsModal.tsx b/ui/src/containers/ClusterInfoPage/DownloadArtifactsModal.tsx
index 0e660938e..6cb9daabd 100644
--- a/ui/src/containers/ClusterInfoPage/DownloadArtifactsModal.tsx
+++ b/ui/src/containers/ClusterInfoPage/DownloadArtifactsModal.tsx
@@ -15,7 +15,7 @@ type ArtifactsListProps = {
 
 function ArtifactsList({ artifacts }: ArtifactsListProps): ReactElement {
   return (
-    <List className="pf-u-mb-md">
+    <List className="pf-v5-u-mb-md">
       {artifacts
         .sort((a, b) => {
           if (a.Description && !b.Description) {
diff --git a/ui/src/containers/ClusterInfoPage/MutableLifespan.tsx b/ui/src/containers/ClusterInfoPage/MutableLifespan.tsx
index ef211c0bf..906304f7e 100644
--- a/ui/src/containers/ClusterInfoPage/MutableLifespan.tsx
+++ b/ui/src/containers/ClusterInfoPage/MutableLifespan.tsx
@@ -26,7 +26,7 @@ export default function MutableLifespan({ cluster }: Props): ReactElement {
         header="Cannot change the cluster lifespan"
         onAcknowledged={(): void => setError(null)}
       >
-        <span className="pf-u-danger-color-100 pf-u-font-size-2xl">{message}</span>
+        <span className="pf-v5-u-danger-color-100 pf-v5-u-font-size-2xl">{message}</span>
       </InformationalModal>
     );
   }
diff --git a/ui/src/infra.css b/ui/src/infra.css
index a59d09329..4e69c336f 100644
--- a/ui/src/infra.css
+++ b/ui/src/infra.css
@@ -1,22 +1,22 @@
-.pf-c-form__group-label {
+.pf-v5-c-form__group-label {
   /* Some more padding for the form field label help icon */
-  --pf-c-form__group-label-help--MarginLeft: var(--pf-global--spacer--sm);
+  --pf-v5-c-form__group-label-help--MarginLeft: var(--pf-v5-global--spacer--sm);
 }
 
-.pf-c-form__group {
+.pf-v5-c-form__group {
   /* Some separation for form fields */
-  margin-bottom: var(--pf-global--spacer--md);
+  margin-bottom: var(--pf-v5-global--spacer--md);
 }
 
 /* Remove padding from homepage bottom panel */
-.home-page .pf-c-drawer__body {
-  --pf-c-drawer--child--PaddingTop: 0;
-  --pf-c-drawer--child--PaddingLeft: 0;
-  --pf-c-drawer--child--PaddingBottom: 0;
-  --pf-c-drawer--child--PaddingRight: 0;
+.home-page .pf-v5-c-drawer__body {
+  --pf-v5-c-drawer--child--PaddingTop: 0;
+  --pf-v5-c-drawer--child--PaddingLeft: 0;
+  --pf-v5-c-drawer--child--PaddingBottom: 0;
+  --pf-v5-c-drawer--child--PaddingRight: 0;
 }
 
-.pf-c-form__label-text {
+.pf-v5-c-form__label-text {
   text-transform: capitalize;
 }
 
@@ -35,19 +35,19 @@
 /* LinkCard */
 
 /* appear to be clickable */
-a:hover > .pf-c-panel {
-  background-color: var(--pf-global--BackgroundColor--200);
+a:hover>.pf-v5-c-panel {
+  background-color: var(--pf-v5-global--BackgroundColor--200);
 }
 
 /* reset to regular font for LinkCard content */
-a > .pf-c-panel {
-  font-weight: var(--pf-global--FontWeight--normal);
+a>.pf-v5-c-panel {
+  font-weight: var(--pf-v5-global--FontWeight--normal);
 }
 
 /* LinkCard title */
-a > .pf-c-panel > .pf-c-panel__header {
-  font-weight: var(--pf-global--FontWeight--bold);
-  font-size: var(--pf-global--FontSize--lg);
+a>.pf-v5-c-panel>.pf-v5-c-panel__header {
+  font-weight: var(--pf-v5-global--FontWeight--bold);
+  font-size: var(--pf-v5-global--FontSize--lg);
 }
 
 /* Form help popovers - rendered with react-markdown */
@@ -56,28 +56,32 @@ a > .pf-c-panel > .pf-c-panel__header {
 .form-help h1,
 h2,
 h3 {
-  font-weight: var(--pf-global--FontWeight--bold);
-  margin-bottom: var(--pf-global--spacer--sm);
+  font-weight: var(--pf-v5-global--FontWeight--bold);
+  margin-bottom: var(--pf-v5-global--spacer--sm);
 }
+
 .form-help h1 {
-  font-size: var(--pf-global--FontSize--xl);
+  font-size: var(--pf-v5-global--FontSize--xl);
 }
+
 .form-help h2 {
-  font-size: var(--pf-global--FontSize--lg);
+  font-size: var(--pf-v5-global--FontSize--lg);
 }
+
 .form-help h3 {
-  font-size: var(--pf-global--FontSize--md);
+  font-size: var(--pf-v5-global--FontSize--md);
 }
 
 /* A text block */
 .form-help p {
-  margin-bottom: var(--pf-global--spacer--lg);
+  margin-bottom: var(--pf-v5-global--spacer--lg);
 }
 
 /* [link](url) */
 .form-help a {
-  color: var(--pf-global--link--Color);
+  color: var(--pf-v5-global--link--Color);
 }
+
 .form-help a:visited {
-  color: var(--pf-global--link--Color--visited);
+  color: var(--pf-v5-global--link--Color--visited);
 }
diff --git a/ui/yarn.lock b/ui/yarn.lock
index d75746292..a7ba7e1ad 100644
--- a/ui/yarn.lock
+++ b/ui/yarn.lock
@@ -1757,38 +1757,37 @@
   dependencies:
     mkdirp "^1.0.4"
 
-"@patternfly/patternfly@^4.224.2":
-  version "4.224.2"
-  resolved "https://registry.yarnpkg.com/@patternfly/patternfly/-/patternfly-4.224.2.tgz#9d1b000c3c43457ae47c3556a334412d164fad90"
-  integrity sha512-HGNV26uyHSIECuhjPg/WGn0mXbAotcs6ODfhAOkfYjIgGylddgiwElxUe1rpEHV5mQJJ2rMn4OdeJIIpzRX61g==
-
-"@patternfly/react-core@^4.276.8":
-  version "4.276.8"
-  resolved "https://registry.yarnpkg.com/@patternfly/react-core/-/react-core-4.276.8.tgz#7ef52830dcdda954bd5bec40132da6eef49aba6f"
-  integrity sha512-dn322rEzBeiVztZEuCZMUUittNb8l1hk30h9ZN31FLZLLVtXGlThFNV9ieqOJYA9zrYxYZrHMkTnOxSWVacMZg==
-  dependencies:
-    "@patternfly/react-icons" "^4.93.6"
-    "@patternfly/react-styles" "^4.92.6"
-    "@patternfly/react-tokens" "^4.94.6"
-    focus-trap "6.9.2"
-    react-dropzone "9.0.0"
-    tippy.js "5.1.2"
-    tslib "^2.0.0"
-
-"@patternfly/react-icons@^4.93.6":
-  version "4.93.6"
-  resolved "https://registry.yarnpkg.com/@patternfly/react-icons/-/react-icons-4.93.6.tgz#4aff18724afa30157e3ffd6a6414951dbb39dcb3"
-  integrity sha512-ZrXegc/81oiuTIeWvoHb3nG/eZODbB4rYmekBEsrbiysyO7m/sUFoi/RLvgFINrRoh6YCJqL5fj06Jg6d7jX1g==
-
-"@patternfly/react-styles@^4.92.6":
-  version "4.92.6"
-  resolved "https://registry.yarnpkg.com/@patternfly/react-styles/-/react-styles-4.92.6.tgz#a72c5f0b7896ce1c419d1db79f8e39ba6632057d"
-  integrity sha512-b8uQdEReMyeoMzjpMri845QxqtupY/tIFFYfVeKoB2neno8gkcW1RvDdDe62LF88q45OktCwAe/8A99ker10Iw==
+"@patternfly/patternfly@^5.4.2":
+  version "5.4.2"
+  resolved "https://registry.yarnpkg.com/@patternfly/patternfly/-/patternfly-5.4.2.tgz#4a87d6a5fb2ffd526b4b9597b651f13ecf8ddd4f"
+  integrity sha512-+BaokNR8/AmTYMESxby9UtQXPGACg449BXQd0KejAvW/uGxlgO6mY1X1205DeBEHoK3e/vXkYXjvZPpv/tcxSA==
+
+"@patternfly/react-core@^5.4.8":
+  version "5.4.14"
+  resolved "https://registry.yarnpkg.com/@patternfly/react-core/-/react-core-5.4.14.tgz#d41d28c81884f6a45dc3c364dc5ae2c933c72e89"
+  integrity sha512-oXVMzLs9Pa+xmdc39L2u05zbXfY3mWuOFi4GDv44GPdDexZUFy5W69+Nv5P8cwfMim55Nf5kKYpcqmatD2bBXw==
+  dependencies:
+    "@patternfly/react-icons" "^5.4.2"
+    "@patternfly/react-styles" "^5.4.1"
+    "@patternfly/react-tokens" "^5.4.1"
+    focus-trap "7.6.2"
+    react-dropzone "^14.2.3"
+    tslib "^2.7.0"
+
+"@patternfly/react-icons@^5.4.2":
+  version "5.4.2"
+  resolved "https://registry.yarnpkg.com/@patternfly/react-icons/-/react-icons-5.4.2.tgz#8937a7167a0b3abdc3c179524f456b4cbd8f0c39"
+  integrity sha512-CMQ5oHYzW6TPVTs2jpNJmP2vGCAKR/YeTPwHGO9dLkAUej1IcIxtCCWK2Fdo2UJsnBjuZihasyw2b6ehvbUm9Q==
+
+"@patternfly/react-styles@^5.4.1":
+  version "5.4.1"
+  resolved "https://registry.yarnpkg.com/@patternfly/react-styles/-/react-styles-5.4.1.tgz#c101419917bcf309dfa7469820cd7320dd0c5120"
+  integrity sha512-XA8PXksD8uiA3RTwxdUwJXOCf+V6sVd+2HKapWAdRLvtSV+Sdk7NgCvalb4IAQncsddLopjPQD8gAHA298+N8w==
 
-"@patternfly/react-tokens@^4.94.6":
-  version "4.94.6"
-  resolved "https://registry.yarnpkg.com/@patternfly/react-tokens/-/react-tokens-4.94.6.tgz#47c715721ad3dd315a523f352ba1a0de2b03f0bc"
-  integrity sha512-tm7C6nat+uKMr1hrapis7hS3rN9cr41tpcCKhx6cod6FLU8KwF2Yt5KUxakhIOCEcE/M/EhXhAw/qejp8w0r7Q==
+"@patternfly/react-tokens@^5.4.1":
+  version "5.4.1"
+  resolved "https://registry.yarnpkg.com/@patternfly/react-tokens/-/react-tokens-5.4.1.tgz#03104c5b73ef438076141f897a53d16507d8a115"
+  integrity sha512-eygdHE7Krta1mijAv/E8RHiKIgysD0eeNTo8EXUYC8/M4e5K6sqpr2p6rQBF8QiRMN8FnbXvZT3K2OQ28pYt9Q==
 
 "@pmmmwh/react-refresh-webpack-plugin@0.4.2":
   version "0.4.2"
@@ -3091,12 +3090,10 @@ atob@^2.1.2:
   resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9"
   integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==
 
-attr-accept@^1.1.3:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/attr-accept/-/attr-accept-1.1.3.tgz#48230c79f93790ef2775fcec4f0db0f5db41ca52"
-  integrity sha512-iT40nudw8zmCweivz6j58g+RT33I4KbaIvRUhjNmDwO2WmsQUxFEZZYZ5w3vXe5x5MX9D7mfvA/XaLOZYFR9EQ==
-  dependencies:
-    core-js "^2.5.0"
+attr-accept@^2.2.4:
+  version "2.2.5"
+  resolved "https://registry.yarnpkg.com/attr-accept/-/attr-accept-2.2.5.tgz#d7061d958e6d4f97bf8665c68b75851a0713ab5e"
+  integrity sha512-0bDNnY/u6pPwHDMoF0FieU354oBi0a8rD9FcsLwzcGWbc8KS8KPIi7y+s13OlVY+gMWc/9xEMUgNE6Qm8ZllYQ==
 
 autoprefixer@^10.4.14:
   version "10.4.14"
@@ -4205,11 +4202,6 @@ core-js@^2.4.0:
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.11.tgz#38831469f9922bded8ee21c9dc46985e0399308c"
   integrity sha512-5wjnpaT/3dV+XB4borEsnAYQchn00XSgTAWKDkEqv+K8KevjbzmofK6hfJ9TZIlpj2N0xQpazy7PiRQiWHqzWg==
 
-core-js@^2.5.0:
-  version "2.6.12"
-  resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.12.tgz#d9333dfa7b065e347cc5682219d6f690859cc2ec"
-  integrity sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==
-
 core-js@^3.6.5:
   version "3.8.0"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.8.0.tgz#0fc2d4941cadf80538b030648bb64d230b4da0ce"
@@ -5785,12 +5777,12 @@ file-loader@6.1.1:
     loader-utils "^2.0.0"
     schema-utils "^3.0.0"
 
-file-selector@^0.1.8:
-  version "0.1.19"
-  resolved "https://registry.yarnpkg.com/file-selector/-/file-selector-0.1.19.tgz#8ecc9d069a6f544f2e4a096b64a8052e70ec8abf"
-  integrity sha512-kCWw3+Aai8Uox+5tHCNgMFaUdgidxvMnLWO6fM5sZ0hA2wlHP5/DHGF0ECe84BiB95qdJbKNEJhWKVDvMN+JDQ==
+file-selector@^2.1.0:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/file-selector/-/file-selector-2.1.2.tgz#fe7c7ee9e550952dfbc863d73b14dc740d7de8b4"
+  integrity sha512-QgXo+mXTe8ljeqUFaX3QVHc5osSItJ/Km+xpocx0aSqWGMSCf6qYs/VnzZgS864Pjn5iceMRFigeAV7AfTlaig==
   dependencies:
-    tslib "^2.0.1"
+    tslib "^2.7.0"
 
 file-uri-to-path@1.0.0:
   version "1.0.0"
@@ -5899,12 +5891,12 @@ flush-write-stream@^1.0.0:
     inherits "^2.0.3"
     readable-stream "^2.3.6"
 
-focus-trap@6.9.2:
-  version "6.9.2"
-  resolved "https://registry.yarnpkg.com/focus-trap/-/focus-trap-6.9.2.tgz#a9ef72847869bd2cbf62cb930aaf8e138fef1ca9"
-  integrity sha512-gBEuXOPNOKPrLdZpMFUSTyIo1eT2NSZRrwZ9r/0Jqw5tmT3Yvxfmu8KBHw8xW2XQkw6E/JoG+OlEq7UDtSUNgw==
+focus-trap@7.6.2:
+  version "7.6.2"
+  resolved "https://registry.yarnpkg.com/focus-trap/-/focus-trap-7.6.2.tgz#a501988821ca23d0150a7229eb7a20a3695bdf0e"
+  integrity sha512-9FhUxK1hVju2+AiQIDJ5Dd//9R2n2RAfJ0qfhF4IHGHgcoEUTMpbTeG/zbEuwaiYXfuAH6XE0/aCyxDdRM+W5w==
   dependencies:
-    tabbable "^5.3.2"
+    tabbable "^6.2.0"
 
 follow-redirects@^1.0.0, follow-redirects@^1.14.0, follow-redirects@^1.14.9:
   version "1.15.4"
@@ -8011,7 +8003,7 @@ loglevel@^1.6.8:
   resolved "https://registry.yarnpkg.com/loglevel/-/loglevel-1.6.8.tgz#8a25fb75d092230ecd4457270d80b54e28011171"
   integrity sha512-bsU7+gc9AJ2SqpzxwU3+1fedl8zAntbtC5XYlt3s2j1hJcn2PsXSmgN8TaLG/J1/2mod4+cE/3vNL70/c1RNCA==
 
-loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:
+loose-envify@^1.1.0, loose-envify@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
   integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
@@ -9463,11 +9455,6 @@ pnp-webpack-plugin@1.6.4:
   dependencies:
     ts-pnp "^1.1.6"
 
-popper.js@^1.16.0:
-  version "1.16.1"
-  resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.16.1.tgz#2a223cb3dc7b6213d740e40372be40de43e65b1b"
-  integrity sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==
-
 portfinder@^1.0.26:
   version "1.0.28"
   resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.28.tgz#67c4622852bd5374dd1dd900f779f53462fac778"
@@ -10314,15 +10301,7 @@ prompts@2.4.0, prompts@^2.0.1:
     kleur "^3.0.3"
     sisteransi "^1.0.5"
 
-prop-types-extra@^1.1.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/prop-types-extra/-/prop-types-extra-1.1.1.tgz#58c3b74cbfbb95d304625975aa2f0848329a010b"
-  integrity sha512-59+AHNnHYCdiC+vMwY52WmvP5dM3QLeoumYuEyceQDi9aEhtwN9zIQ2ZNo25sMyXnbh32h+P1ezDsUpUH3JAew==
-  dependencies:
-    react-is "^16.3.2"
-    warning "^4.0.0"
-
-prop-types@^15.0.0, prop-types@^15.6.2, prop-types@^15.7.2, prop-types@^15.8.1:
+prop-types@^15.0.0, prop-types@^15.7.2, prop-types@^15.8.1:
   version "15.8.1"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
   integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
@@ -10554,15 +10533,14 @@ react-dom@^17.0.1:
     object-assign "^4.1.1"
     scheduler "^0.20.1"
 
-react-dropzone@9.0.0:
-  version "9.0.0"
-  resolved "https://registry.yarnpkg.com/react-dropzone/-/react-dropzone-9.0.0.tgz#4f5223cdcb4d3bd8a66e3298c4041eb0c75c4634"
-  integrity sha512-wZ2o9B2qkdE3RumWhfyZT9swgJYJPeU5qHEcMU8weYpmLex1eeWX0CC32/Y0VutB+BBi2D+iePV/YZIiB4kZGw==
+react-dropzone@^14.2.3:
+  version "14.3.8"
+  resolved "https://registry.yarnpkg.com/react-dropzone/-/react-dropzone-14.3.8.tgz#a7eab118f8a452fe3f8b162d64454e81ba830582"
+  integrity sha512-sBgODnq+lcA4P296DY4wacOZz3JFpD99fp+hb//iBO2HHnyeZU3FwWyXJ6salNpqQdsZrgMrotuko/BdJMV8Ug==
   dependencies:
-    attr-accept "^1.1.3"
-    file-selector "^0.1.8"
-    prop-types "^15.6.2"
-    prop-types-extra "^1.1.0"
+    attr-accept "^2.2.4"
+    file-selector "^2.1.0"
+    prop-types "^15.8.1"
 
 react-error-overlay@^6.0.9:
   version "6.0.9"
@@ -10581,7 +10559,7 @@ react-feather@^2.0.9:
   dependencies:
     prop-types "^15.7.2"
 
-react-is@^16.13.1, react-is@^16.3.2, react-is@^16.7.0:
+react-is@^16.13.1, react-is@^16.7.0:
   version "16.13.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
   integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
@@ -12080,10 +12058,10 @@ symbol-tree@^3.2.4:
   resolved "https://registry.yarnpkg.com/symbol-tree/-/symbol-tree-3.2.4.tgz#430637d248ba77e078883951fb9aa0eed7c63fa2"
   integrity sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==
 
-tabbable@^5.3.2:
-  version "5.3.3"
-  resolved "https://registry.yarnpkg.com/tabbable/-/tabbable-5.3.3.tgz#aac0ff88c73b22d6c3c5a50b1586310006b47fbf"
-  integrity sha512-QD9qKY3StfbZqWOPLp0++pOrAVb/HbUi5xCc8cUo4XjP19808oaMiDzn0leBY5mCespIBM0CIZePzZjgzR83kA==
+tabbable@^6.2.0:
+  version "6.2.0"
+  resolved "https://registry.yarnpkg.com/tabbable/-/tabbable-6.2.0.tgz#732fb62bc0175cfcec257330be187dcfba1f3b97"
+  integrity sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==
 
 table@^5.2.3:
   version "5.4.6"
@@ -12273,13 +12251,6 @@ tiny-warning@^1.0.2:
   resolved "https://registry.yarnpkg.com/tiny-warning/-/tiny-warning-1.0.3.tgz#94a30db453df4c643d0fd566060d60a875d84754"
   integrity sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==
 
-tippy.js@5.1.2:
-  version "5.1.2"
-  resolved "https://registry.yarnpkg.com/tippy.js/-/tippy.js-5.1.2.tgz#5ac91233c59ab482ef5988cffe6e08bd26528e66"
-  integrity sha512-Qtrv2wqbRbaKMUb6bWWBQWPayvcDKNrGlvihxtsyowhT7RLGEh1STWuy6EMXC6QLkfKPB2MLnf8W2mzql9VDAw==
-  dependencies:
-    popper.js "^1.16.0"
-
 tmp@^0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.2.1.tgz#8457fc3037dcf4719c251367a1af6500ee1ccf14"
@@ -12408,11 +12379,16 @@ tslib@^1.10.0, tslib@^1.8.1, tslib@^1.9.0:
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.11.1.tgz#eb15d128827fbee2841549e171f45ed338ac7e35"
   integrity sha512-aZW88SY8kQbU7gpV19lN24LtXh/yD4ZZg6qieAJDDg+YBsJcSmLGK9QpnUjAKVG/xefmvJGd1WUmfpT/g6AJGA==
 
-tslib@^2.0.0, tslib@^2.0.1, tslib@^2.1.0:
+tslib@^2.0.0, tslib@^2.1.0:
   version "2.6.0"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.0.tgz#b295854684dbda164e181d259a22cd779dcd7bc3"
   integrity sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA==
 
+tslib@^2.7.0:
+  version "2.8.1"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.8.1.tgz#612efe4ed235d567e8aba5f2a5fab70280ade83f"
+  integrity sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==
+
 tsutils@^3.17.1:
   version "3.17.1"
   resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.17.1.tgz#ed719917f11ca0dee586272b2ac49e015a2dd759"
@@ -12871,13 +12847,6 @@ walker@^1.0.7, walker@~1.0.5:
   dependencies:
     makeerror "1.0.x"
 
-warning@^4.0.0:
-  version "4.0.3"
-  resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3"
-  integrity sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==
-  dependencies:
-    loose-envify "^1.0.0"
-
 watchpack-chokidar2@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/watchpack-chokidar2/-/watchpack-chokidar2-2.0.1.tgz#38500072ee6ece66f3769936950ea1771be1c957"