diff --git a/ui/apps/platform/cypress/integration/clusters/discovered-clusters/DiscoveredClusters.helpers.js b/ui/apps/platform/cypress/integration/clusters/discovered-clusters/DiscoveredClusters.helpers.js
index cac634494b701..21102c80dcf7c 100644
--- a/ui/apps/platform/cypress/integration/clusters/discovered-clusters/DiscoveredClusters.helpers.js
+++ b/ui/apps/platform/cypress/integration/clusters/discovered-clusters/DiscoveredClusters.helpers.js
@@ -44,7 +44,7 @@ export function assertSortByColumn(text, direction, search) {
 
 export function sortByColumn(text) {
     return interactAndWaitForResponses(() => {
-        cy.get(`th:contains("${text}")`).click();
+        cy.get(`th button:contains("${text}")`).click();
     }, routeMatcherMapForTable);
 }
 
diff --git a/ui/apps/platform/src/Components/CodeViewer.tsx b/ui/apps/platform/src/Components/CodeViewer.tsx
index f3d1b1fb8dba4..455c1f657a16f 100644
--- a/ui/apps/platform/src/Components/CodeViewer.tsx
+++ b/ui/apps/platform/src/Components/CodeViewer.tsx
@@ -81,7 +81,6 @@ export default function CodeViewer({
             <CodeBlockAction>
                 <ClipboardCopyButton
                     id="copy-code-button"
-                    textId="copy-code-button"
                     aria-label="Copy code to clipboard"
                     onClick={() => copyToClipboard(code)}
                     exitDelay={wasCopied ? 1500 : 600}
diff --git a/ui/apps/platform/src/Components/PatternFly/ErrorBoundary/ErrorBoundaryCodeBlock.tsx b/ui/apps/platform/src/Components/PatternFly/ErrorBoundary/ErrorBoundaryCodeBlock.tsx
index 0597ec521ba72..c73fc4e235336 100644
--- a/ui/apps/platform/src/Components/PatternFly/ErrorBoundary/ErrorBoundaryCodeBlock.tsx
+++ b/ui/apps/platform/src/Components/PatternFly/ErrorBoundary/ErrorBoundaryCodeBlock.tsx
@@ -10,7 +10,6 @@ import useClipboardCopy from 'hooks/useClipboardCopy';
 export type ErrorBoundaryCodeBlockProps = {
     code: string;
     idForButton: string;
-    idForContent: string;
     phraseForCopied: string;
     phraseForCopy: string;
 };
@@ -18,7 +17,6 @@ export type ErrorBoundaryCodeBlockProps = {
 function ErrorBoundaryCodeBlock({
     code,
     idForButton,
-    idForContent,
     phraseForCopied,
     phraseForCopy,
 }: ErrorBoundaryCodeBlockProps): ReactElement {
@@ -30,7 +28,6 @@ function ErrorBoundaryCodeBlock({
                 aria-label={phraseForCopy}
                 id={idForButton}
                 onClick={() => copyToClipboard(code)}
-                textId={idForContent}
                 variant="plain"
             >
                 {wasCopied ? phraseForCopied : phraseForCopy}
diff --git a/ui/apps/platform/src/Components/PatternFly/ErrorBoundary/ErrorBoundaryPage.tsx b/ui/apps/platform/src/Components/PatternFly/ErrorBoundary/ErrorBoundaryPage.tsx
index ee5f6bf34bb66..bb2531bbf6aca 100644
--- a/ui/apps/platform/src/Components/PatternFly/ErrorBoundary/ErrorBoundaryPage.tsx
+++ b/ui/apps/platform/src/Components/PatternFly/ErrorBoundary/ErrorBoundaryPage.tsx
@@ -55,7 +55,6 @@ function ErrorBoundaryPage({ error, errorInfo }: ErrorBoundaryPageProps): ReactE
                     <ErrorBoundaryCodeBlock
                         code={error.message}
                         idForButton="error-boundary-button-error-message"
-                        idForContent="error-boundary-content-error-message"
                         phraseForCopied="Copied to clipboard: Error message"
                         phraseForCopy="Copy to clipboard: Error message"
                     />
@@ -82,7 +81,6 @@ function ErrorBoundaryPage({ error, errorInfo }: ErrorBoundaryPageProps): ReactE
                                 <ErrorBoundaryCodeBlock
                                     code={error.stack ?? ''}
                                     idForButton="error-boundary-button-error-stack"
-                                    idForContent="error-boundary-content-error-stack"
                                     phraseForCopied="Copied to clipboard: Error stack"
                                     phraseForCopy="Copy to clipboard: Error stack"
                                 />
@@ -104,7 +102,6 @@ function ErrorBoundaryPage({ error, errorInfo }: ErrorBoundaryPageProps): ReactE
                                 <ErrorBoundaryCodeBlock
                                     code={errorInfo.componentStack ?? ''}
                                     idForButton="error-boundary-button-component-stack"
-                                    idForContent="error-boundary-content-component-stack"
                                     phraseForCopied="Copied to clipboard: Component stack"
                                     phraseForCopy="Copy to clipboard: Component stack"
                                 />
diff --git a/ui/apps/platform/src/Containers/Clusters/ClusterPage.tsx b/ui/apps/platform/src/Containers/Clusters/ClusterPage.tsx
index 3489b806c7715..feb7420e52d63 100644
--- a/ui/apps/platform/src/Containers/Clusters/ClusterPage.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/ClusterPage.tsx
@@ -7,7 +7,6 @@ import {
     BreadcrumbItem,
     Bullseye,
     Button,
-    Divider,
     Flex,
     FlexItem,
     PageSection,
@@ -294,14 +293,13 @@ function ClusterPage({ clusterId }: ClusterPageProps): ReactElement {
     return (
         <>
             <PageTitle title="Cluster" />
-            <PageSection hasBodyWrapper={false}>
+            <PageSection type="breadcrumb">
                 <Breadcrumb>
                     <BreadcrumbItemLink to={clustersBasePath}>Clusters</BreadcrumbItemLink>
                     <BreadcrumbItem isActive>{selectedClusterName}</BreadcrumbItem>
                 </Breadcrumb>
             </PageSection>
-            <Divider component="div" />
-            <PageSection hasBodyWrapper={false}>
+            <PageSection>
                 <Flex direction={{ default: 'column' }} spaceItems={{ default: 'spaceItemsMd' }}>
                     <Flex
                         direction={{ default: 'row' }}
diff --git a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretForm.tsx b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretForm.tsx
index 5d4a36a3b0b06..5b79a7ff7762f 100644
--- a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretForm.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretForm.tsx
@@ -4,7 +4,6 @@ import {
     ActionGroup,
     Alert,
     Button,
-    Divider,
     Flex,
     Form,
     PageSection,
@@ -90,8 +89,7 @@ function ClusterRegistrationSecretForm(): ReactElement {
     return (
         <>
             <ClusterRegistrationSecretsHeader title="Create cluster registration secret" />
-            <Divider component="div" />
-            <PageSection hasBodyWrapper={false}>
+            <PageSection>
                 <Flex direction={{ default: 'column' }}>
                     <Form>
                         <FormLabelGroup
diff --git a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretPage.tsx b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretPage.tsx
index 18ae057b33a5c..c04280498c7b0 100644
--- a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretPage.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretPage.tsx
@@ -62,7 +62,7 @@ function ClusterRegistrationSecretPage({
                 headerActions={headerActions}
                 title="Cluster registration secret"
             />
-            <PageSection hasBodyWrapper={false} component="div">
+            <PageSection component="div">
                 {isFetching ? (
                     <Bullseye>
                         <Spinner />
diff --git a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretsHeader.tsx b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretsHeader.tsx
index 0f849e145991a..ffc6621ffe445 100644
--- a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretsHeader.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretsHeader.tsx
@@ -25,9 +25,9 @@ function ClusterRegistrationSecretsHeader({
     title,
 }: ClusterRegistrationSecretsHeaderProps): ReactElement {
     return (
-        <PageSection hasBodyWrapper={false} component="div">
+        <>
             <PageTitle title={title} />
-            <Flex direction={{ default: 'column' }}>
+            <PageSection type="breadcrumb">
                 <Breadcrumb>
                     <BreadcrumbItemLink to={clustersBasePath}>Clusters</BreadcrumbItemLink>
                     {title !== titleClusterRegistrationSecrets && (
@@ -37,6 +37,8 @@ function ClusterRegistrationSecretsHeader({
                     )}
                     <BreadcrumbItem isActive>{title}</BreadcrumbItem>
                 </Breadcrumb>
+            </PageSection>
+            <PageSection component="div">
                 <Flex alignItems={{ default: 'alignItemsCenter' }}>
                     <Flex
                         direction={{ default: 'column' }}
@@ -52,8 +54,8 @@ function ClusterRegistrationSecretsHeader({
                         <FlexItem align={{ default: 'alignRight' }}>{headerActions}</FlexItem>
                     )}
                 </Flex>
-            </Flex>
-        </PageSection>
+            </PageSection>
+        </>
     );
 }
 
diff --git a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretsPage.tsx b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretsPage.tsx
index b452ec50a656a..0889f0250a56c 100644
--- a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretsPage.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/ClusterRegistrationSecretsPage.tsx
@@ -62,7 +62,7 @@ function ClusterRegistrationSecretsPage({
                 headerActions={headerActions}
                 title={titleClusterRegistrationSecrets}
             />
-            <PageSection component="div" hasBodyWrapper={false}>
+            <PageSection component="div">
                 {isFetching ? (
                     <Bullseye>
                         <Spinner />
diff --git a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/SecureClusterPage.tsx b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/SecureClusterPage.tsx
index 72e52e47d2edd..622358e494024 100644
--- a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/SecureClusterPage.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/SecureClusterPage.tsx
@@ -1,25 +1,19 @@
 import type { ReactElement } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
-import qs from 'qs';
 import {
     Alert,
     Breadcrumb,
     BreadcrumbItem,
-    Divider,
-    Flex,
-    FlexItem,
     PageSection,
+    Tab,
+    TabTitleText,
+    Tabs,
     Title,
 } from '@patternfly/react-core';
 
 import BreadcrumbItemLink from 'Components/BreadcrumbItemLink';
 import PageTitle from 'Components/PageTitle';
-import TabNav from 'Components/TabNav/TabNav';
-import {
-    clustersBasePath,
-    clustersClusterRegistrationSecretsPath,
-    clustersSecureClusterCrsPath,
-} from 'routePaths';
+import useURLStringUnion from 'hooks/useURLStringUnion';
+import { clustersBasePath, clustersClusterRegistrationSecretsPath } from 'routePaths';
 
 import SecureClusterUsingHelmChart from './SecureClusterUsingHelmChart';
 import SecureClusterUsingOperator from './SecureClusterUsingOperator';
@@ -27,64 +21,62 @@ import SecureClusterUsingOperator from './SecureClusterUsingOperator';
 const title = 'Secure a cluster with a cluster registration secret';
 const headingLevel = 'h2';
 
-const tabHelmChart = 'Helm-chart';
-const titleOperator = 'Operator';
-const titleHelmChart = 'Helm chart';
-const tabLinks = [
-    {
-        href: `${clustersSecureClusterCrsPath}?tab=Operator`,
-        title: titleOperator,
-    },
-    {
-        href: `${clustersSecureClusterCrsPath}?tab=${tabHelmChart}`,
-        title: titleHelmChart,
-    },
-];
+const operatorTab = 'Operator';
+const helmChartTab = 'Helm chart';
 
 function SecureClusterPage(): ReactElement {
-    const { search } = useLocation();
-    const { tab } = qs.parse(search, { ignoreQueryPrefix: true });
-    const isOperator = tab !== tabHelmChart;
+    const [activeTabKey, setActiveTabKey] = useURLStringUnion('tab', [operatorTab, helmChartTab]);
 
     return (
         <>
-            <PageSection hasBodyWrapper={false} component="div">
-                <PageTitle title="Secure a cluster" />
-                <Flex direction={{ default: 'column' }}>
-                    <Flex
-                        direction={{ default: 'column' }}
-                        spaceItems={{ default: 'spaceItemsMd' }}
+            <PageTitle title="Secure a cluster" />
+            <PageSection type="breadcrumb">
+                <Breadcrumb>
+                    <BreadcrumbItemLink to={clustersBasePath}>Clusters</BreadcrumbItemLink>
+                    <BreadcrumbItemLink to={clustersClusterRegistrationSecretsPath}>
+                        Cluster registration secrets
+                    </BreadcrumbItemLink>
+                    <BreadcrumbItem isActive>{title}</BreadcrumbItem>
+                </Breadcrumb>
+            </PageSection>
+            <PageSection>
+                <Title headingLevel="h1">Secure a cluster with a cluster registration secret</Title>
+            </PageSection>
+            <PageSection type="tabs">
+                <Tabs
+                    activeKey={activeTabKey}
+                    onSelect={(_event, tabKey) => setActiveTabKey(tabKey)}
+                    usePageInsets
+                    mountOnEnter
+                    unmountOnExit
+                >
+                    <Tab
+                        eventKey={operatorTab}
+                        title={<TabTitleText>{operatorTab}</TabTitleText>}
+                        tabContentId={operatorTab}
                     >
-                        <Breadcrumb>
-                            <BreadcrumbItemLink to={clustersBasePath}>Clusters</BreadcrumbItemLink>
-                            <BreadcrumbItemLink to={clustersClusterRegistrationSecretsPath}>
-                                Cluster registration secrets
-                            </BreadcrumbItemLink>
-                            <BreadcrumbItem isActive>{title}</BreadcrumbItem>
-                        </Breadcrumb>
-                        <Title headingLevel="h1">
-                            Secure a cluster with a cluster registration secret
-                        </Title>
-                    </Flex>
-                    <FlexItem>
-                        <TabNav
-                            currentTabTitle={isOperator ? titleOperator : titleHelmChart}
-                            tabLinks={tabLinks}
-                        />
-                        <Divider component="div" />
-                    </FlexItem>
-                    {isOperator ? (
-                        <SecureClusterUsingOperator headingLevel={headingLevel} />
-                    ) : (
-                        <SecureClusterUsingHelmChart headingLevel={headingLevel} />
-                    )}
-                    <Alert
-                        variant="info"
-                        isInline
-                        title="You can use one cluster registration secret to secure at most one cluster."
-                        component="p"
-                    />
-                </Flex>
+                        <PageSection>
+                            <SecureClusterUsingOperator headingLevel={headingLevel} />
+                        </PageSection>
+                    </Tab>
+                    <Tab
+                        eventKey={helmChartTab}
+                        title={<TabTitleText>{helmChartTab}</TabTitleText>}
+                        tabContentId={helmChartTab}
+                    >
+                        <PageSection>
+                            <SecureClusterUsingHelmChart headingLevel={headingLevel} />
+                        </PageSection>
+                    </Tab>
+                </Tabs>
+            </PageSection>
+            <PageSection>
+                <Alert
+                    variant="info"
+                    isInline
+                    title="You can use one cluster registration secret to secure at most one cluster."
+                    component="p"
+                />
             </PageSection>
         </>
     );
diff --git a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/SecureClusterUsingHelmChart.tsx b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/SecureClusterUsingHelmChart.tsx
index 71de4d834d4c9..4c6d892672ce3 100644
--- a/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/SecureClusterUsingHelmChart.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/ClusterRegistrationSecrets/SecureClusterUsingHelmChart.tsx
@@ -35,10 +35,9 @@ function SecureClusterUsingHelmChart({
     const actions = (
         <CodeBlockAction>
             <ClipboardCopyButton
-                aria-label="Copy to clipboard"
+                aria-label="Copy command to clipboard"
                 id="ClipboardCopyButton"
                 onClick={() => copyToClipboard(codeBlock)}
-                textId="CodeBlockCode"
                 variant="plain"
             >
                 {wasCopied ? 'Copied to clipboard' : 'Copy to clipboard'}
diff --git a/ui/apps/platform/src/Containers/Clusters/ClustersTablePanel.tsx b/ui/apps/platform/src/Containers/Clusters/ClustersTablePanel.tsx
index caf99afdece6c..2a7c8b23682e1 100644
--- a/ui/apps/platform/src/Containers/Clusters/ClustersTablePanel.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/ClustersTablePanel.tsx
@@ -274,7 +274,7 @@ function ClustersTablePanel({ selectedClusterId }: ClustersTablePanelProps) {
     // Conditionally render a subsequent error in addition to most recent successful respnse.
     return (
         <>
-            <PageSection variant="light" component="div" hasBodyWrapper={false}>
+            <PageSection>
                 <Flex
                     direction={{ default: 'row' }}
                     alignItems={{ default: 'alignItemsCenter' }}
@@ -365,11 +365,9 @@ function ClustersTablePanel({ selectedClusterId }: ClustersTablePanelProps) {
                         )}
                     </Flex>
                 </Flex>
-                <Content component="p" className="pf-v6-u-font-size-md">
-                    View the status of secured cluster services
-                </Content>
+                <Content component="p">View the status of secured cluster services</Content>
             </PageSection>
-            <PageSection hasBodyWrapper={false}>
+            <PageSection>
                 <Toolbar>
                     <ToolbarContent>
                         <CompoundSearchFilter
diff --git a/ui/apps/platform/src/Containers/Clusters/DelegateScanning/DelegateScanningPage.tsx b/ui/apps/platform/src/Containers/Clusters/DelegateScanning/DelegateScanningPage.tsx
index 2e470e99ac4e6..6b559d6afdcc4 100644
--- a/ui/apps/platform/src/Containers/Clusters/DelegateScanning/DelegateScanningPage.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/DelegateScanning/DelegateScanningPage.tsx
@@ -75,14 +75,14 @@ function DelegateScanningPage() {
     return (
         <>
             <PageTitle title={displayedPageTitle} />
-            <PageSection hasBodyWrapper={false}>
+            <PageSection type="breadcrumb">
+                <Breadcrumb>
+                    <BreadcrumbItemLink to={clustersBasePath}>Clusters</BreadcrumbItemLink>
+                    <BreadcrumbItem isActive>{displayedPageTitle}</BreadcrumbItem>
+                </Breadcrumb>
+            </PageSection>
+            <PageSection>
                 <Flex direction={{ default: 'column' }}>
-                    <FlexItem>
-                        <Breadcrumb>
-                            <BreadcrumbItemLink to={clustersBasePath}>Clusters</BreadcrumbItemLink>
-                            <BreadcrumbItem isActive>{displayedPageTitle}</BreadcrumbItem>
-                        </Breadcrumb>
-                    </FlexItem>
                     <Flex>
                         <FlexItem flex={{ default: 'flex_1' }}>
                             <Title headingLevel="h1">{displayedPageTitle}</Title>
@@ -106,7 +106,7 @@ function DelegateScanningPage() {
                 </Flex>
             </PageSection>
             <Divider component="div" />
-            <PageSection hasBodyWrapper={false}>
+            <PageSection>
                 {isLoading ? (
                     <Bullseye>
                         <Spinner />
diff --git a/ui/apps/platform/src/Containers/Clusters/DiscoveredClusters/DiscoveredClustersPage.tsx b/ui/apps/platform/src/Containers/Clusters/DiscoveredClusters/DiscoveredClustersPage.tsx
index f4915e97269e0..ef929fe2a072e 100644
--- a/ui/apps/platform/src/Containers/Clusters/DiscoveredClusters/DiscoveredClustersPage.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/DiscoveredClusters/DiscoveredClustersPage.tsx
@@ -6,7 +6,6 @@ import {
     BreadcrumbItem,
     Bullseye,
     Content,
-    Flex,
     PageSection,
     Spinner,
     Title,
@@ -87,25 +86,20 @@ function DiscoveredClustersPage(): ReactElement {
 
     return (
         <>
-            <PageSection hasBodyWrapper={false} component="div">
-                <PageTitle title={title} />
-                <Flex direction={{ default: 'column' }}>
-                    <Breadcrumb>
-                        <BreadcrumbItemLink to={clustersBasePath}>Clusters</BreadcrumbItemLink>
-                        <BreadcrumbItem isActive>{title}</BreadcrumbItem>
-                    </Breadcrumb>
-                    <Flex
-                        direction={{ default: 'column' }}
-                        spaceItems={{ default: 'spaceItemsSm' }}
-                    >
-                        <Title headingLevel="h1">{title}</Title>
-                        <Content component="p">
-                            Discovered clusters might not yet have secured cluster services.
-                        </Content>
-                    </Flex>
-                </Flex>
+            <PageTitle title={title} />
+            <PageSection type="breadcrumb">
+                <Breadcrumb>
+                    <BreadcrumbItemLink to={clustersBasePath}>Clusters</BreadcrumbItemLink>
+                    <BreadcrumbItem isActive>{title}</BreadcrumbItem>
+                </Breadcrumb>
+            </PageSection>
+            <PageSection>
+                <Title headingLevel="h1">{title}</Title>
+                <Content component="p">
+                    Discovered clusters might not yet have secured cluster services.
+                </Content>
             </PageSection>
-            <PageSection hasBodyWrapper={false} component="div">
+            <PageSection>
                 {currentDatetime === null ? (
                     <Bullseye>
                         <Spinner />
diff --git a/ui/apps/platform/src/Containers/Clusters/DiscoveredClusters/DiscoveredClustersTable.tsx b/ui/apps/platform/src/Containers/Clusters/DiscoveredClusters/DiscoveredClustersTable.tsx
index e2126dcf803de..85b11e06408e9 100644
--- a/ui/apps/platform/src/Containers/Clusters/DiscoveredClusters/DiscoveredClustersTable.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/DiscoveredClusters/DiscoveredClustersTable.tsx
@@ -40,7 +40,7 @@ function DiscoveredClustersTable({
     sourceNameMap,
 }: DiscoveredClustersTableProps): ReactElement {
     return (
-        <Table variant="compact" borders={false}>
+        <Table variant="compact">
             <Thead>
                 <Tr>
                     <Th width={25} sort={getSortParams(nameField)}>
diff --git a/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundleForm.tsx b/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundleForm.tsx
index dd99d27fbc682..1dbc8d771c71b 100644
--- a/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundleForm.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundleForm.tsx
@@ -5,7 +5,6 @@ import {
     ActionGroup,
     Alert,
     Button,
-    Divider,
     Flex,
     Form,
     FormGroup,
@@ -119,8 +118,7 @@ function InitBundleForm(): ReactElement {
     return (
         <>
             <InitBundlesHeader title="Create bundle" />
-            <Divider component="div" />
-            <PageSection hasBodyWrapper={false}>
+            <PageSection>
                 <Flex direction={{ default: 'column' }}>
                     <Form>
                         <FormLabelGroup
diff --git a/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlePage.tsx b/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlePage.tsx
index 89790af977fc0..b2ebfe733a67d 100644
--- a/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlePage.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlePage.tsx
@@ -56,7 +56,7 @@ function InitBundlePage({ hasWriteAccessForInitBundles, id }: InitBundlePageProp
     return (
         <>
             <InitBundlesHeader headerActions={headerActions} title="Cluster init bundle" />
-            <PageSection hasBodyWrapper={false} component="div">
+            <PageSection component="div">
                 {isFetching ? (
                     <Bullseye>
                         <Spinner />
diff --git a/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlesHeader.tsx b/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlesHeader.tsx
index 72a3d373bbe8c..b08b1136474a0 100644
--- a/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlesHeader.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlesHeader.tsx
@@ -22,9 +22,9 @@ export type InitBundlesHeaderProps = {
 
 function InitBundlesHeader({ headerActions, title }: InitBundlesHeaderProps): ReactElement {
     return (
-        <PageSection hasBodyWrapper={false} component="div">
+        <>
             <PageTitle title={title} />
-            <Flex direction={{ default: 'column' }}>
+            <PageSection type="breadcrumb">
                 <Breadcrumb>
                     <BreadcrumbItemLink to={clustersBasePath}>Clusters</BreadcrumbItemLink>
                     {title !== titleInitBundles && (
@@ -34,6 +34,8 @@ function InitBundlesHeader({ headerActions, title }: InitBundlesHeaderProps): Re
                     )}
                     <BreadcrumbItem isActive>{title}</BreadcrumbItem>
                 </Breadcrumb>
+            </PageSection>
+            <PageSection component="div">
                 <Flex alignItems={{ default: 'alignItemsCenter' }}>
                     <Flex
                         direction={{ default: 'column' }}
@@ -49,8 +51,8 @@ function InitBundlesHeader({ headerActions, title }: InitBundlesHeaderProps): Re
                         <FlexItem align={{ default: 'alignRight' }}>{headerActions}</FlexItem>
                     )}
                 </Flex>
-            </Flex>
-        </PageSection>
+            </PageSection>
+        </>
     );
 }
 
diff --git a/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlesPage.tsx b/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlesPage.tsx
index d97391a258a5a..f75ce0fba02fc 100644
--- a/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlesPage.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/InitBundles/InitBundlesPage.tsx
@@ -54,7 +54,7 @@ function InitBundlesPage({ hasWriteAccessForInitBundles }: InitBundlesPageProps)
     return (
         <>
             <InitBundlesHeader headerActions={headerActions} title={titleInitBundles} />
-            <PageSection hasBodyWrapper={false} component="div">
+            <PageSection component="div">
                 {isFetching ? (
                     <Bullseye>
                         <Spinner />
diff --git a/ui/apps/platform/src/Containers/Clusters/InitBundles/SecureClusterPage.tsx b/ui/apps/platform/src/Containers/Clusters/InitBundles/SecureClusterPage.tsx
index 94c88c71f52d0..f008beb58100e 100644
--- a/ui/apps/platform/src/Containers/Clusters/InitBundles/SecureClusterPage.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/InitBundles/SecureClusterPage.tsx
@@ -1,21 +1,19 @@
 import type { ReactElement } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
-import qs from 'qs';
 import {
     Alert,
     Breadcrumb,
     BreadcrumbItem,
-    Divider,
-    Flex,
-    FlexItem,
     PageSection,
+    Tab,
+    TabTitleText,
+    Tabs,
     Title,
 } from '@patternfly/react-core';
 
 import BreadcrumbItemLink from 'Components/BreadcrumbItemLink';
 import PageTitle from 'Components/PageTitle';
-import TabNav from 'Components/TabNav/TabNav';
-import { clustersBasePath, clustersInitBundlesPath, clustersSecureClusterPath } from 'routePaths';
+import useURLStringUnion from 'hooks/useURLStringUnion';
+import { clustersBasePath, clustersInitBundlesPath } from 'routePaths';
 
 import SecureClusterUsingHelmChart from './SecureClusterUsingHelmChart';
 import SecureClusterUsingOperator from './SecureClusterUsingOperator';
@@ -23,59 +21,62 @@ import SecureClusterUsingOperator from './SecureClusterUsingOperator';
 const title = 'Secure a cluster with an init bundle';
 const headingLevel = 'h2';
 
-const tabHelmChart = 'Helm-chart';
-const titleOperator = 'Operator';
-const titleHelmChart = 'Helm chart';
-const tabLinks = [
-    {
-        href: `${clustersSecureClusterPath}?tab=Operator`,
-        title: titleOperator,
-    },
-    {
-        href: `${clustersSecureClusterPath}?tab=${tabHelmChart}`,
-        title: titleHelmChart,
-    },
-];
+const operatorTab = 'Operator';
+const helmChartTab = 'Helm chart';
 
 function SecureClusterPage(): ReactElement {
-    const { search } = useLocation();
-    const { tab } = qs.parse(search, { ignoreQueryPrefix: true });
-    const isOperator = tab !== tabHelmChart;
+    const [activeTabKey, setActiveTabKey] = useURLStringUnion('tab', [operatorTab, helmChartTab]);
 
     return (
         <>
-            <PageSection hasBodyWrapper={false} component="div">
-                <PageTitle title="Secure a cluster" />
-                <Flex direction={{ default: 'column' }}>
-                    <Flex direction={{ default: 'column' }}>
-                        <Breadcrumb>
-                            <BreadcrumbItemLink to={clustersBasePath}>Clusters</BreadcrumbItemLink>
-                            <BreadcrumbItemLink to={clustersInitBundlesPath}>
-                                Cluster init bundles
-                            </BreadcrumbItemLink>
-                            <BreadcrumbItem isActive>{title}</BreadcrumbItem>
-                        </Breadcrumb>
-                        <Title headingLevel="h1">Secure a cluster with an init bundle</Title>
-                    </Flex>
-                    <FlexItem>
-                        <TabNav
-                            currentTabTitle={isOperator ? titleOperator : titleHelmChart}
-                            tabLinks={tabLinks}
-                        />
-                        <Divider component="div" />
-                    </FlexItem>
-                    {isOperator ? (
-                        <SecureClusterUsingOperator headingLevel={headingLevel} />
-                    ) : (
-                        <SecureClusterUsingHelmChart headingLevel={headingLevel} />
-                    )}
-                    <Alert
-                        variant="info"
-                        isInline
-                        title="You can use one bundle to secure multiple clusters that have the same installation method."
-                        component="p"
-                    />
-                </Flex>
+            <PageTitle title="Secure a cluster" />
+            <PageSection type="breadcrumb">
+                <Breadcrumb>
+                    <BreadcrumbItemLink to={clustersBasePath}>Clusters</BreadcrumbItemLink>
+                    <BreadcrumbItemLink to={clustersInitBundlesPath}>
+                        Cluster init bundles
+                    </BreadcrumbItemLink>
+                    <BreadcrumbItem isActive>{title}</BreadcrumbItem>
+                </Breadcrumb>
+            </PageSection>
+            <PageSection>
+                <Title headingLevel="h1">Secure a cluster with an init bundle</Title>
+            </PageSection>
+            <PageSection type="tabs">
+                <Tabs
+                    activeKey={activeTabKey}
+                    onSelect={(_event, tabKey) => setActiveTabKey(tabKey)}
+                    usePageInsets
+                    mountOnEnter
+                    unmountOnExit
+                >
+                    <Tab
+                        eventKey={operatorTab}
+                        title={<TabTitleText>{operatorTab}</TabTitleText>}
+                        tabContentId={operatorTab}
+                    >
+                        <PageSection>
+                            <SecureClusterUsingOperator headingLevel={headingLevel} />
+                        </PageSection>
+                    </Tab>
+                    <Tab
+                        eventKey={helmChartTab}
+                        title={<TabTitleText>{helmChartTab}</TabTitleText>}
+                        tabContentId={helmChartTab}
+                    >
+                        <PageSection>
+                            <SecureClusterUsingHelmChart headingLevel={headingLevel} />
+                        </PageSection>
+                    </Tab>
+                </Tabs>
+            </PageSection>
+            <PageSection>
+                <Alert
+                    variant="info"
+                    isInline
+                    title="You can use one bundle to secure multiple clusters that have the same installation method."
+                    component="p"
+                />
             </PageSection>
         </>
     );
diff --git a/ui/apps/platform/src/Containers/Clusters/InitBundles/SecureClusterUsingHelmChart.tsx b/ui/apps/platform/src/Containers/Clusters/InitBundles/SecureClusterUsingHelmChart.tsx
index 4d6903bd51be7..44a6c0f937541 100644
--- a/ui/apps/platform/src/Containers/Clusters/InitBundles/SecureClusterUsingHelmChart.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/InitBundles/SecureClusterUsingHelmChart.tsx
@@ -40,10 +40,9 @@ function SecureClusterUsingHelmChart({
     const actions = (
         <CodeBlockAction>
             <ClipboardCopyButton
-                aria-label="Copy to clipboard"
+                aria-label="Copy command to clipboard"
                 id="ClipboardCopyButton"
                 onClick={() => copyToClipboard(codeBlock)}
-                textId="CodeBlockCode"
                 variant="plain"
             >
                 {wasCopied ? 'Copied to clipboard' : 'Copy to clipboard'}
diff --git a/ui/apps/platform/src/Containers/Clusters/NoClustersPage.tsx b/ui/apps/platform/src/Containers/Clusters/NoClustersPage.tsx
index 1b7a0c7612ad0..8761792b4dcec 100644
--- a/ui/apps/platform/src/Containers/Clusters/NoClustersPage.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/NoClustersPage.tsx
@@ -101,7 +101,7 @@ function NoClustersPage({ isModalOpen, setIsModalOpen }): ReactElement {
                 component="p"
                 isInline
             />
-            <PageSection hasBodyWrapper={false}>
+            <PageSection>
                 {isLoading ? (
                     <Bullseye>
                         <Spinner />
diff --git a/ui/apps/platform/src/Containers/Clusters/cluster.helpers.tsx b/ui/apps/platform/src/Containers/Clusters/cluster.helpers.tsx
index 9e0ec7cfa90b2..418ebf77e54c0 100644
--- a/ui/apps/platform/src/Containers/Clusters/cluster.helpers.tsx
+++ b/ui/apps/platform/src/Containers/Clusters/cluster.helpers.tsx
@@ -129,17 +129,17 @@ const styleUninitialized = {
 
 const styleHealthy = {
     Icon: CheckCircleIcon,
-    fgColor: 'pf-v6-u-text-color-status-success',
+    fgColor: 'pf-v6-u-icon-color-status-success',
 };
 
 const styleDegraded = {
     Icon: ExclamationTriangleIcon,
-    fgColor: 'pf-v6-u-warning-color-100',
+    fgColor: 'pf-v6-u-icon-color-status-warning',
 };
 
 const styleUnhealthy = {
     Icon: ExclamationCircleIcon,
-    fgColor: 'pf-v6-u-text-color-status-danger',
+    fgColor: 'pf-v6-u-icon-color-status-danger',
 };
 
 const styleUnavailable = {
@@ -190,11 +190,11 @@ export const sensorUpgradeStyles = {
     current: styleHealthy,
     progress: {
         Icon: InProgressIcon,
-        fgColor: 'pf-v6-u-primary-color-100',
+        fgColor: 'pf-v6-u-icon-color-primary',
     },
     download: {
         Icon: DownloadCloud,
-        fgColor: 'pf-v6-u-link-color',
+        fgColor: 'pf-v6-u-text-color-link',
     },
     intervention: styleDegraded,
     failure: styleUnhealthy,