WEB-748: Improve email validation and fix translation namespace consi…

[parth-sharma-10]

WEB-748
This PR improves validation reliability for the Email Address field in the Create Client → General Step.

The existing implementation relied on Angular’s default Validators.email, which permits loosely formatted email inputs. Validation has been strengthened to enforce stricter formatting standards and ensure better data quality.

Additionally, the translation namespace for the email validation message has been corrected to align with the application's established errors.* structure, ensuring consistent i18n behavior across the form.

Summary by CodeRabbit

• New Features
  • Add optional, deploy-time configurable email validation pattern (with sensible default).
• Bug Fixes
  • Email field now required when creating a client.
  • Improved email format validation using configurable regex and clearer invalid-email messaging.
• Documentation
  • README updated with external email validation configuration and example.

[coderabbitai]

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

• @coderabbitai resume to resume automatic reviews.
• @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

• ▶️ Resume reviews
• 🔍 Trigger review

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

Email validation switched from Angular's built-in Validators.email to a configurable regex (environment.EXTERNAL_EMAIL_REGEX with fallback) applied to the emailAddress form control; template error checks and translation key updated. New runtime env keys and README docs added.

Changes

Cohort / File(s)	Summary
Client component (template + logic) src/app/clients/client-stepper/client-general-step/client-general-step.component.ts, src/app/clients/client-stepper/client-general-step/client-general-step.component.html	Replaced Validators.email with Validators.pattern(emailRegex) where emailRegex is derived from environment.EXTERNAL_EMAIL_REGEX or a default. Template error check changed from errors?.email to hasError('pattern') && value and the error translation key updated.
Runtime env assets src/assets/env.js, src/assets/env.template.js	Added EXTERNAL_EMAIL_REGEX property to the client-side runtime env object (window['env']) initialized to '' with a comment describing optional override.
Angular environment configs src/environments/environment.ts, src/environments/environment.prod.ts	Added EXTERNAL_EMAIL_REGEX property to exported environment objects (default/fallback regex present in source).
Documentation README.md	Added "External Email Validation Configuration" section documenting EXTERNAL_EMAIL_REGEX, default fallback, example, and Docker Compose snippet.

Sequence Diagram(s)

sequenceDiagram
    participant Browser
    participant EnvJS as Runtime env (window['env'])
    participant Angular as Build env (environment.ts)
    participant Component as ClientForm
    Browser->>EnvJS: load env.js (sets EXTERNAL_EMAIL_REGEX)
    Browser->>Angular: bootstrap app (app reads environment.EXTERNAL_EMAIL_REGEX or '')
    Angular->>Component: call setClientForm() (derive emailRegex = environment.EXTERNAL_EMAIL_REGEX || DEFAULT)
    Component->>Component: apply Validators.pattern(emailRegex) to emailAddress
    Browser->>Component: user enters email
    Component->>Component: validate input -> pattern check
    Component->>Browser: template shows error if hasError('pattern') && value

Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

• WEB-600 feat:External National ID System integration for client creat… #3145 — Modifies the same ClientGeneralStepComponent (.ts and .html) affecting form validation and initialization; likely related.

Suggested reviewers

• IOhacker

🚥 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 accurately summarizes the main changes: improving email validation and fixing translation namespace inconsistency, which are the primary objectives of this PR.
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

---

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.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In
`@src/app/clients/client-stepper/client-general-step/client-general-step.component.ts`:
- Around line 134-140: The emailAddress FormControl in
ClientGeneralStepComponent was made required (Validators.required) which changes
behavior; remove Validators.required so the control remains optional and keep
only the pattern validator so format is enforced only when a value is present,
or if requirement depends on client type add a conditional required validator
(e.g., add/remove Validators.required at runtime based on client type) instead
of a static required in the control definition.

[IOhacker]

The email must be optional

[parth-sharma-10]

The email must be optional

@IOhacker I have updated the PR. The email is now optional.

[coderabbitai]

Actionable comments posted: 4

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@README.md`:
- Around line 382-385: The fenced code block containing the environment variable
declaration EXTERNAL_EMAIL_REGEX should include a language specifier to satisfy
markdownlint MD040; update the block opening from ``` to ```bash (or another
appropriate language like sh) so the snippet reads as a shell-style code block
and linter warnings are resolved.

In `@src/assets/env.template.js`:
- Around line 124-125: The new env.template.js entry for
window['env']['EXTERNAL_EMAIL_REGEX'] currently hardcodes an empty string,
preventing runtime substitution; change it to use the same envsubst placeholder
pattern as other keys (e.g., '$EXTERNAL_EMAIL_REGEX') so Docker/nginx envsubst
can inject the environment variable at deploy time and the app can read
EXTERNAL_EMAIL_REGEX from loadedEnv; update the
window['env']['EXTERNAL_EMAIL_REGEX'] assignment to mirror the placeholder style
used by window['env']['EXTERNAL_NATIONAL_ID_REGEX'] and other entries.

In `@src/environments/environment.prod.ts`:
- Line 19: Production environment value EXTERNAL_EMAIL_REGEX is hard-coded to an
empty string; update it to read the runtime-loaded value like the other entries
(use loadedEnv['EXTERNAL_EMAIL_REGEX'] || '') so it follows the bracket-notation
pattern used elsewhere (see externalNationalIdRegex for reference) and becomes
runtime-configurable.

In `@src/environments/environment.ts`:
- Line 22: EXTERNAL_EMAIL_REGEX is hardcoded to an empty string so it never
reads runtime values; update the environment export to read from loadedEnv by
changing EXTERNAL_EMAIL_REGEX to use loadedEnv.EXTERNAL_EMAIL_REGEX || '' so the
runtime-injected window.env value is used (match the pattern used by other keys
like externalNationalIdRegex).

[parth-sharma-10]

Hi @IOhacker, I’ve addressed the comments. Could you please take another look when you get a chance? Thanks!

[alberto-art3ch]

Please review my comment

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@src/assets/env.js`:
- Around line 114-116: The runtime EXTERNAL_EMAIL_REGEX is never read from
window.env because environment.EXTERNAL_EMAIL_REGEX is hardcoded; update
environment.ts and environment.prod.ts so EXTERNAL_EMAIL_REGEX is assigned from
loadedEnv.EXTERNAL_EMAIL_REGEX with a fallback to the current regex (i.e.,
EXTERNAL_EMAIL_REGEX: loadedEnv.EXTERNAL_EMAIL_REGEX ||
'<current-default-regex>'), update env.template.js (and env.js if used at
build/runtime) to expose the variable like window['env']['EXTERNAL_EMAIL_REGEX']
= '$EXTERNAL_EMAIL_REGEX'; this will allow the component
client-general-step.component.ts (which reads environment.EXTERNAL_EMAIL_REGEX)
to pick up runtime overrides.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: a363965a-fcb7-427d-993a-46e31a548104

📥 Commits

Reviewing files that changed from the base of the PR and between 65be4bc and cc8991e.

📒 Files selected for processing (7)

• README.md
• src/app/clients/client-stepper/client-general-step/client-general-step.component.html
• src/app/clients/client-stepper/client-general-step/client-general-step.component.ts
• src/assets/env.js
• src/assets/env.template.js
• src/environments/environment.prod.ts
• src/environments/environment.ts

🚧 Files skipped from review as they are similar to previous changes (6)

• src/app/clients/client-stepper/client-general-step/client-general-step.component.html
• src/environments/environment.ts
• src/environments/environment.prod.ts
• README.md
• src/assets/env.template.js
• src/app/clients/client-stepper/client-general-step/client-general-step.component.ts

[alberto-art3ch]

Please one last simple comment

[alberto-art3ch]

LGTM