@openshift-assisted/ui-lib 2.51.2 → 2.52.0

package/lib/ocm/components/clusterWizard/ClusterDetailsForm.tsx

@@ -81,14 +81,19 @@ const ClusterDetailsForm = (props: ClusterDetailsFormProps) => {
         ) {
           resetPlatform = 'baremetal';
         }
-        const params = ClusterDetailsService.getClusterUpdateParams(values, resetPlatform);
+        const params = ClusterDetailsService.getClusterUpdateParams(
+          values,
+          resetPlatform,
+          cluster,
+          infraEnv,
+        );
         await handleClusterUpdate(cluster.id, params);
       } else {
-        const params = ClusterDetailsService.getClusterCreateParams(values);
+        const params = ClusterDetailsService.getClusterCreateParams(values, infraEnv);
         await handleClusterCreate(params);
       }
     },
-    [cluster, handleClusterCreate, handleClusterUpdate],
+    [cluster, infraEnv, handleClusterCreate, handleClusterUpdate],
   );
 
   const handleOnNext = React.useCallback(
@@ -166,11 +171,11 @@ const ClusterDetailsForm = (props: ClusterDetailsFormProps) => {
               {!isSingleClusterFeatureEnabled && (
                 <GridItem>
                   <Flex alignItems={{ default: 'alignItemsCenter' }} gap={{ default: 'gapSm' }}>
-                    <TechnologyPreview />
                     <InstallDisconnectedSwitch isDisabled={!!cluster} />
                     <span>
                       {t("ai:I'm installing on a disconnected/air-gapped/secured environment")}
                     </span>
+                    <TechnologyPreview />
                   </Flex>
                 </GridItem>
               )}

package/lib/ocm/components/clusterWizard/ClusterWizardContextProvider.tsx

@@ -13,16 +13,13 @@ import { HostsNetworkConfigurationType } from '../../services';
 import { defaultWizardSteps, staticIpFormViewSubSteps } from './constants';
 import { StaticIpView } from '../clusterConfiguration/staticIp/data/dataTypes';
 import { getStaticIpInfo } from '../clusterConfiguration/staticIp/data/fromInfraEnv';
-import {
-  AssistedInstallerOCMPermissionTypesListType,
-  useAlerts,
-  isThirdPartyCNI,
-} from '../../../common';
+import { AssistedInstallerOCMPermissionTypesListType, useAlerts } from '../../../common';
 import useSetClusterPermissions from '../../hooks/useSetClusterPermissions';
 import { Cluster, InfraEnv } from '@openshift-assisted/types/assisted-installer-service';
 import { useUISettings } from '../../hooks';
 import { AlertVariant } from '@patternfly/react-core';
 import { useFeature } from '../../hooks/use-feature';
+import { isThirdPartyCNI } from '../../../common/types/networkType';
 import { isOciPlatformType } from '../utils';
 
 const addStepToClusterWizard = (

package/lib/ocm/components/clusterWizard/NewClusterWizard.tsx

@@ -19,6 +19,7 @@ const getCurrentStep = (currentStepId: ClusterWizardStepsType) => {
 
 const NewClusterWizard: React.FC = () => {
   const { currentStepId } = useClusterWizardContext();
+
   return (
     <div className={classNames('pf-v6-c-wizard', 'cluster-wizard')}>
       {getCurrentStep(currentStepId)}

package/lib/ocm/components/clusters/ClusterPage.tsx

@@ -14,7 +14,6 @@ import CancelInstallationModal from '../clusterDetail/CancelInstallationModal';
 import ResetClusterModal from '../clusterDetail/ResetClusterModal';
 import { AddHosts } from '../AddHosts';
 import { ClusterDefaultConfigurationProvider } from '../clusterConfiguration/ClusterDefaultConfigurationContext';
-import ClusterBreadcrumbs from './ClusterBreadcrumbs';
 import ClusterWizard from '../clusterWizard/ClusterWizard';
 import { ModalDialogsContextProvider } from '../hosts/ModalDialogsContext';
 import { useClusterPolling, useFetchCluster } from './clusterPolling';
@@ -37,11 +36,11 @@ import { OpenShiftVersionsContextProvider } from '../clusterWizard/OpenShiftVers
 
 const ClusterPageGeneric = ({
   clusterId,
-  showBreadcrumbs = false,
+  showHeader = false,
   resetModal,
 }: {
   clusterId: string;
-  showBreadcrumbs?: boolean;
+  showHeader?: boolean;
   resetModal?: React.ReactNode;
 }) => {
   const fetchCluster = useFetchCluster(clusterId);
@@ -89,7 +88,6 @@ const ClusterPageGeneric = ({
     ) {
       return (
         <>
-          {showBreadcrumbs && <ClusterBreadcrumbs clusterName={cluster.name} />}
           <PageSection hasBodyWrapper={false}>
             <Content component="h1">{cluster.name}</Content>
           </PageSection>
@@ -101,8 +99,7 @@ const ClusterPageGeneric = ({
     } else {
       return (
         <>
-          {showBreadcrumbs && <ClusterBreadcrumbs clusterName={cluster.name} />}
-          {showBreadcrumbs && (
+          {showHeader && (
             <PageSection hasBodyWrapper={false}>
               <AssistedInstallerHeader />
             </PageSection>
@@ -214,7 +211,7 @@ export const ClusterPage = () => {
   const { clusterId } = useParams<{ clusterId: string }>();
   return (
     <AlertsContextProvider>
-      <ClusterPageGeneric clusterId={clusterId || ''} showBreadcrumbs />
+      <ClusterPageGeneric clusterId={clusterId || ''} showHeader />
     </AlertsContextProvider>
   );
 };

package/lib/ocm/components/clusters/Clusters.tsx

@@ -15,7 +15,6 @@ import {
 import ClustersTable from './ClustersTable';
 import { fetchClustersAsync, deleteCluster } from '../../store/slices/clusters/slice';
 import { handleApiError, getApiErrorMessage } from '../../../common/api';
-import ClusterBreadcrumbs from './ClusterBreadcrumbs';
 import { ClustersService } from '../../services';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
 import ClusterPollingErrorModal from '../clusterDetail/ClusterPollingErrorModal';
@@ -106,7 +105,6 @@ const Clusters = () => {
       } else {
         return (
           <>
-            <ClusterBreadcrumbs />
             <PageSection hasBodyWrapper={false}>
               <Content component="h1">Assisted Clusters</Content>
             </PageSection>

package/lib/ocm/components/clusters/ClustersTable.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import {
   Table,
+  TableText,
   Thead,
   Tr,
   Th,
@@ -167,7 +168,7 @@ const ClustersTable = ({ rows, deleteCluster }: ClustersTableProps) => {
                 width={col.cellWidth as BaseCellProps['width']}
                 sort={getSortParams(i)}
               >
-                {col.title}
+                <TableText>{col.title}</TableText>
               </Th>
             ))}
             <Th key="col-action" />
@@ -176,15 +177,14 @@ const ClustersTable = ({ rows, deleteCluster }: ClustersTableProps) => {
         <Tbody>
           {sortedRows.map((row, i) => (
             <Tr {...getRowProps(row.props as ClusterRowDataProps)} key={`row-${i}`}>
-              {row.cells?.map((cell, j) => (
-                <Td
-                  dataLabel={columns[j].title}
-                  key={`cell-${i}-${j}`}
-                  {...(cell as HumanizedSortable).props}
-                >
-                  {(cell as HumanizedSortable)?.title}
-                </Td>
-              ))}
+              {row.cells?.map((cell, j) => {
+                const humanized = cell as HumanizedSortable;
+                return (
+                  <Td dataLabel={columns[j].title} key={`cell-${i}-${j}`} {...humanized.props}>
+                    <TableText wrapModifier="breakWord">{humanized?.title}</TableText>
+                  </Td>
+                );
+              })}
               <Td isActionCell>
                 <ActionsColumn
                   items={[

package/lib/ocm/components/clusters/NewClusterPage.tsx

@@ -1,7 +1,6 @@
 import React from 'react';
 import { PageSection } from '@patternfly/react-core';
 import { AlertsContextProvider } from '../../../common';
-import ClusterBreadcrumbs from './ClusterBreadcrumbs';
 import { ClusterDefaultConfigurationProvider } from '../clusterConfiguration/ClusterDefaultConfigurationContext';
 import NewClusterWizard from '../clusterWizard/NewClusterWizard';
 import ClusterWizardContextProvider from '../clusterWizard/ClusterWizardContextProvider';
@@ -13,7 +12,7 @@ import { AssistedInstallerHeader } from './AssistedInstallerHeader';
 import { ModalDialogsContextProvider } from '../hosts/ModalDialogsContext';
 import { OpenShiftVersionsContextProvider } from '../clusterWizard/OpenShiftVersionsContext';
 
-const NewClusterPageGeneric = ({ children }: React.PropsWithChildren<unknown>) => {
+export const NewClusterPage = ({ children }: React.PropsWithChildren<unknown>) => {
   return (
     <AlertsContextProvider>
       <SentryErrorMonitorContextProvider>
@@ -41,10 +40,3 @@ const NewClusterPageGeneric = ({ children }: React.PropsWithChildren<unknown>) =
     </AlertsContextProvider>
   );
 };
-
-export const NewSingleClusterPage = () => <NewClusterPageGeneric />;
-export const NewClusterPage = () => (
-  <NewClusterPageGeneric>
-    <ClusterBreadcrumbs clusterName="New cluster" />
-  </NewClusterPageGeneric>
-);

package/lib/ocm/hooks/usePullSecret.ts

@@ -1,27 +1,52 @@
 import React from 'react';
-import { getApiErrorMessage, handleApiError } from '../../common/api';
+import { getApiErrorMessage, handleApiError, isInOcm } from '../../common/api';
 import { useAlerts } from '../../common';
 import { AccessTokenAPI } from '../../common/api/accounts-management-service/access-token-api';
 
-export default function usePullSecret() {
+/**
+ * Standalone / disconnected UI: bridge serves GET /pull-secret from a mounted manifest
+ * (see assisted-disconnected-ui proxy).
+ */
+async function fetchPullSecretFromBridge(): Promise<string | undefined> {
+  const res = await fetch('/api/pull-secret', { credentials: 'same-origin' });
+  if (!res.ok) {
+    throw new Error(`Unexpected status code ${res.status}`);
+  }
+  const text = (await res.text()).trim();
+  return text || undefined;
+}
+
+export default function usePullSecret(isSingleClusterFeatureEnabled?: boolean) {
   const [pullSecret, setPullSecret] = React.useState<string>();
   const { addAlert } = useAlerts();
 
   const getPullSecret = React.useCallback(async () => {
     try {
-      const accessTokenCfg = await AccessTokenAPI.fetchPullSecret();
-      if (accessTokenCfg) {
-        setPullSecret(JSON.stringify(accessTokenCfg)); // unmarshalled response as a string
-      } else {
-        setPullSecret('');
+      if (isInOcm) {
+        const accessTokenCfg = await AccessTokenAPI.fetchPullSecret();
+        if (accessTokenCfg) {
+          setPullSecret(JSON.stringify(accessTokenCfg)); // unmarshalled response as a string
+        } else {
+          setPullSecret('');
+        }
+        return;
       }
+
+      if (isSingleClusterFeatureEnabled) {
+        const fromBridge = await fetchPullSecretFromBridge();
+        setPullSecret(fromBridge ?? '');
+        return;
+      }
+
+      // Non-OCM multinode flow: user enters pull secret manually.
+      setPullSecret('');
     } catch (e) {
       handleApiError(e, (e) => {
         setPullSecret('');
         addAlert({ title: 'Failed to retrieve pull secret', message: getApiErrorMessage(e) });
       });
     }
-  }, [addAlert]);
+  }, [addAlert, isSingleClusterFeatureEnabled]);
 
   React.useEffect(() => {
     if (!pullSecret) {

package/lib/ocm/services/ClusterDetailsService.ts

@@ -33,8 +33,18 @@ const getExistingClusterCpuArchitecture = (infraEnv: InfraEnv) => {
   return infraEnv.cpuArchitecture || getDefaultCpuArchitecture();
 };
 
+const ntpSourceForCluster = (cluster?: Cluster, infraEnv?: InfraEnv): string | undefined => {
+  const fromCluster = cluster?.additionalNtpSource?.trim();
+  const fromInfra = infraEnv?.additionalNtpSources?.trim();
+  const merged = fromCluster || fromInfra;
+  return merged || undefined;
+};
+
 const ClusterDetailsService = {
-  getClusterCreateParams(values: OcmClusterDetailsValues): ClusterCreateParamsWithStaticNetworking {
+  getClusterCreateParams(
+    values: OcmClusterDetailsValues,
+    infraEnv?: InfraEnv,
+  ): ClusterCreateParamsWithStaticNetworking {
     const params: ClusterCreateParamsWithStaticNetworking = {
       name: values.name,
       controlPlaneCount: toNumber(values.controlPlaneCount),
@@ -72,12 +82,19 @@ const ClusterDetailsService = {
       delete params.platform;
     }
 
+    const ntp = ntpSourceForCluster(undefined, infraEnv);
+    if (ntp) {
+      params.additionalNtpSource = ntp;
+    }
+
     return params;
   },
 
   getClusterUpdateParams(
     values: OcmClusterDetailsValues,
     platform: PlatformType,
+    cluster?: Cluster,
+    infraEnv?: InfraEnv,
   ): ClusterDetailsUpdateParams {
     const params: ClusterDetailsUpdateParams = {
       name: values.name,
@@ -98,6 +115,11 @@ const ClusterDetailsService = {
           : { type: platform };
     }
 
+    const ntp = ntpSourceForCluster(cluster, infraEnv);
+    if (ntp) {
+      params.additionalNtpSource = ntp;
+    }
+
     return params;
   },
 

package/lib/ocm/services/ClustersService.ts

@@ -40,7 +40,7 @@ const ClustersService = {
       pullSecret: params.pullSecret,
       clusterId: cluster.id,
       openshiftVersion: params.openshiftVersion,
-      cpuArchitecture: params.cpuArchitecture as InfraEnvCreateParams['cpuArchitecture'],
+      cpuArchitecture: params.cpuArchitecture,
       staticNetworkConfig: params.staticNetworkConfig,
     };
 

package/lib/ocm/services/types.ts

@@ -7,7 +7,7 @@ import {
 
 export type ClusterDetailsUpdateParams = Pick<
   V2ClusterUpdateParams,
-  'name' | 'baseDnsDomain' | 'pullSecret' | 'platform'
+  'name' | 'baseDnsDomain' | 'pullSecret' | 'platform' | 'additionalNtpSource'
 >;
 
 export type ClusterCreateParamsWithStaticNetworking = ClusterCreateParams & {

package/package.json

@@ -1,14 +1,14 @@
 {
   "dependencies": {
-    "@openshift-assisted/locales": "2.51.2",
-    "@openshift-assisted/types": "2.51.2",
-    "@openshift-console/dynamic-plugin-sdk": "1.0.0",
+    "@openshift-assisted/locales": "2.52.0",
+    "@openshift-assisted/types": "2.52.0",
+    "@openshift-console/dynamic-plugin-sdk": "^4.19.1",
     "@patternfly/patternfly": "6.4.0",
-    "@patternfly/react-code-editor": "6.4.0",
-    "@patternfly/react-core": "6.4.0",
+    "@patternfly/react-code-editor": "6.4.1",
+    "@patternfly/react-core": "6.4.1",
     "@patternfly/react-icons": "6.4.0",
     "@patternfly/react-styles": "6.4.0",
-    "@patternfly/react-table": "6.4.0",
+    "@patternfly/react-table": "6.4.1",
     "@patternfly/react-tokens": "6.4.0",
     "@react-hook/resize-observer": "^2.0.2",
     "axios-case-converter": "^0.11.1",
@@ -41,7 +41,7 @@
     "@types/humanize-plus": "^1.8.0",
     "@types/js-yaml": "^4.0.1",
     "@types/lodash-es": "^4.17.6",
-    "@types/node": "^18.14.6",
+    "@types/node": "^24.0.0",
     "@types/react": "18.2.37",
     "@types/react-autosuggest": "^10.1.5",
     "@types/react-dom": "18.2.15",
@@ -93,11 +93,11 @@
     "@sentry/browser": "^5.9 || ^6",
     "axios": "^1.13.5",
     "i18next": "^20.4 || ^21",
-    "monaco-editor": "^0.44.0",
+    "monaco-editor": "^0.44.0 || ^0.55.0",
     "react": "^18",
     "react-dom": "^18",
     "react-i18next": ">11.7.3",
-    "react-monaco-editor": "^0.55.0",
+    "react-monaco-editor": "^0.55.0 || ^0.59.0",
     "react-redux": "^8.0.5",
     "react-router-dom-v5-compat": "^6.30.3",
     "redux": "^4",
@@ -136,5 +136,5 @@
       ]
     }
   },
-  "version": "2.51.2"
+  "version": "2.52.0"
 }

package/build/@types/ocm/components/clusters/ClusterBreadcrumbs.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-declare const ClusterBreadcrumbs: ({ clusterName }: {
-    clusterName?: string;
-}) => React.JSX.Element;
-export default ClusterBreadcrumbs;
-//# sourceMappingURL=ClusterBreadcrumbs.d.ts.map

package/build/@types/ocm/components/clusters/ClusterBreadcrumbs.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ClusterBreadcrumbs.d.ts","sourceRoot":"","sources":["../../../../../lib/ocm/components/clusters/ClusterBreadcrumbs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,QAAA,MAAM,kBAAkB,oBAAqB;IAAE,WAAW,CAAC,EAAE,MAAM,CAAA;CAAE,sBA4BpE,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/build/cjs/ocm/components/clusters/ClusterBreadcrumbs.js

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const react_core_1 = require("@patternfly/react-core");
-const react_router_dom_v5_compat_1 = require("react-router-dom-v5-compat");
-const api_1 = require("../../../common/api");
-const ClusterBreadcrumbs = ({ clusterName }) => (react_1.default.createElement(react_core_1.PageSection, { hasBodyWrapper: false }, (clusterName || api_1.isInOcm) && (react_1.default.createElement(react_core_1.Breadcrumb, { "data-testid": "cluster-breadcrumbs" },
-    api_1.isInOcm && (react_1.default.createElement(react_core_1.BreadcrumbItem, { "data-testid": "cluster-list-breadcrumb", render: () => react_1.default.createElement(react_router_dom_v5_compat_1.Link, { to: '/cluster-list' }, "Cluster List") })),
-    clusterName ? (react_1.default.createElement(react_core_1.BreadcrumbItem, { "data-testid": "assisted-clusters-breadcrumb" },
-        react_1.default.createElement(react_router_dom_v5_compat_1.Link, { to: `..` }, "Assisted Clusters"))) : (react_1.default.createElement(react_core_1.BreadcrumbItem, { isActive: true, "data-testid": "assisted-clusters-breadcrumb" }, "Assisted Clusters")),
-    clusterName && (react_1.default.createElement(react_core_1.BreadcrumbItem, { "data-testid": "cluster-breadcrumb", isActive: true }, clusterName))))));
-exports.default = ClusterBreadcrumbs;
-//# sourceMappingURL=ClusterBreadcrumbs.js.map

package/build/cjs/ocm/components/clusters/ClusterBreadcrumbs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ClusterBreadcrumbs.js","sourceRoot":"","sources":["../../../../../lib/ocm/components/clusters/ClusterBreadcrumbs.tsx"],"names":[],"mappings":";;;AAAA,0DAA0B;AAC1B,uDAAiF;AACjF,2EAAkD;AAClD,6CAA8C;AAE9C,MAAM,kBAAkB,GAAG,CAAC,EAAE,WAAW,EAA4B,EAAE,EAAE,CAAC,CACxE,8BAAC,wBAAW,IAAC,cAAc,EAAE,KAAK,IAC/B,CAAC,WAAW,IAAI,aAAO,CAAC,IAAI,CAC3B,8BAAC,uBAAU,mBAAa,qBAAqB;IAC1C,aAAO,IAAI,CACV,8BAAC,2BAAc,mBACD,yBAAyB,EACrC,MAAM,EAAE,GAAG,EAAE,CAAC,8BAAC,iCAAI,IAAC,EAAE,EAAE,eAAe,mBAAqB,GAC5D,CACH;IAEA,WAAW,CAAC,CAAC,CAAC,CACb,8BAAC,2BAAc,mBAAa,8BAA8B;QACxD,8BAAC,iCAAI,IAAC,EAAE,EAAE,IAAI,wBAA0B,CACzB,CAClB,CAAC,CAAC,CAAC,CACF,8BAAC,2BAAc,IAAC,QAAQ,uBAAa,8BAA8B,wBAElD,CAClB;IACA,WAAW,IAAI,CACd,8BAAC,2BAAc,mBAAa,oBAAoB,EAAC,QAAQ,UACtD,WAAW,CACG,CAClB,CACU,CACd,CACW,CACf,CAAC;AAEF,kBAAe,kBAAkB,CAAC"}

package/lib/ocm/components/clusters/ClusterBreadcrumbs.tsx

@@ -1,36 +0,0 @@
-import React from 'react';
-import { Breadcrumb, BreadcrumbItem, PageSection } from '@patternfly/react-core';
-import { Link } from 'react-router-dom-v5-compat';
-import { isInOcm } from '../../../common/api';
-
-const ClusterBreadcrumbs = ({ clusterName }: { clusterName?: string }) => (
-  <PageSection hasBodyWrapper={false}>
-    {(clusterName || isInOcm) && (
-      <Breadcrumb data-testid="cluster-breadcrumbs">
-        {isInOcm && (
-          <BreadcrumbItem
-            data-testid="cluster-list-breadcrumb"
-            render={() => <Link to={'/cluster-list'}>Cluster List</Link>}
-          />
-        )}
-
-        {clusterName ? (
-          <BreadcrumbItem data-testid="assisted-clusters-breadcrumb">
-            <Link to={`..`}>Assisted Clusters</Link>
-          </BreadcrumbItem>
-        ) : (
-          <BreadcrumbItem isActive data-testid="assisted-clusters-breadcrumb">
-            Assisted Clusters
-          </BreadcrumbItem>
-        )}
-        {clusterName && (
-          <BreadcrumbItem data-testid="cluster-breadcrumb" isActive>
-            {clusterName}
-          </BreadcrumbItem>
-        )}
-      </Breadcrumb>
-    )}
-  </PageSection>
-);
-
-export default ClusterBreadcrumbs;