WEB-708 Required Field Validation Messages Not Displayed in Loan Product

[JaySoni1]

Chnages Made :-

-Added error messages for required fields on the Create Loan Product .

WEB-708

Before :-

After :-

Summary by CodeRabbit

• New Features
  • Improved validation feedback in the loan product terms form with new error messages for required fields including principal, calculation type, and number inputs. Messages appear when fields are touched or modified to guide users through accurate form completion.

[coderabbitai]

Note

.coderabbit.yaml has unrecognized properties

CodeRabbit is using all valid settings from your configuration. Unrecognized properties (listed below) have been ignored and may indicate typos or deprecated fields that can be removed.

⚠️ Parsing warnings (1)

Validation error: Unrecognized key(s) in object: 'pre_merge_checks'

⚙️ Configuration instructions

• Please see the configuration documentation for more information.
• You can also validate your configuration using the online YAML validator.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Walkthrough

This change adds three required-field validation error messages to the loan product terms step form template. The additions display error feedback for principal, overAppliedCalculationType, and overAppliedNumber fields when they are required but not filled and the user has interacted with the form.

Changes

Cohort / File(s)	Summary
Form Validation Messages src/app/products/loan-products/loan-product-stepper/loan-product-terms-step/loan-product-terms-step.component.html	Added three client-side validation error messages for required fields: principal, overAppliedCalculationType, and overAppliedNumber. Each displays a required-field error when the control is required and has been touched or marked dirty.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Possibly related PRs

• WEB-465 Principal field allows zero and negative values in loan product creation form #2890: Modifies validation-related markup for the principal field in the same component, including min/max validation handling.
• WEB-404 Required Field Validation Error Message Missing for Account Type Field in Create GL Account Form #2766: Adds required-field error message validation logic in Angular templates with touched/dirty state checks, establishing a pattern similar to these changes.

Suggested reviewers

• IOhacker
• alberto-art3ch

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'WEB-708 Required Field Validation Messages Not Displayed in Loan Product' directly and clearly summarizes the main change: adding required field validation messages to the loan product form.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

No actionable comments were generated in the recent review. 🎉

🧹 Recent nitpick comments

src/app/products/loan-products/loan-product-stepper/loan-product-terms-step/loan-product-terms-step.component.html (1)

31-39: Redundant touched || dirty guard inside <mat-error> — inconsistent with existing patterns.

Angular Material's <mat-error> is already gated by the default ErrorStateMatcher, which shows errors only when the control is invalid and (touched or form submitted). The extra touched || dirty check in the *ngIf is redundant. It also diverges from how existing required errors are handled in this same file (e.g., line 216 checks only hasError('required'), lines 140-143 use no *ngIf at all).

Consider simplifying to match the existing convention:

Suggested diff

-      <mat-error
-        *ngIf="
-          loanProductTermsForm.get('principal')?.hasError('required') &&
-          (loanProductTermsForm.get('principal')?.touched || loanProductTermsForm.get('principal')?.dirty)
-        "
-      >
+      <mat-error *ngIf="loanProductTermsForm.get('principal')?.hasError('required')">

The same applies to the other two new <mat-error> blocks (lines 71-80 and 88-96).

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[IOhacker]

LGTM

[IOhacker]

LGTM

[JaySoni1]

@IOhacker Thank You for the review