WEB-714: Add submit button to user settings

[DeathGun44]

Description

Replaced the silent auto-save behavior in User Settings with an explicit Submit button. Previously, the Main Configuration fields (Language, Date Format, Decimals to Display) were auto-saved on every dropdown change via valueChanges subscriptions with no user feedback. This change adds:

• Submit button with dirty-state tracking — enabled only when the user modifies a field
• Success feedback via AlertService ("Settings saved successfully.")
• Proper cleanup via OnDestroy with takeUntil to prevent memory leaks

The submit button covers all previously working fields: Language, Date Format, and Decimals to Display.

Screenshots

Checklist

• If you have multiple commits please combine them into one commit by squashing them.
• Read and understood the contribution guidelines at web-app/.github/CONTRIBUTING.md.

Summary by CodeRabbit

Release Notes

• New Features
  • Added a Submit button to the settings section that becomes enabled when you make changes to your preferences
  • Use the Submit button to save all your settings modifications at once
  • A success confirmation notification appears after your settings are successfully saved

[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

The PR adds form submission functionality to the settings component, including a styled Submit button enabled only when changes are detected, change tracking logic, and persistence via SettingsService with alert feedback.

Changes

Cohort / File(s)	Summary
Settings Component UI & Logic src/app/settings/settings.component.html, src/app/settings/settings.component.scss, src/app/settings/settings.component.ts	Adds Submit button to form with conditional enable/disable based on hasChanges flag; implements change tracking by merging valueChanges from form controls; persists settings through SettingsService methods; integrates AlertService for success feedback; manages component lifecycle with OnDestroy and destroy$ Subject pattern.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Suggested reviewers

• steinwinde

🚥 Pre-merge checks | ✅ 3 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Merge Conflict Detection	⚠️ Warning	❌ Merge conflicts detected (24 files): ⚔️ src/app/clients/create-client/create-client.component.ts (content) ⚔️ src/app/core/utils/datatables.ts (content) ⚔️ src/app/organization/bulk-loan-reassignmnet/bulk-loan-reassignmnet.component.ts (content) ⚔️ src/app/organization/fund-mapping/fund-mapping.component.ts (content) ⚔️ src/app/products/loan-products/loan-product-stepper/loan-product-accounting-step/advanced-accounting-mapping-rule/advanced-accounting-mapping-rule.component.ts (content) ⚔️ src/app/products/manage-delinquency-buckets/delinquency-range/create-range/create-range.component.ts (content) ⚔️ src/app/settings/settings.component.html (content) ⚔️ src/app/settings/settings.component.scss (content) ⚔️ src/app/settings/settings.component.ts (content) ⚔️ src/app/system/manage-jobs/workflow-jobs/workflow-jobs.component.html (content) ⚔️ src/app/tasks/checker-inbox-and-tasks-tabs/loan-disbursal/loan-disbursal.component.ts (content) ⚔️ src/assets/translations/cs-CS.json (content) ⚔️ src/assets/translations/de-DE.json (content) ⚔️ src/assets/translations/en-US.json (content) ⚔️ src/assets/translations/es-CL.json (content) ⚔️ src/assets/translations/es-MX.json (content) ⚔️ src/assets/translations/fr-FR.json (content) ⚔️ src/assets/translations/it-IT.json (content) ⚔️ src/assets/translations/ko-KO.json (content) ⚔️ src/assets/translations/lt-LT.json (content) ⚔️ src/assets/translations/lv-LV.json (content) ⚔️ src/assets/translations/ne-NE.json (content) ⚔️ src/assets/translations/pt-PT.json (content) ⚔️ src/assets/translations/sw-SW.json (content) These conflicts must be resolved before merging into dev.	Resolve conflicts locally and push changes to this branch.

✅ 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 clearly summarizes the main change: adding a submit button to user settings instead of auto-save behavior.
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 docstrings

🧪 Generate unit tests (beta)

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

⚔️ Resolve merge conflicts (beta)

• Auto-commit resolved conflicts to branch WEB-714/enable-submit-to-user-settings
• Post resolved changes as copyable diffs in a comment

---

No actionable comments were generated in the recent review. 🎉

🧹 Recent nitpick comments

src/app/settings/settings.component.html (1)

25-25: Use a stable identifier for track on object collections.

track language tracks by object reference, which won't help Angular optimize re-renders if the languages array is ever re-created. Use the unique code property instead.

-            `@for` (language of languages; track language) {
+            `@for` (language of languages; track language.code) {

As per coding guidelines: "verify … trackBy on *ngFor" — the @for track expression should use a stable identity key for object collections.

src/app/settings/settings.component.ts (2)

93-106: hasChanges doesn't reset when the user reverts to the original values.

If a user changes a dropdown and then changes it back to the initial value, the Submit button remains enabled. For a simple settings form this is low-impact, but you could compare against the initial snapshot to get true dirty detection.

💡 Optional: track initial values for accurate dirty state

+  private initialLanguage: any;
+  private initialDateFormat: string;
+  private initialDecimals: string;
+
   ngOnInit() {
     this.language.patchValue(this.settingsService.language, { emitEvent: false });
     this.dateFormat.patchValue(this.settingsService.dateFormat, { emitEvent: false });
     this.decimalsToDisplay.patchValue(this.settingsService.decimals, { emitEvent: false });
+    this.initialLanguage = this.language.value;
+    this.initialDateFormat = this.dateFormat.value;
+    this.initialDecimals = this.decimalsToDisplay.value;
     this.trackChanges();
   }

   trackChanges(): void {
     merge(this.language.valueChanges, this.dateFormat.valueChanges, this.decimalsToDisplay.valueChanges)
       .pipe(takeUntil(this.destroy$))
       .subscribe(() => {
-        this.hasChanges = true;
+        this.hasChanges =
+          this.language.value?.code !== this.initialLanguage?.code ||
+          this.dateFormat.value !== this.initialDateFormat ||
+          this.decimalsToDisplay.value !== this.initialDecimals;
       });
   }

---

108-117: Submit assumes all service calls succeed; consider updating initial snapshot on save.

settingsService.setLanguage / setDateFormat / setDecimalToDisplay appear synchronous (localStorage), so error handling isn't critical. However, if submit() is considered a "save point," the initial values (if you adopt the suggestion above) should be updated here to keep dirty tracking accurate after a save.

Also, the success alert message is hardcoded in English. Since other strings use the translate pipe, consider using TranslateService for this message as well for i18n consistency.

---

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]

Is there a way to translate this message?