feat: change OCI punchout URL to point to an ICM Pipeline (#1702)

* ICM pipeline can handle OCI punchout functions `BACKGROUND_SEARCH` and `VALIDATE` better
* ICM redirects to the PWA only for catalog browsing and the detail function
+ needs ICM 12.2.0, 11.11.1 or 7.10.41.3
* ICM pipeline `ViewOCICatalogPWA-Start` is used for the OCI punchout URL
* added migration note and deprecation notes for similar PWA functionality

docs/guides/migrations.md

@@ -18,6 +18,9 @@ Previously it has been used to determine whether the 'privatecustomers' or the '
 Now the 'privatecustomers' REST resource is the new standard for b2c users.
 If your ICM doesn't support the new standard the method `getCustomerRestResource` of the [`app.facade`](../../src/app/core/facades/app.facade.ts) has to be adapted.
 
+With ICM 12.2.0, 11.11.1 or 7.10.41.3 the ICM server itself provides an OCI punchout URL (Pipeline) that works better for the OCI punchout functions `BACKGROUND_SEARCH` and `VALIDATE` than the similar now deprecated functionality in the PWA.
+For that reason the provided OCI Punchout URL is now pointing to the ICM pipeline `ViewOCICatalogPWA-Start` that handles the different functionalities and redirects to the PWA (configured as _External Base URL_ in ICM) only for catalog browsing and the detail function.
+
 ## From 5.1 to 5.2
 
 > [!NOTE]

src/app/core/store/core/configuration/configuration.selectors.ts

@@ -22,7 +22,7 @@ export const getICMServerURL = createSelector(getConfigurationState, state =>
   state.baseURL && state.server ? `${ssrBaseUrl || state.baseURL}/${state.server}` : undefined
 );
 
-export const getICMServerWebURL = createSelector(getConfigurationState, state =>
+const getICMServerWebURL = createSelector(getConfigurationState, state =>
   state.baseURL && state.serverWeb ? `${ssrBaseUrl || state.baseURL}/${state.serverWeb}` : undefined
 );
 

src/app/extensions/punchout/identity-provider/punchout-identity-provider.spec.ts

@@ -1,3 +1,4 @@
+/* eslint-disable etc/no-deprecated */
 import { TestBed, fakeAsync, tick } from '@angular/core/testing';
 import { ActivatedRouteSnapshot, Params, Router, UrlTree, convertToParamMap } from '@angular/router';
 import { MockStore, provideMockStore } from '@ngrx/store/testing';

src/app/extensions/punchout/identity-provider/punchout-identity-provider.ts

@@ -1,3 +1,4 @@
+/* eslint-disable etc/no-deprecated */
 import { HttpEvent, HttpHandler, HttpRequest } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { ActivatedRouteSnapshot, Router, UrlTree } from '@angular/router';
@@ -176,7 +177,7 @@ export class PunchoutIdentityProvider implements IdentityProvider {
     if (route.queryParamMap.get('FUNCTION') === 'DETAIL' && route.queryParamMap.get('PRODUCTID')) {
       return of(this.router.parseUrl(`/product/${route.queryParamMap.get('PRODUCTID')}`));
 
-      // Validation of Products
+      // Validation of Products - @deprecated This functionality should be handled by the ICM pipeline `ViewOCICatalogPWA-Start`.
     } else if (route.queryParamMap.get('FUNCTION') === 'VALIDATE' && route.queryParamMap.get('PRODUCTID')) {
       return this.punchoutService
         .getOciPunchoutProductData(route.queryParamMap.get('PRODUCTID'), route.queryParamMap.get('QUANTITY') || '1')
@@ -185,7 +186,7 @@ export class PunchoutIdentityProvider implements IdentityProvider {
           map(() => false)
         );
 
-      // Background Search
+      // Background Search - @deprecated: is now handled by the ICM ViewOCICatalogPWA-Start pipeline
     } else if (route.queryParamMap.get('FUNCTION') === 'BACKGROUND_SEARCH' && route.queryParamMap.get('SEARCHSTRING')) {
       return this.punchoutService.getOciPunchoutSearchData(route.queryParamMap.get('SEARCHSTRING')).pipe(
         tap(data => this.punchoutService.submitOciPunchoutData(data, false)),

src/app/extensions/punchout/pages/account-punchout/account-punchout-page.component.html

@@ -80,7 +80,7 @@ <h2 class="mt-1">
         <p>
           {{ 'account.punchout.oci.info.url.helptext' | translate }}
         </p>
-        <p>{{ ociPunchoutUrl }}</p>
+        <p>{{ ociPunchoutUrl$ | async }}</p>
       </ng-template>
       <ng-template [ngSwitchCase]="'cxml'">
         <p>

src/app/extensions/punchout/pages/account-punchout/account-punchout-page.component.spec.ts

@@ -63,6 +63,9 @@ describe('Account Punchout Page Component', () => {
     when(punchoutFacade.punchoutUsersByRoute$()).thenReturn(of(users));
     when(punchoutFacade.selectedPunchoutType$).thenReturn(of('oci'));
     when(appFacade.getRestEndpoint$).thenReturn(of('https://myBaseServerURL/INTERSHOP/rest/WFS/myChannel/rest'));
+    when(appFacade.getPipelineEndpoint$).thenReturn(
+      of('https://myBaseServerURL/INTERSHOP/web/WFS/myChannel/en_US/rest/USD')
+    );
     when(punchoutFacade.punchoutLoading$).thenReturn(of(false));
   });
 
@@ -114,4 +117,15 @@ describe('Account Punchout Page Component', () => {
       done();
     });
   });
+
+  it('should determine oci punchout url on init', done => {
+    fixture.detectChanges();
+
+    component.ociPunchoutUrl$.subscribe(url => {
+      expect(url).toMatchInlineSnapshot(
+        `"https://myBaseServerURL/INTERSHOP/web/WFS/myChannel/en_US/rest/USD/ViewOCICatalogPWA-Start?USERNAME=<USERNAME>&PASSWORD=<PASSWORD>&HOOK_URL=<HOOK_URL>"`
+      );
+      done();
+    });
+  });
 });

src/app/extensions/punchout/pages/account-punchout/account-punchout-page.component.ts

@@ -21,8 +21,8 @@ export class AccountPunchoutPageComponent implements OnInit {
   loading$: Observable<boolean>;
   error$: Observable<HttpError>;
 
-  ociPunchoutUrl = `${window.location.origin}/punchout?USERNAME=<USERNAME>&PASSWORD=<PASSWORD>&HOOK_URL=<HOOK_URL>`;
   cxmlPunchoutUrl$: Observable<string>;
+  ociPunchoutUrl$: Observable<string>;
 
   constructor(
     private accountFacade: AccountFacade,
@@ -42,6 +42,9 @@ export class AccountPunchoutPageComponent implements OnInit {
       withLatestFrom(this.accountFacade.customer$),
       map(([url, customer]) => `${url}/customers/${customer?.customerNo}/punchouts/cxml1.2/setuprequest`)
     );
+    this.ociPunchoutUrl$ = this.appFacade.getPipelineEndpoint$.pipe(
+      map(url => `${url}/ViewOCICatalogPWA-Start?USERNAME=<USERNAME>&PASSWORD=<PASSWORD>&HOOK_URL=<HOOK_URL>`)
+    );
   }
 
   deleteUser(user: PunchoutUser) {

src/app/extensions/punchout/services/punchout/punchout.service.ts

@@ -391,6 +391,8 @@ export class PunchoutService {
    *
    * @param productId   The product id (SKU) of the product to validate.
    * @param quantity     The quantity for the validation (default: '1').
+   *
+   * @deprecated This functionality should be handled by the ICM pipeline `ViewOCICatalogPWA-Start`.
    */
   getOciPunchoutProductData(productId: string, quantity = '1'): Observable<Attribute<string>[]> {
     if (!productId) {
@@ -420,6 +422,8 @@ export class PunchoutService {
    * Gets a JSON object with the necessary OCI punchout data for the background search.
    *
    * @param searchString   The search string to search punchout products.
+   *
+   * @deprecated This functionality should be handled by the ICM pipeline `ViewOCICatalogPWA-Start`.
    */
   getOciPunchoutSearchData(searchString: string): Observable<Attribute<string>[]> {
     if (!searchString) {