AB#134845: ABC - Add flexible date formatter in forms

[Joselgc1]

Description

Adds flexible date formatting support for forms and templates.

This introduces formatDate(value, format, timezone?) for form expressions and HTML questions, using the existing shared Angular DatePipe behavior. It also extends the existing template/widget expression {{calc.date(value ; format)}} to support an optional timezone parameter: {{calc.date(value ; format ; timezone)}}.

The default timezone is UTC when no timezone is provided. Invalid or missing date values fail gracefully by rendering an empty value instead of breaking the rendered content.

Useful links

• https://dev.azure.com/WHOHQ/EMSSAFE/_workitems/edit/134845/

Type of change

• New feature (non-breaking change which adds functionality)
• Improvement (refactor or addition to existing functionality)

How Has This Been Tested?

• npx nx test shared --testFile=libs/shared/src/lib/utils/custom-functions.spec.ts
• npx nx test shared --testFile=libs/shared/src/lib/services/html-parser/html-parser.service.spec.ts
• npx nx test shared --testFile=libs/shared/src/lib/services/form-helper/form-helper.service.spec.ts
• npx nx lint shared
• Manual test in a form HTML question using {formatDate({submission_date}, 'dd/MM/yyyy HH:mm', 'UTC')}
• Manual test in template/widget syntax using {{calc.date(2024-11-26T23:00:00.000-05:00 ; dd/MM/yyyy HH:mm ; -0500)}}

Screenshots

HTML render:

HTML field markup settings:

<p><strong>Datetime UTC: </strong>{formatDate({submission_date}, 'dd/MM/yyyy HH:mm', 'UTC')}</p>
<p><strong>Datetime Default: </strong>{formatDate({submission_date}, 'dd/MM/yyyy HH:mm')}</p>
<p><strong>Datetime ET: </strong>{formatDate({submission_date}, 'dd/MM/yyyy HH:mm', 'ET')}</p>
<p><strong>Long Format: </strong>{formatDate({submission_date}, 'MMM d, y, h:mm a', 'UTC')}</p>
<p><strong>Test: </strong>{formatDate('2024-11-26T23:00:00.000-05:00', 'dd/MM/yyyy HH:mm')}</p>
<p><strong>Test: </strong>{formatDate('2024-11-26T23:00:00.000-05:00', 'dd/MM/yyyy HH:mm', '-0500')}</p>

Summary Card widget:

Text Editor:

{{calc.date(2024-11-26T23:00:00.000-05:00 ; dd/MM/yyyy HH:mm ; -0500)}}

Checklist:

( * == Mandatory )

• * I have set myself as assignee of the pull request
• * My code follows the style guidelines of this project
• * Linting does not generate new warnings
• * I have performed a self-review of my own code
• * I have put the ticket for review, adding the oort-frontend team to the list of reviewers
• * I have commented my code, particularly in hard-to-understand areas
• * I have put JSDoc comment in all required places
• * My changes generate no new warnings
• * I have included screenshots describing my changes if relevant
• * I have selected labels in the Pull Request, according to the changes with code brings
• I have made corresponding changes to the documentation ( if required )
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• Any dependent changes have been merged and published in downstream modules