Merge branch 'maker-checker' into dev

Brings in the UI side of maker-checker for users and roles: a Pending User
Edits tab with a compare dialog, user/role create-edit-view wired to the
pending-request flow, plus keyboard shortcuts and inline-create dialogs.

Both conflicts resolved in dev's favour:

.env.ts — auto-generated build stamp; dev's (260901) is the newer one.

share-product-general-tab.component.html — dev had deliberately removed the
per-product Dividends button, leaving a comment explaining that dividends are
declared society-wide from Share Products -> Dividends because the board
resolves one rate for the year rather than one per product. The branch simply
predates that change, so taking its side would have resurrected a button that
was removed on purpose.

checker-inbox-and-tasks.component.html and tasks-routing.module.ts auto-merged
cleanly, with both the new Pending User Edits tab and the existing Closure
Requests tab intact.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

src/app/products/charges/create-charge/create-charge.component.ts

@@ -20,6 +20,7 @@ import { Router, ActivatedRoute, RouterLink } from '@angular/router';
 /** Custom Services */
 import { ProductsService } from '../../products.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { AlertService } from 'app/core/alert/alert.service';
 import { Dates } from 'app/core/utils/dates';
 import { minNumberValueValidator } from 'app/shared/validators/min-number-value.validator';
 import { maxNumberValueValidator } from 'app/shared/validators/max-number-value.validator';
@@ -45,6 +46,7 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 export class CreateChargeComponent implements OnInit {
   private formBuilder = inject(UntypedFormBuilder);
   private productsService = inject(ProductsService);
+  private alertService = inject(AlertService);
   private route = inject(ActivatedRoute);
   private router = inject(Router);
   private dateUtils = inject(Dates);
@@ -352,8 +354,16 @@ export class CreateChargeComponent implements OnInit {
     if (!data.maxCap) {
       delete data.maxCap;
     }
-    this.productsService.createCharge(data).subscribe((response: any) => {
-      this.router.navigate(['../'], { relativeTo: this.route });
+    this.productsService.createCharge(data).subscribe({
+      next: (response: any) => {
+        if (response?.rollbackTransaction) {
+          this.alertService.alert({
+            type: 'Success',
+            message: 'Charge submitted successfully for approval.'
+          });
+        }
+        this.router.navigate(['../'], { relativeTo: this.route });
+      }
     });
   }
 }

src/app/products/charges/edit-charge/edit-charge.component.ts

@@ -14,6 +14,7 @@ import { ActivatedRoute, Router, RouterLink } from '@angular/router';
 /** Custom Services */
 import { ProductsService } from 'app/products/products.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { AlertService } from 'app/core/alert/alert.service';
 import { maxNumberValueValidator } from 'app/shared/validators/max-number-value.validator';
 import { minNumberValueValidator } from 'app/shared/validators/min-number-value.validator';
 import { ValidateOnFocusDirective } from '../../../directives/validate-on-focus.directive';
@@ -37,6 +38,7 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 })
 export class EditChargeComponent implements OnInit {
   private productsService = inject(ProductsService);
+  private alertService = inject(AlertService);
   private formBuilder = inject(UntypedFormBuilder);
   private route = inject(ActivatedRoute);
   private router = inject(Router);
@@ -222,8 +224,16 @@ export class EditChargeComponent implements OnInit {
     if (!charges.maxCap) {
       delete charges.maxCap;
     }
-    this.productsService.updateCharge(this.chargeData.id.toString(), charges).subscribe((response: any) => {
-      this.router.navigate(['../'], { relativeTo: this.route });
+    this.productsService.updateCharge(this.chargeData.id.toString(), charges).subscribe({
+      next: (response: any) => {
+        if (response?.rollbackTransaction) {
+          this.alertService.alert({
+            type: 'Success',
+            message: 'Charge update submitted successfully for approval.'
+          });
+        }
+        this.router.navigate(['../'], { relativeTo: this.route });
+      }
     });
   }
 }

src/app/products/current-products/create-current-product/create-current-product.component.ts

@@ -18,6 +18,7 @@ import { CurrentProductAccountingStepComponent } from '../current-product-steppe
 import { CurrentProductPreviewStepComponent } from '../current-product-stepper/current-product-preview-step/current-product-preview-step.component';
 import { ProductsService } from 'app/products/products.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { AlertService } from 'app/core/alert/alert.service';
 import { Accounting } from 'app/core/utils/accounting';
 import { MatTabsModule } from '@angular/material/tabs';
 import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
@@ -42,6 +43,7 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 export class CreateCurrentProductComponent {
   private route = inject(ActivatedRoute);
   private productsService = inject(ProductsService);
+  private alertService = inject(AlertService);
   private router = inject(Router);
   private settingsService = inject(SettingsService);
   private accounting = inject(Accounting);
@@ -144,14 +146,24 @@ export class CreateCurrentProductComponent {
   submit() {
     const currentProduct = this.prepareCurrentProductPayload();
     console.log('Current product submit payload:', currentProduct);
-    this.productsService.createCurrentProduct(currentProduct).subscribe((response: any) => {
-      this.router.navigate(
-        [
-          '../',
-          response.resourceId
-        ],
-        { relativeTo: this.route }
-      );
+    this.productsService.createCurrentProduct(currentProduct).subscribe({
+      next: (response: any) => {
+        if (response?.rollbackTransaction) {
+          this.alertService.alert({
+            type: 'Success',
+            message: 'Current product creation request submitted successfully for approval.'
+          });
+          this.router.navigate(['../'], { relativeTo: this.route });
+        } else {
+          this.router.navigate(
+            [
+              '../',
+              response.resourceId
+            ],
+            { relativeTo: this.route }
+          );
+        }
+      }
     });
   }
 }

src/app/products/fixed-deposit-products/base-fd-interest-rate-chart/base-fd-interest-rate-chart.component.html

@@ -35,7 +35,7 @@
               <p class="empty-text">No slabs defined. Click "Add Slab" to begin.</p>
             } @else {
               <form [formGroup]="forms[fdType]">
-                <table mat-table [dataSource]="slabs(fdType).controls" class="slabs-table">
+                <table mat-table [dataSource]="slabsDataSources[fdType]" class="slabs-table">
                   <ng-container matColumnDef="srNo">
                     <th mat-header-cell *matHeaderCellDef>#</th>
                     <td mat-cell *matCellDef="let row">{{ row.get('srNo').value }}</td>
@@ -139,12 +139,25 @@
               </mat-form-field>
             </form>
 
+            @if (getSlabValidationErrors(fdType).length > 0) {
+              <div class="validation-errors-box">
+                <mat-icon color="warn">error_outline</mat-icon>
+                <div class="error-list">
+                  @for (err of getSlabValidationErrors(fdType); track err) {
+                    <p class="error-item">{{ err }}</p>
+                  }
+                </div>
+              </div>
+            }
+
             <div class="actions-row">
               <button
                 type="button"
                 mat-raised-button
                 color="primary"
-                [disabled]="forms[fdType].invalid || slabs(fdType).length === 0"
+                [disabled]="
+                  forms[fdType].invalid || slabs(fdType).length === 0 || getSlabValidationErrors(fdType).length > 0
+                "
                 (click)="openPreview(fdType)"
               >
                 Preview & Save

src/app/products/fixed-deposit-products/base-fd-interest-rate-chart/base-fd-interest-rate-chart.component.scss

@@ -78,6 +78,30 @@
   min-width: 200px;
 }
 
+/* ── Validation Errors ── */
+.validation-errors-box {
+  display: flex;
+  align-items: flex-start;
+  gap: 0.75rem;
+  padding: 0.75rem 1rem;
+  background: #fef2f2;
+  border: 1px solid #fecaca;
+  border-radius: 6px;
+  color: #b91c1c;
+  font-size: 0.875rem;
+  margin-bottom: 0.5rem;
+
+  .error-list {
+    display: flex;
+    flex-direction: column;
+    gap: 0.25rem;
+  }
+
+  .error-item {
+    margin: 0;
+  }
+}
+
 /* ── Actions ── */
 .actions-row {
   display: flex;

src/app/products/fixed-deposit-products/base-fd-interest-rate-chart/base-fd-interest-rate-chart.component.ts

@@ -7,13 +7,14 @@
  */
 
 import { Component, OnInit, inject } from '@angular/core';
-import { FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { AbstractControl, FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { DecimalPipe } from '@angular/common';
 import { MatTabsModule } from '@angular/material/tabs';
 import { MatIconButton } from '@angular/material/button';
 import { MatExpansionModule } from '@angular/material/expansion';
 import {
   MatTable,
+  MatTableDataSource,
   MatColumnDef,
   MatHeaderCellDef,
   MatHeaderCell,
@@ -26,6 +27,7 @@ import {
 } from '@angular/material/table';
 import { MatIconModule } from '@angular/material/icon';
 import { ProductsService } from 'app/products/products.service';
+import { AlertService } from 'app/core/alert/alert.service';
 import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 
 @Component({
@@ -54,6 +56,7 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 export class BaseFdInterestRateChartComponent implements OnInit {
   private fb = inject(FormBuilder);
   private productsService = inject(ProductsService);
+  private alertService = inject(AlertService);
 
   readonly fdTypes = [
     'SINGLE',
@@ -87,6 +90,7 @@ export class BaseFdInterestRateChartComponent implements OnInit {
   ];
 
   forms: Record<string, FormGroup> = {};
+  slabsDataSources: Record<string, MatTableDataSource<AbstractControl>> = {};
   activeRates: Record<string, any> = {};
   historyRates: any[] = [];
 
@@ -98,6 +102,7 @@ export class BaseFdInterestRateChartComponent implements OnInit {
   ngOnInit(): void {
     this.fdTypes.forEach((type) => {
       this.forms[type] = this.buildForm();
+      this.slabsDataSources[type] = new MatTableDataSource<AbstractControl>([]);
       this.isSaving[type] = false;
       this.saveMessage[type] = '';
       this.showPreview[type] = false;
@@ -111,15 +116,140 @@ export class BaseFdInterestRateChartComponent implements OnInit {
 
   addSlab(fdType: string): void {
     const arr = this.slabs(fdType);
-    arr.push(this.buildSlabRow({ srNo: arr.length + 1 }));
+    let nextFrom = 1;
+    let periodType = this.getDefaultPeriodType(fdType);
+
+    if (arr.length > 0) {
+      const lastSlab = arr.at(arr.length - 1).value;
+      periodType = lastSlab.periodTypeEnum ?? periodType;
+      if (lastSlab.toPeriod != null && lastSlab.toPeriod >= 0) {
+        nextFrom = Number(lastSlab.toPeriod) + 1;
+      } else if (lastSlab.fromPeriod != null && lastSlab.fromPeriod >= 0) {
+        nextFrom = Number(lastSlab.fromPeriod) + 1;
+      }
+    }
+
+    const desc = this.generateSlabDescription(nextFrom, null, periodType);
+    arr.push(
+      this.buildSlabRow({
+        srNo: arr.length + 1,
+        description: desc,
+        periodTypeEnum: periodType,
+        fromPeriod: nextFrom,
+        toPeriod: null,
+        annualInterestRate: 0,
+        seniorCitizenRate: 0
+      })
+    );
+    this.slabsDataSources[fdType].data = [...arr.controls];
   }
 
   removeSlab(fdType: string, index: number): void {
     this.slabs(fdType).removeAt(index);
     this.slabs(fdType).controls.forEach((c, i) => c.patchValue({ srNo: i + 1 }));
+    this.slabsDataSources[fdType].data = [...this.slabs(fdType).controls];
+  }
+
+  getDefaultPeriodType(fdType: string): number {
+    switch (fdType) {
+      case 'SINGLE':
+        return 0; // Days
+      case 'DOUBLE':
+        return 3; // Years
+      case 'SPECIAL':
+        return 2; // Months
+      default:
+        return 0;
+    }
+  }
+
+  generateSlabDescription(from: number, to: number | null, periodTypeEnum: number): string {
+    const unit = this.getPeriodLabel(periodTypeEnum);
+    if (to == null) {
+      return `${from}+ ${unit}`;
+    }
+    return `${from} to ${to} ${unit}`;
+  }
+
+  getSlabValidationErrors(fdType: string): string[] {
+    const errors: string[] = [];
+    const arr = this.slabs(fdType);
+    if (!arr || arr.length === 0) {
+      return errors;
+    }
+
+    const slabs = arr.controls.map((c) => c.value);
+    const expectedPeriodType = slabs[0].periodTypeEnum;
+    let expectedFrom = 1;
+
+    for (let i = 0; i < slabs.length; i++) {
+      const s = slabs[i];
+      const slabNum = i + 1;
+
+      if (s.periodTypeEnum !== expectedPeriodType) {
+        errors.push(`Slab #${slabNum}: Period type must be consistent across all slabs.`);
+      }
+
+      if (s.fromPeriod == null || s.fromPeriod < 0) {
+        errors.push(`Slab #${slabNum}: 'From' period must be a non-negative number.`);
+      } else if (s.fromPeriod !== expectedFrom) {
+        if (i === 0) {
+          errors.push(`Slab #${slabNum}: First slab must start from 1 (found: ${s.fromPeriod}).`);
+        } else if (s.fromPeriod < expectedFrom) {
+          errors.push(
+            `Slab #${slabNum}: Range overlaps with previous slab (expected start: ${expectedFrom}, found: ${s.fromPeriod}).`
+          );
+        } else {
+          errors.push(
+            `Slab #${slabNum}: Gap detected in range (expected start: ${expectedFrom}, found: ${s.fromPeriod}).`
+          );
+        }
+      }
+
+      if (i < slabs.length - 1) {
+        // Non-final slab
+        if (s.toPeriod == null) {
+          errors.push(`Slab #${slabNum}: 'To' period is required for non-final slabs.`);
+        } else {
+          if (s.toPeriod < 0) {
+            errors.push(`Slab #${slabNum}: 'To' period must be non-negative.`);
+          }
+          if (s.fromPeriod != null && s.toPeriod < s.fromPeriod) {
+            errors.push(
+              `Slab #${slabNum}: 'From' period (${s.fromPeriod}) cannot be greater than 'To' period (${s.toPeriod}).`
+            );
+          }
+          expectedFrom = Number(s.toPeriod) + 1;
+        }
+      } else {
+        // Final slab
+        if (s.toPeriod != null) {
+          if (s.toPeriod < 0) {
+            errors.push(`Slab #${slabNum}: 'To' period must be non-negative.`);
+          }
+          if (s.fromPeriod != null && s.toPeriod < s.fromPeriod) {
+            errors.push(
+              `Slab #${slabNum}: 'From' period (${s.fromPeriod}) cannot be greater than 'To' period (${s.toPeriod}).`
+            );
+          }
+        }
+      }
+
+      if (s.annualInterestRate == null || s.annualInterestRate < 0) {
+        errors.push(`Slab #${slabNum}: Annual Interest Rate cannot be negative.`);
+      }
+      if (s.seniorCitizenRate != null && s.seniorCitizenRate < 0) {
+        errors.push(`Slab #${slabNum}: Senior Citizen Rate cannot be negative.`);
+      }
+    }
+
+    return errors;
   }
 
   openPreview(fdType: string): void {
+    if (this.getSlabValidationErrors(fdType).length > 0) {
+      return;
+    }
     this.showPreview[fdType] = true;
     this.saveMessage[fdType] = '';
   }
@@ -129,13 +259,24 @@ export class BaseFdInterestRateChartComponent implements OnInit {
   }
 
   confirmSave(fdType: string): void {
+    if (this.isSaving[fdType]) {
+      return;
+    }
     this.isSaving[fdType] = true;
     const { versionLabel, remarks, slabs } = this.forms[fdType].value;
     this.productsService.saveFdBaseInterestRates({ fdType, versionLabel, remarks, slabs }).subscribe({
-      next: () => {
-        this.saveMessage[fdType] = 'New version activated. Previous version deactivated.';
-        this.showPreview[fdType] = false;
+      next: (response: any) => {
         this.isSaving[fdType] = false;
+        this.showPreview[fdType] = false;
+        if (response?.rollbackTransaction) {
+          this.alertService.alert({
+            type: 'Success',
+            message: 'Base interest rate configuration submitted successfully for approval.'
+          });
+          this.saveMessage[fdType] = 'Base interest rate configuration submitted successfully for approval.';
+        } else {
+          this.saveMessage[fdType] = 'New version activated. Previous version deactivated.';
+        }
         this.loadAll();
       },
       error: () => {
@@ -171,6 +312,7 @@ export class BaseFdInterestRateChartComponent implements OnInit {
           const arr = this.slabs(type);
           arr.clear();
           (active?.slabs ?? []).forEach((s: any) => arr.push(this.buildSlabRow(s)));
+          this.slabsDataSources[type].data = [...arr.controls];
           this.forms[type].patchValue({ versionLabel: '', remarks: '' });
         },
         error: () => {

src/app/products/fixed-deposit-products/create-fixed-deposit-product/create-fixed-deposit-product.component.ts

@@ -33,6 +33,7 @@ import {
 /** Custom Services */
 import { ProductsService } from 'app/products/products.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { AlertService } from 'app/core/alert/alert.service';
 import { Dates } from 'app/core/utils/dates';
 import { Accounting } from 'app/core/utils/accounting';
 import { FaIconComponent } from '@fortawesome/angular-fontawesome';
@@ -70,6 +71,7 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 export class CreateFixedDepositProductComponent {
   private route = inject(ActivatedRoute);
   private productsService = inject(ProductsService);
+  private alertService = inject(AlertService);
   private router = inject(Router);
   private settingsService = inject(SettingsService);
   private dateUtils = inject(Dates);
@@ -265,14 +267,24 @@ export class CreateFixedDepositProductComponent {
       locale: this.settingsService.language.code
     });
     delete fixedDepositProduct.advancedAccountingRules;
-    this.productsService.createFixedDepositProduct(fixedDepositProduct).subscribe((response: any) => {
-      this.router.navigate(
-        [
-          '../',
-          response.resourceId
-        ],
-        { relativeTo: this.route }
-      );
+    this.productsService.createFixedDepositProduct(fixedDepositProduct).subscribe({
+      next: (response: any) => {
+        if (response?.rollbackTransaction) {
+          this.alertService.alert({
+            type: 'Success',
+            message: 'Fixed deposit product creation request submitted successfully for approval.'
+          });
+          this.router.navigate(['../'], { relativeTo: this.route });
+        } else {
+          this.router.navigate(
+            [
+              '../',
+              response.resourceId
+            ],
+            { relativeTo: this.route }
+          );
+        }
+      }
     });
   }
 }

src/app/products/fixed-deposit-products/edit-fixed-deposit-product/edit-fixed-deposit-product.component.ts

@@ -21,6 +21,7 @@ import { FixedDepositProductAccountingStepComponent } from '../fixed-deposit-pro
 /** Custom Services */
 import { ProductsService } from 'app/products/products.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { AlertService } from 'app/core/alert/alert.service';
 import { MatTabsModule } from '@angular/material/tabs';
 import {
   MatTable,
@@ -70,6 +71,7 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 export class EditFixedDepositProductComponent {
   private route = inject(ActivatedRoute);
   private productsService = inject(ProductsService);
+  private alertService = inject(AlertService);
   private router = inject(Router);
   private settingsService = inject(SettingsService);
   private accounting = inject(Accounting);
@@ -280,8 +282,14 @@ export class EditFixedDepositProductComponent {
     delete fixedDepositProduct.advancedAccountingRules;
     this.productsService
       .updateFixedDepositProduct(this.fixedDepositProductsTemplate.id, fixedDepositProduct)
-      .subscribe((response: any) => {
-        this.router.navigate(['../'], { relativeTo: this.route });
+      .subscribe({
+        next: () => {
+          this.alertService.alert({
+            type: 'Success',
+            message: 'Fixed deposit product update submitted successfully for Checker approval.'
+          });
+          this.router.navigate(['../'], { relativeTo: this.route });
+        }
       });
   }
 

src/app/products/loan-products/create-loan-product/create-loan-product.component.ts

@@ -21,6 +21,7 @@ import { LoanProductInterestRefundStepComponent } from '../loan-product-stepper/
 
 /** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { AlertService } from 'app/core/alert/alert.service';
 import { LoanProducts } from '../loan-products';
 import {
   AdvancedPaymentAllocation,
@@ -63,6 +64,7 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 export class CreateLoanProductComponent implements OnInit {
   private route = inject(ActivatedRoute);
   private productsService = inject(ProductsService);
+  private alertService = inject(AlertService);
   private loanProducts = inject(LoanProducts);
   private router = inject(Router);
   private accounting = inject(Accounting);
@@ -313,14 +315,24 @@ export class CreateLoanProductComponent implements OnInit {
       delete loanProduct['daysInYearCustomStrategy'];
     }
 
-    this.productsService.createLoanProduct(loanProduct).subscribe((response: any) => {
-      this.router.navigate(
-        [
-          '../',
-          response.resourceId
-        ],
-        { relativeTo: this.route }
-      );
+    this.productsService.createLoanProduct(loanProduct).subscribe({
+      next: (response: any) => {
+        if (response?.rollbackTransaction) {
+          this.alertService.alert({
+            type: 'Success',
+            message: 'Loan product creation request submitted successfully for approval.'
+          });
+          this.router.navigate(['../'], { relativeTo: this.route });
+        } else {
+          this.router.navigate(
+            [
+              '../',
+              response.resourceId
+            ],
+            { relativeTo: this.route }
+          );
+        }
+      }
     });
   }
 

src/app/products/saving-products/create-saving-product/create-saving-product.component.ts

@@ -1,4 +1,4 @@
-/**
+/**
  * Copyright since 2025 Mifos Initiative
  *
  * This Source Code Form is subject to the terms of the Mozilla Public
@@ -22,6 +22,7 @@ import { SavingProductAccountingStepComponent } from '../saving-product-stepper/
 /** Custom Services */
 import { ProductsService } from 'app/products/products.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { AlertService } from 'app/core/alert/alert.service';
 import { Accounting } from 'app/core/utils/accounting';
 import { SavingProductPreviewStepComponent } from '../saving-product-stepper/saving-product-preview-step/saving-product-preview-step.component';
 import { MatTabsModule } from '@angular/material/tabs';
@@ -47,6 +48,7 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 export class CreateSavingProductComponent {
   private route = inject(ActivatedRoute);
   private productsService = inject(ProductsService);
+  private alertService = inject(AlertService);
   private router = inject(Router);
   private settingsService = inject(SettingsService);
   private accounting = inject(Accounting);
@@ -162,14 +164,24 @@ export class CreateSavingProductComponent {
   submit() {
     const savingProduct = this.prepareSavingProductPayload();
     console.log('Saving product submit payload:', savingProduct);
-    this.productsService.createSavingProduct(savingProduct).subscribe((response: any) => {
-      this.router.navigate(
-        [
-          '../',
-          response.resourceId
-        ],
-        { relativeTo: this.route }
-      );
+    this.productsService.createSavingProduct(savingProduct).subscribe({
+      next: (response: any) => {
+        if (response?.rollbackTransaction) {
+          this.alertService.alert({
+            type: 'Success',
+            message: 'Savings product creation request submitted successfully for approval.'
+          });
+          this.router.navigate(['../'], { relativeTo: this.route });
+        } else {
+          this.router.navigate(
+            [
+              '../',
+              response.resourceId
+            ],
+            { relativeTo: this.route }
+          );
+        }
+      }
     });
   }
 }

src/app/products/share-products/create-share-product/create-share-product.component.ts

@@ -22,6 +22,7 @@ import { ShareProductAccountingStepComponent } from '../share-product-stepper/sh
 /** Custom Services */
 import { ProductsService } from 'app/products/products.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { AlertService } from 'app/core/alert/alert.service';
 import { Accounting } from 'app/core/utils/accounting';
 import { FaIconComponent } from '@fortawesome/angular-fontawesome';
 import { ShareProductPreviewStepComponent } from '../share-product-stepper/share-product-preview-step/share-product-preview-step.component';
@@ -49,6 +50,7 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 export class CreateShareProductComponent {
   private route = inject(ActivatedRoute);
   private productsService = inject(ProductsService);
+  private alertService = inject(AlertService);
   private router = inject(Router);
   private settingsService = inject(SettingsService);
   private accounting = inject(Accounting);
@@ -143,14 +145,24 @@ export class CreateShareProductComponent {
       chargesSelected: this.shareProduct.chargesSelected.map((charge: any) => ({ id: charge.id })),
       locale: this.settingsService.language.code // locale required for digitsAfterDecimal
     };
-    this.productsService.createShareProduct(shareProduct).subscribe((response: any) => {
-      this.router.navigate(
-        [
-          '../',
-          response.resourceId
-        ],
-        { relativeTo: this.route }
-      );
+    this.productsService.createShareProduct(shareProduct).subscribe({
+      next: (response: any) => {
+        if (response?.rollbackTransaction) {
+          this.alertService.alert({
+            type: 'Success',
+            message: 'Share product creation request submitted successfully for approval.'
+          });
+          this.router.navigate(['../'], { relativeTo: this.route });
+        } else {
+          this.router.navigate(
+            [
+              '../',
+              response.resourceId
+            ],
+            { relativeTo: this.route }
+          );
+        }
+      }
     });
   }
 }

src/app/products/share-products/view-share-product/share-product-general-tab/share-product-general-tab.component.scss

@@ -6,8 +6,6 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-@use 'assets/styles/helper';
-@use 'assets/styles/colours' as *;
 @use 'assets/styles/product-view' as pv;
 
 @include pv.product-view-styles;
@@ -18,13 +16,111 @@
   --pv-accent-l: #fce7f3;
 }
 
-.tab-container {
-  padding: 1%;
-  margin: 1%;
+.pv-hero-actions {
+  display: flex;
+  gap: 10px;
+  flex-shrink: 0;
+  flex-wrap: wrap;
+  align-items: flex-start;
 }
 
-.mat-h3 {
-  margin-top: 10px !important;
-  font-weight: 300;
-  color: $status-approved;
+/* ───────── COMPACT ACCOUNTING SECTION ───────── */
+.pv-accounting {
+  .pv-accounting-row {
+    display: grid;
+    grid-template-columns: minmax(220px, 40%) 1fr;
+    gap: 14px;
+    align-items: baseline;
+    padding: 8px 0;
+    border-bottom: 1px dashed var(--pv-g100);
+    min-height: unset;
+    line-height: 1.4;
+  }
+
+  .pv-accounting-label {
+    font-size: 10.5px;
+    font-weight: 700;
+    text-transform: uppercase;
+    letter-spacing: 0.06em;
+    color: var(--pv-g500);
+    margin: 0;
+    flex: none;
+  }
+
+  .pv-accounting-value {
+    font-size: 13.5px;
+    color: var(--pv-g900);
+    font-weight: 500;
+    word-break: break-word;
+    margin: 0;
+    flex: none;
+  }
+
+  .pv-accounting-details {
+    margin-top: 0;
+
+    h4.pv-sub-h {
+      margin: 16px 0 8px;
+      font-size: 12px;
+      font-weight: 700;
+      color: var(--pv-g700);
+      text-transform: uppercase;
+      letter-spacing: 0.05em;
+      line-height: 1.2;
+    }
+
+    mifosx-gl-account-display {
+      display: block;
+      padding: 8px 0;
+      min-height: unset;
+      line-height: 1.4;
+      border-bottom: 1px dashed var(--pv-g100);
+
+      &:last-child {
+        border-bottom: 0;
+      }
+
+      ::ng-deep .layout-row {
+        display: grid;
+        grid-template-columns: minmax(220px, 40%) 1fr;
+        gap: 14px;
+        align-items: baseline;
+        margin: 0;
+      }
+
+      ::ng-deep div {
+        margin: 0 !important;
+        line-height: 1.4;
+      }
+
+      ::ng-deep .header {
+        font-size: 10.5px;
+        font-weight: 700;
+        text-transform: uppercase;
+        letter-spacing: 0.06em;
+        color: var(--pv-g500);
+        margin: 0 !important;
+        max-width: 100%;
+        flex: none;
+      }
+
+      ::ng-deep div:not(.header) {
+        font-size: 13.5px;
+        color: var(--pv-g900);
+        font-weight: 500;
+        word-break: break-word;
+        margin: 0 !important;
+        max-width: 100%;
+        flex: none;
+      }
+    }
+  }
+
+  @media (width <= 600px) {
+    .pv-accounting-row,
+    .pv-accounting-details mifosx-gl-account-display ::ng-deep .layout-row {
+      grid-template-columns: 1fr;
+      gap: 4px;
+    }
+  }
 }