feat: order recurrence (subscription support)

.github/workflows/demo-server-up.yml

@@ -11,7 +11,7 @@ on:
 #
 # 2. Change these variables for your configuration:
 env:
-  ICM_BASE_URL: https://review.icm.intershop.de
+  ICM_BASE_URL: https://develop.icm.intershop.de
 
 jobs:
   CancelPrevious:

.github/workflows/development.yml

@@ -14,7 +14,7 @@ on:
 
 env:
   NODE_VERSION: 18.16.0
-  ICM_BASE_URL: https://review.icm.intershop.de
+  ICM_BASE_URL: https://develop.icm.intershop.de
 
 jobs:
   CancelPrevious:

.github/workflows/integration.yml

@@ -15,7 +15,7 @@ on:
 env:
   NODE_VERSION: 18.16.0
   NODE_OPTIONS: --max_old_space_size=10240
-  ICM_BASE_URL: https://review.icm.intershop.de
+  ICM_BASE_URL: https://develop.icm.intershop.de
 
 jobs:
   CancelPrevious:

projects/requisition-management/src/app/components/checkout-receipt-requisition/checkout-receipt-requisition.component.html

@@ -10,7 +10,7 @@ <h1>
         <a
           [routerLink]="['/account/requisitions/buyer/' + req.id, { status: 'PENDING' }]"
           data-testing-id="requisition-number"
-          >{{ req.requisitionNo }}</a
+          >{{ req.requisitionNo || req.recurringOrderDocumentNo }}</a
         >
       </strong>
     </p>

projects/requisition-management/src/app/components/requisitions-list/requisitions-list.component.html

@@ -19,8 +19,14 @@
           [routerLink]="[requisition.id, { status: status }]"
           [attr.aria-label]="'account.approvallist.table.id_of_order.aria_label' | translate"
         >
-          {{ requisition.requisitionNo }}
+          {{ requisition.requisitionNo || requisition.recurringOrderDocumentNo }}
         </a>
+        <fa-icon
+          *ngIf="requisition.recurringOrderDocumentNo"
+          [icon]="['fas', 'repeat']"
+          [title]="'account.approvallist.table.id_of_order.recurring' | translate"
+          class="ml-1"
+        />
       </td>
     </ng-container>
 
@@ -34,7 +40,9 @@
         *cdkCellDef="let requisition"
         [attr.data-label]="'account.approvallist.table.no_of_order' | translate"
       >
-        <a [routerLink]="['../../orders/', requisition.id]">{{ requisition.orderNo }}</a>
+        <a [routerLink]="[requisition.orderNo ? '../../orders/' : '../../recurring-orders/', requisition.id]">
+          {{ requisition.orderNo || requisition.recurringOrderDocumentNo }}
+        </a>
       </td>
     </ng-container>
 
@@ -48,7 +56,7 @@
         *cdkCellDef="let requisition"
         [attr.data-label]="'account.approvallist.table.no_of_order' | translate"
       >
-        {{ requisition.orderNo }}
+        {{ requisition.orderNo || requisition.recurringOrderDocumentNo }}
       </td>
     </ng-container>
 

projects/requisition-management/src/app/models/requisition/requisition.interface.ts

@@ -9,6 +9,7 @@ import { RequisitionApproval, RequisitionUserBudget } from './requisition.model'
 export interface RequisitionBaseData extends BasketBaseData {
   requisitionNo: string;
   orderNo?: string;
+  recurringOrderDocumentNo?: string;
   order?: {
     itemId: string;
   };

projects/requisition-management/src/app/models/requisition/requisition.mapper.spec.ts

@@ -111,6 +111,8 @@ describe('Requisition Mapper', () => {
           "payment": undefined,
           "promotionCodes": undefined,
           "purchaseCurrency": "USD",
+          "recurrence": undefined,
+          "recurringOrderDocumentNo": undefined,
           "requisitionNo": "0001",
           "systemRejectErrors": [
             "some message",

projects/requisition-management/src/app/models/requisition/requisition.mapper.ts

@@ -24,6 +24,7 @@ export class RequisitionMapper {
           id: data.id,
           requisitionNo: data.requisitionNo,
           orderNo: data.orderNo,
+          recurringOrderDocumentNo: data.recurringOrderDocumentNo,
           creationDate: data.creationDate,
           userBudget: this.fromUserBudgets(data.userBudgets, data.purchaseCurrency),
           lineItemCount: data.lineItemCount,
@@ -64,7 +65,7 @@ export class RequisitionMapper {
       return (
         payload.data
           /* filter requisitions that didn't need an approval */
-          .filter(data => data.requisitionNo)
+          .filter(data => data.requisitionNo || data.recurringOrderDocumentNo)
           .map(data => ({
             ...this.fromData({ ...payload, data }),
             totals: {

projects/requisition-management/src/app/models/requisition/requisition.model.ts

@@ -39,6 +39,7 @@ type RequisitionBasket = Omit<AbstractBasket<LineItem>, 'approval'>;
 export interface Requisition extends RequisitionBasket {
   requisitionNo: string;
   orderNo?: string;
+  recurringOrderDocumentNo?: string;
   creationDate: number;
   lineItemCount: number;
 

projects/requisition-management/src/app/pages/requisition-detail/requisition-buyer-approval/requisition-buyer-approval.component.html

@@ -52,7 +52,8 @@
           *ngIf="requisition.approval.statusCode !== 'APPROVED'; else leftBudgetDisplay"
           class="row dl-horizontal dl-separator"
         >
-          <dt class="col-6">{{ 'approval.detailspage.budget.including_order.label' | translate }}</dt>
+          <!-- prettier-ignore -->
+          <dt class="col-6">{{ 'approval.detailspage.budget.including_order.label' | translate : { recurring: !requisition.requisitionNo } }}</dt>
           <dd class="col-6" [ngClass]="{ 'text-danger': spentPercentageIncludingThisRequisition > 1 }">
             {{
               requisition.userBudget?.spentBudgetIncludingThisRequisition || requisition.totals.total
@@ -80,5 +81,10 @@
         />
       </div>
     </div>
+    <div *ngIf="requisition.recurrence" class="row mb-3">
+      <div class="col-md-6">
+        <ish-order-recurrence [recurrence]="requisition.recurrence" labelCssClass="col-6" valueCssClass="col-6" />
+      </div>
+    </div>
   </ish-info-box>
 </div>

projects/requisition-management/src/app/pages/requisition-detail/requisition-cost-center-approval/requisition-cost-center-approval.component.html

@@ -33,7 +33,8 @@
             </dd>
           </dl>
           <dl *ngIf="requisition.approval.statusCode !== 'APPROVED'" class="row dl-horizontal dl-separator">
-            <dt class="col-6">{{ 'approval.detailspage.budget.including_order.label' | translate }}</dt>
+            <!-- prettier-ignore -->
+            <dt class="col-6">{{ 'approval.detailspage.budget.including_order.label' | translate : { recurring: !requisition.requisitionNo } }}</dt>
             <dd class="col-6" [ngClass]="{ 'text-danger': ccVal.spentPercentageIncludingThisRequisition > 1 }">
               {{ ccVal.spentBudgetIncludingThisRequisition | ishPrice }} ({{
                 ccVal.spentPercentageIncludingThisRequisition | percent
@@ -73,7 +74,8 @@
             </dd>
           </dl>
           <dl *ngIf="requisition.approval.statusCode !== 'APPROVED'" class="row dl-horizontal dl-separator">
-            <dt class="col-6">{{ 'approval.detailspage.budget.including_order.label' | translate }}</dt>
+            <!-- prettier-ignore -->
+            <dt class="col-6">{{ 'approval.detailspage.budget.including_order.label' | translate : { recurring: !requisition.requisitionNo } }}</dt>
             <dd class="col-6" [ngClass]="{ 'text-danger': bVal.spentPercentageIncludingThisRequisition > 1 }">
               {{ bVal.spentBudgetIncludingThisRequisition | ishPrice }} ({{
                 bVal.spentPercentageIncludingThisRequisition | percent
@@ -85,6 +87,12 @@
           <ish-budget-bar [budget]="buyer.budget" [spentBudget]="buyer.spentBudget" [additionalAmount]="orderTotal" />
         </div>
       </div>
+
+      <div *ngIf="requisition.recurrence" class="row mb-3">
+        <div class="col-md-6">
+          <ish-order-recurrence [recurrence]="requisition.recurrence" labelCssClass="col-6" valueCssClass="col-6" />
+        </div>
+      </div>
     </ish-info-box>
   </div>
 </ng-container>

projects/requisition-management/src/app/pages/requisition-detail/requisition-summary/requisition-summary.component.html

@@ -1,15 +1,21 @@
 <div *ngIf="requisition" class="section">
   <dl class="row dl-horizontal dl-separator">
     <dt class="col-6 col-sm-4 col-md-3">{{ 'approval.detailspage.order.request_id' | translate }}</dt>
-    <dd class="col-6 col-sm-8 col-md-9">{{ requisition.requisitionNo }}</dd>
+    <dd class="col-6 col-sm-8 col-md-9">{{ requisition.requisitionNo || requisition.recurringOrderDocumentNo }}</dd>
 
     <ng-container *ngIf="requisition.approval?.statusCode === 'APPROVED'">
-      <dt class="col-6 col-sm-4 col-md-3">{{ 'approval.detailspage.order_reference_id.label' | translate }}</dt>
+      <!-- prettier-ignore -->
+      <dt class="col-6 col-sm-4 col-md-3">{{ 'approval.detailspage.order_reference_id.label' | translate : { recurring: !requisition.requisitionNo } }}</dt>
       <dd class="col-6 col-sm-8 col-md-9">
-        <a *ngIf="view === 'buyer'; else noOrderLink" [routerLink]="'/account/orders/' + requisition.id">{{
-          requisition.orderNo
-        }}</a>
-        <ng-template #noOrderLink>{{ requisition.orderNo }}</ng-template>
+        <a
+          *ngIf="view === 'buyer'; else noOrderLink"
+          [routerLink]="[requisition.orderNo ? '/account/orders/' : '/account/recurring-orders/', requisition.id]"
+        >
+          {{ requisition.orderNo || requisition.recurringOrderDocumentNo }}
+        </a>
+        <ng-template #noOrderLink>
+          {{ requisition.orderNo || requisition.recurringOrderDocumentNo }}
+        </ng-template>
       </dd>
     </ng-container>
 

src/app/core/facades/account.facade.ts

@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { Store, select } from '@ngrx/store';
 import { Observable, Subject, of } from 'rxjs';
-import { map, switchMap, take, tap } from 'rxjs/operators';
+import { distinctUntilChanged, map, switchMap, take, tap } from 'rxjs/operators';
 
 import { Address } from 'ish-core/models/address/address.model';
 import { Credentials } from 'ish-core/models/credentials/credentials.model';
@@ -13,6 +13,7 @@ import { PasswordReminder } from 'ish-core/models/password-reminder/password-rem
 import { PaymentInstrument } from 'ish-core/models/payment-instrument/payment-instrument.model';
 import { User } from 'ish-core/models/user/user.model';
 import { MessagesPayloadType } from 'ish-core/store/core/messages';
+import { selectQueryParam } from 'ish-core/store/core/router';
 import { getServerConfigParameter } from 'ish-core/store/core/server-config';
 import {
   createCustomerAddress,
@@ -38,6 +39,13 @@ import {
   loadMoreOrders,
   loadOrders,
 } from 'ish-core/store/customer/orders';
+import {
+  getRecurringOrders,
+  getRecurringOrdersError,
+  getRecurringOrdersLoading,
+  getSelectedRecurringOrder,
+  recurringOrdersActions,
+} from 'ish-core/store/customer/recurring-orders';
 import {
   cancelRegistration,
   getSsoRegistrationCancelled,
@@ -195,6 +203,28 @@ export class AccountFacade {
   ordersLoading$ = this.store.pipe(select(getOrdersLoading));
   ordersError$ = this.store.pipe(select(getOrdersError));
 
+  // RECURRING ORDERS
+
+  recurringOrdersContext$ = this.store.pipe(select(selectQueryParam('context')), distinctUntilChanged());
+  selectedRecurringOrder$ = this.store.pipe(select(getSelectedRecurringOrder));
+  recurringOrdersLoading$ = this.store.pipe(select(getRecurringOrdersLoading));
+  recurringOrdersError$ = this.store.pipe(select(getRecurringOrdersError));
+
+  recurringOrders$() {
+    return this.recurringOrdersContext$.pipe(
+      tap(context => this.store.dispatch(recurringOrdersActions.loadRecurringOrders({ context }))),
+      switchMap(context => this.store.pipe(select(getRecurringOrders(context))))
+    );
+  }
+
+  deleteRecurringOrder(id: string): void {
+    this.store.dispatch(recurringOrdersActions.deleteRecurringOrder({ recurringOrderId: id }));
+  }
+
+  setActiveRecurringOrder(recurringOrderId: string, active: boolean) {
+    this.store.dispatch(recurringOrdersActions.updateRecurringOrder({ recurringOrderId, active }));
+  }
+
   // PAYMENT
 
   private eligiblePaymentMethods$ = this.store.pipe(select(getUserPaymentMethods));

src/app/core/facades/checkout.facade.ts

@@ -1,15 +1,16 @@
 import { Injectable } from '@angular/core';
 import { Store, createSelector, select } from '@ngrx/store';
 import { formatISO } from 'date-fns';
-import { Subject, combineLatest, merge } from 'rxjs';
+import { Subject, combineLatest, iif, merge } from 'rxjs';
 import { debounceTime, distinctUntilChanged, filter, map, sample, switchMap, take, tap } from 'rxjs/operators';
 
 import { Address } from 'ish-core/models/address/address.model';
 import { Attribute } from 'ish-core/models/attribute/attribute.model';
 import { CheckoutStepType } from 'ish-core/models/checkout/checkout-step.type';
 import { LineItemUpdate } from 'ish-core/models/line-item-update/line-item-update.model';
 import { PaymentInstrument } from 'ish-core/models/payment-instrument/payment-instrument.model';
-import { selectRouteData } from 'ish-core/store/core/router';
+import { Recurrence } from 'ish-core/models/recurrence/recurrence.model';
+import { selectQueryParam, selectRouteData } from 'ish-core/store/core/router';
 import { getServerConfigParameter } from 'ish-core/store/core/server-config';
 import {
   addMessageToMerchant,
@@ -54,10 +55,12 @@ import {
   updateBasketAddress,
   updateBasketCostCenter,
   updateBasketItem,
+  updateBasketRecurrence,
   updateBasketShippingMethod,
   updateConcardisCvcLastUpdated,
 } from 'ish-core/store/customer/basket';
 import { getOrdersError, getSelectedOrder } from 'ish-core/store/customer/orders';
+import { getRecurringOrder } from 'ish-core/store/customer/recurring-orders';
 import { getLoggedInUser, getUserCostCenters, loadUserCostCenters } from 'ish-core/store/customer/user';
 import { whenFalsy, whenTruthy } from 'ish-core/utils/operators';
 
@@ -145,6 +148,10 @@ export class CheckoutFacade {
     this.store.dispatch(updateBasketCostCenter({ costCenter }));
   }
 
+  updateBasketRecurrence(recurrence: Recurrence) {
+    this.store.dispatch(updateBasketRecurrence({ recurrence }));
+  }
+
   updateBasketExternalOrderReference(externalOrderReference: string) {
     this.store.dispatch(updateBasket({ update: { externalOrderReference } }));
   }
@@ -166,7 +173,19 @@ export class CheckoutFacade {
 
   private ordersError$ = this.store.pipe(select(getOrdersError));
   basketOrOrdersError$ = merge(this.basketError$, this.ordersError$);
-  selectedOrder$ = this.store.pipe(select(getSelectedOrder));
+
+  submittedOrder$ = this.store.pipe(
+    select(selectQueryParam('recurringOrderId')),
+    switchMap(recurringOrderId =>
+      iif(
+        () => !!recurringOrderId,
+        // fetch recurring order information if recurringOrderId is present
+        this.store.pipe(select(getRecurringOrder(recurringOrderId))),
+        // otherwise fetch the information for a standard order
+        this.store.pipe(select(getSelectedOrder))
+      )
+    )
+  );
 
   // SHIPPING
 

src/app/core/guards/server-setting.guard.ts

@@ -0,0 +1,30 @@
+import { inject } from '@angular/core';
+import { ActivatedRouteSnapshot, Router } from '@angular/router';
+import { map } from 'rxjs';
+
+import { AppFacade } from 'ish-core/facades/app.facade';
+import { HttpStatusCodeService } from 'ish-core/utils/http-status-code/http-status-code.service';
+
+/**
+ * Routes only to the page if the configured server setting at the route is enabled
+ */
+export function serverSettingGuard(route: ActivatedRouteSnapshot) {
+  const appFacade = inject(AppFacade);
+  const router = inject(Router);
+  const httpStatusCodeService = inject(HttpStatusCodeService);
+
+  return appFacade.serverSetting$(route.data.serverSetting).pipe(
+    map(enabled => {
+      if (!enabled) {
+        httpStatusCodeService.setStatus(404, false);
+        return router.createUrlTree(['/error'], {
+          queryParams: {
+            error: 'server-setting-deactivated',
+            value: route.data.serverSetting,
+          },
+        });
+      }
+      return true;
+    })
+  );
+}

src/app/core/icon.module.ts

@@ -41,6 +41,7 @@ import {
   faPlus,
   faPrint,
   faQuestionCircle,
+  faRepeat,
   faRightFromBracket,
   faSearch,
   faShoppingCart,
@@ -103,6 +104,7 @@ export class IconModule {
       faPlus,
       faPrint,
       faQuestionCircle,
+      faRepeat,
       faRightFromBracket,
       faSearch,
       faShoppingCart,

src/app/core/models/basket/basket.interface.ts

@@ -10,6 +10,7 @@ import { PaymentInstrument } from 'ish-core/models/payment-instrument/payment-in
 import { PaymentMethodBaseData } from 'ish-core/models/payment-method/payment-method.interface';
 import { PaymentData } from 'ish-core/models/payment/payment.interface';
 import { PriceItemData } from 'ish-core/models/price-item/price-item.interface';
+import { Recurrence } from 'ish-core/models/recurrence/recurrence.model';
 import { ShippingMethodData } from 'ish-core/models/shipping-method/shipping-method.interface';
 
 export interface BasketBaseData {
@@ -55,6 +56,7 @@ export interface BasketBaseData {
     firstName: string;
     lastName: string;
   };
+  recurrence?: Recurrence;
 }
 
 export interface BasketIncludedData {

src/app/core/models/basket/basket.mapper.ts

@@ -74,6 +74,7 @@ export class BasketMapper {
       user: data.buyer,
       externalOrderReference: data.externalOrderReference,
       messageToMerchant: data.messageToMerchant,
+      recurrence: data.recurrence,
     };
   }