feat(deposits): FD Renewal History tab, redesigned Payment action, and renewal-aware Transactions/certificate
Publish Image in Docker Hub / build (push) Canceled after 0s
Playwright E2E Tests / Run Playwright Tests (push) Canceled after 0s
Tests / testRigor (push) Canceled after 0s
build-run / Run Lint, Build and Deploy (push) Canceled after 0s

WHAT THIS CHANGES
==================
Frontend counterpart to the backend FD in-place renewal, senior-citizen
rate, and Payment action work.

1. RENEWAL HISTORY TAB (new) -- fixed-deposit-account-view/renewal-history-tab/.
   A vertical timeline, one card per term of the FD, oldest first. Backend
   data arrives as a list of lowercase-keyed maps (Postgres unquoted SQL
   aliases), which the component normalises. Includes term-rate-chart-dialog,
   a popup showing one term's full rate-by-tenure chart, including the
   senior-citizen column, with an "Applied" badge on the rate that was
   actually used. Route added in fixed-deposits-routing.module.ts, tab
   link added in fixed-deposit-account-view.component.html (shown only
   when the account has renewal history).

2. PAYMENT DIALOG (new) -- fixed-deposit-account-view/custom-dialogs/payment-dialog/.
   Card-based picker for the four supported closure types (Transfer to
   Savings, Re-Invest Principal and Interest, Re-Invest Principal Only,
   Partial Re-Invest), with Withdraw Deposit filtered out client-side.
   Fetches its own template via a new fixedDepositsService method
   (getFixedDepositsAccountPaymentTemplate, command=payment) rather than
   reusing the Close template, since the Payment template is the only one
   the backend includes PARTIAL_REINVEST in.
   The Partial Re-Invest amount cap is date-dependent: the backend bounds
   it against the account balance AFTER posting interest to the chosen
   closed-on date, which lands on the maturity amount on or after
   maturity and on the current balance before it. The dialog mirrors this
   (reinvestCap / processingOnOrAfterMaturity) so the shown split actually
   adds up and the client-side validator agrees with the server. This was
   wrong in an earlier pass of this work (compared against a fixed figure
   regardless of date) and was caught and fixed via a real reconciliation
   check (77000 + 23000 did not equal the displayed total) before this
   commit.
   Added: a loading-failure state (previously the spinner ran forever on
   a failed template fetch), an inline submit-error message (previously a
   failed POST left the dialog open with no feedback), an empty-savings-
   accounts hint, and accessibility attributes on the option cards
   (role="radio", aria-checked, a visible check icon, focus-visible
   outline) since selection was previously colour-only.

3. TRANSACTIONS TAB -- merges synthetic "FD Renewed" marker rows into the
   real transaction list, since an in-place renewal posts no actual
   ledger transaction and would otherwise look like the balance changed
   for no reason.

4. INTEREST RATE CHART TAB -- added the senior-citizen rate column.

5. DEPOSIT CERTIFICATE DIALOG -- lists the full renewal history on FD
   certificates. renewalCount is renewalHistory.length - 1 (the first
   row is the original term, not a renewal); an earlier version of this
   used the raw row count and overstated the renewal count by one on a
   customer-facing document, caught and fixed before this commit.

6. CLIENTS GENERAL TAB -- fixedDepositAccountsForDisplay folds a renewed
   FD's superseded terms out of the account list (each renewal used to
   show as two unrelated accounts, one Closed and one Active). Memoised
   on the source array's identity so it does not rebuild, and rebind the
   table, on every change-detection tick. Only rewrites FD rows; Savings,
   RD, Current, and Share account rows pass through this getter
   untouched, and the RD/Savings sections of the template were left
   bound directly to the original savingAccounts array.

KNOWN CAVEATS
=============
  - This depends on the paired backend commit (same date, "feat(deposits):
    FD in-place renewal, senior-citizen rate persistence, and Payment
    action"). Deploying this frontend without that backend change means
    the Payment dialog and Renewal History tab will call endpoints that
    do not exist yet.
  - Renewal-history rows rely on the backend returning lowercase column
    keys (a Postgres-specific behaviour of unquoted SQL aliases via
    JdbcTemplate). Confirmed correct against this project's Postgres
    dev database; if this project ever runs on a different database
    engine, that assumption would need re-checking.
  - src/environments/.env.ts is intentionally excluded from this commit;
    it is a local build-version stamp file that should never be
    committed.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-08-23 16:46:22 +05:30
parent 5c76aa6b27
commit f0e059c621
25 changed files with 2256 additions and 36 deletions
@@ -36,7 +36,7 @@
</div>
<div class="meta-item">
<span class="meta-label">Account No.</span>
<span class="meta-value">{{ accountData.accountNo }}</span>
<span class="meta-value">{{ accountData.fdAccountNumber || accountData.accountNo }}</span>
</div>
<div class="meta-item">
<span class="meta-label">Date of Issue</span>
@@ -49,9 +49,13 @@
This is to certify that
<strong class="highlight-text">{{ accountData.clientName || accountData.groupName }}</strong>
holds a {{ accountType === 'FD' ? 'Fixed Deposit' : 'Recurring Deposit' }} account bearing account number
<strong class="highlight-text">{{ accountData.accountNo }}</strong>
<strong class="highlight-text">{{ accountData.fdAccountNumber || accountData.accountNo }}</strong>
with <strong class="highlight-text">Nexora Co-operative Bank Ltd.</strong>, as per the particulars set out
below.
<ng-container *ngIf="renewalCount">
This account was renewed on maturity {{ renewalCount }} {{ renewalCount === 1 ? 'time' : 'times' }}; the
full renewal history is set out below.
</ng-container>
</p>
<div class="issued-to-details">
@@ -129,6 +133,44 @@
</tbody>
</table>
<!-- Renewal History -- one row per term of this FD, oldest first. Deliberately shows only the
term number, not each term's internal account number: the customer holds one FD under one
number, and listing the per-term account numbers here would read as several deposits. Staff
can still see them on the account view's own renewal-history card. -->
<table class="certificate-details-table renewal-history-table" *ngIf="renewalHistory.length">
<thead>
<tr>
<th colspan="7" class="renewal-history-title">RENEWAL HISTORY</th>
</tr>
<tr>
<th>Term</th>
<th>From</th>
<th>To</th>
<th>Rate</th>
<th>Principal</th>
<th>Interest</th>
<th>Maturity Amount</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let term of renewalHistory" [class.current-term-row]="term.accountid === accountData.id">
<td>{{ term.renewalcycleno === 0 ? 'Original' : 'Renewal ' + term.renewalcycleno }}</td>
<td>{{ term.activatedondate | dateFormat }}</td>
<td>{{ term.maturitydate | dateFormat }}</td>
<td>{{ term.interestrate }}%</td>
<td>{{ term.depositamount | currency: accountData.currency.code : 'symbol-narrow' }}</td>
<td>
{{
term.interestearned === null || term.interestearned === undefined
? '—'
: (term.interestearned | currency: accountData.currency.code : 'symbol-narrow')
}}
</td>
<td>{{ maturityFor(term) | currency: accountData.currency.code : 'symbol-narrow' }}</td>
</tr>
</tbody>
</table>
<div class="cert-footer">
<div class="seal-container">
<div class="seal-ring">
@@ -250,6 +250,32 @@
}
}
/* Renewal History Table -- lists each earlier term this FD was renewed from */
.renewal-history-table {
th {
padding: 8px 10px;
border: 1px solid #ede8db;
font-size: 11px;
text-align: left;
background-color: #f7f5ee;
color: #7b6f63;
}
.renewal-history-title {
text-align: center;
background-color: #f5f2e9;
color: #0b3c5d;
font-weight: bold;
letter-spacing: 1.5px;
font-size: 12px;
}
.current-term-row {
background-color: #fbfaf5;
font-weight: bold;
}
}
/* Certificate Footer Seal / Signatures */
.cert-footer {
display: flex;
@@ -485,6 +511,24 @@
}
}
.renewal-history-table {
margin-bottom: 12px !important;
th {
padding: 4px 8px !important;
font-size: 8px !important;
}
td {
padding: 4px 8px !important;
font-size: 9px !important;
}
.renewal-history-title {
font-size: 10px !important;
}
}
.cert-footer {
margin-top: 8px !important;
@@ -60,12 +60,29 @@ export class DepositCertificateDialogComponent implements OnInit {
certificateNo = '';
issueDate: Date = new Date();
/**
* Every term of this FD, oldest first, as resolved by the backend -- a renewal opens each term as
* its own account, so the certificate lists them all to show the deposit's full history. Empty for
* an FD that has never been renewed. Keys are lower-cased, arriving from SQL column labels.
*/
renewalHistory: any[] = [];
/**
* How many times the deposit has actually rolled over. {@link renewalHistory} lists every TERM, and the
* first of those is the original deposit rather than a renewal, so the count is one less than the number
* of rows. Stated on a customer-facing certificate, so an off-by-one here misreports the deposit.
*/
get renewalCount(): number {
return Math.max(this.renewalHistory.length - 1, 0);
}
ngOnInit() {
this.accountType = this.data.accountType;
this.accountData = this.data.accountData;
const clientId = this.data.clientId != null ? String(this.data.clientId) : null;
this.certificateNo = `${this.accountType}-CERT-${this.accountData.accountNo}`;
this.certificateNo = `${this.accountType}-CERT-${this.accountData.fdAccountNumber || this.accountData.accountNo}`;
this.renewalHistory = this.accountData?.renewalHistory ?? [];
if (!clientId) {
return;
@@ -100,6 +117,14 @@ export class DepositCertificateDialogComponent implements OnInit {
});
}
/**
* A term's settled maturity amount, or its projection while it is still running. Resolved here rather
* than inline so the choice isn't left to operator precedence between `??` and the currency pipe.
*/
maturityFor(term: any): number | null {
return term?.maturedamount ?? term?.projectedmaturityamount ?? null;
}
formatAddress(addr: any): string {
if (!addr) return '';
return [