Skip to content

[FLINK-39042][webui] Make watermark timestamps timezone-aware and configurable#28096

Open
featzhang wants to merge 3 commits intoapache:release-1.20from
featzhang:backport/FLINK-39042-release-1.20
Open

[FLINK-39042][webui] Make watermark timestamps timezone-aware and configurable#28096
featzhang wants to merge 3 commits intoapache:release-1.20from
featzhang:backport/FLINK-39042-release-1.20

Conversation

@featzhang
Copy link
Copy Markdown
Member

@featzhang featzhang commented May 3, 2026

What is the purpose of the change

Backport of #27552 to release-1.20.

The original PR makes watermark timestamps on the Flink Web UI timezone-aware and user-configurable, so operators working across different regions can read watermark values in their preferred timezone without mental UTC-offset conversion.

Brief change log

  • Extend HumanizeWatermarkToDatetimePipe to accept a timezone argument and format timestamps via the native Intl.DateTimeFormat API (IANA timezone names, automatic DST handling, falls back to UTC on invalid input).
  • Add a timezone selector to the watermarks drawer (job-overview-drawer-watermarks):
    • Populated from Intl.supportedValuesOf('timeZone') (full IANA list).
    • Defaults to the browser's local timezone.
    • Selection is applied live to the rendered watermark column.
  • Minor styling for the new selector.

No backend / REST API change — UI only.

Cherry-pick notes

  • Cherry-picked from master merge commit 64d0316aad22e83888b65e6c3036d0a980ae33a9.
  • Single conflict in flink-runtime-web/web-dashboard/src/app/pages/job/job-detail/status/job-status.component.less:
    The master diff only reordered CSS properties inside a .back-link selector that does not exist on release-1.20. The conflict is unrelated to the watermark feature and was resolved by keeping release-1.20's version (i.e. dropping the unrelated reorder). No functional difference.
  • No other conflicts; NzTooltipModule naming already matches between master and release-1.20.

Verifying this change

  • npm run lint passes locally (eslint + stylelint clean).
  • Manual verification plan:
    1. Open Web UI → job detail → watermarks drawer.
    2. Switch timezone selector; watermark timestamps re-render in the chosen zone.
    3. Refresh — selector defaults back to browser local timezone.

Does this pull request potentially affect one of the following parts

  • Dependencies (does it add or upgrade a dependency): no
  • The public API, i.e., is any changed class annotated with @Public(Evolving): no
  • The serializers: no
  • The runtime per-record code paths (performance sensitive): no
  • Anything that affects deployment or recovery: no
  • The S3 file system connector: no

Documentation

  • Does this pull request introduce a new feature? no (backport of an already-documented feature)
  • If yes, how is the feature documented? Not applicable.

@featzhang
[FLINK-39042][webui] Make watermark timestamps timezone-aware and con…
012e6b2 
…figurable (apache#27552)

* [FLINK-39042][ui] Make watermark timestamps timezone-aware and configurable

* [FLINK-39042][webui] Use Intl API for timezone handling and support DST

Address review feedback:
- Use native Intl.DateTimeFormat API instead of manual offset calculation
- Replace fixed UTC offsets with IANA timezone names (e.g., America/Los_Angeles)
- IANA timezones automatically handle daylight saving time transitions
- Remove redundant console.log statements and improve code quality
- Add documentation comments with reference to IANA timezone database

* [FLINK-39042][webui] Make watermark timestamps timezone-aware and configurable

* [FLINK-39042][webui] Address code review comments

- Add MDN reference for Intl.DateTimeFormat API
- Clarify DST handling in timezone abbreviations (e.g., PST vs PDT)
- Improve error messages to explicitly mention UTC fallback
- Update comments to better explain timezone resolution logic

* Address review comments

- Remove 'pure: false' from HumanizeWatermarkToDatetimePipe as template already passes timezone argument
- Use Intl.supportedValuesOf('timeZone') to get all supported timezones instead of hardcoded list
- Keep browser local timezone as default
- Revert unnecessary changes in job-status.component.less

* fix: improve timezone fallback handling and CSS property ordering

- Enhance timezone detection fallback logic in watermark component\n- Fix CSS property ordering in job status component for better maintainability

* style: improve code formatting for better readability

- Split long lines in timezone options initialization for improved code readability

* style: optimize CSS property ordering for better maintainability

- Reorder CSS properties in job status component for improved code organization

* fix: add type assertion for Intl.supportedValuesOf to fix TS compilation error

* [FLINK-39042][webui] Use browser locale instead of hardcoded en-US in watermark datetime pipe

Replace hardcoded 'en-US' locale with undefined in Intl.DateTimeFormat to
respect the user's browser locale settings. This ensures the date display
order follows the user's regional preferences rather than being fixed to
the en-US format.

Suggested by @davidradl in code review.
@flinkbot
Copy link
Copy Markdown
Collaborator

flinkbot commented May 3, 2026 •
edited
Loading

CI report:

Bot commands The @flinkbot bot supports the following commands:
  • @flinkbot run azure re-run the last Azure build

@featzhang featzhang changed the title [BP-1.20][FLINK-39042][webui] Make watermark timestamps timezone-aware and configurable [FLINK-39042][webui] Make watermark timestamps timezone-aware and configurable May 3, 2026
featzhang added 2 commits May 4, 2026 02:46
@featzhang
[hotfix][ci] Trigger Azure CI re-run after flaky MinioTestContainerTe…
5082892 
…st failure

The previous CI build #74753 failed only in the 'Test - connect' stage due to
MinioTestContainerTest failing to launch minio:RELEASE.2022-02-07T08-17-33Z
Docker container (InvalidFormatException on Docker daemon timestamps with
9-digit nanosecond precision). This is a well-known infrastructure flaky
unrelated to this PR, which only touches flink-runtime-web/web-dashboard
TypeScript/LESS/HTML files. Pushing an empty commit to re-trigger a fresh
Azure build on a different agent.
@featzhang
[hotfix][ci] Re-trigger Azure CI (2nd attempt) after MinioTestContain…
2d64000 
…er flaky

Previous Azure build #74758 failed again in the exact same infrastructure flaky:
flink-s3-fs-base MinioTestContainerTest could not launch the MinIO Docker
container because testcontainers (bundled on release-1.20) cannot parse the
9-digit nanosecond timestamp returned by the Docker daemon.

No code change in this PR touches flink-s3-fs-base. Re-running.
@featzhang
Copy link
Copy Markdown
Member Author

featzhang commented May 4, 2026

Request for no-CI-required merge

This backport PR only touches 4 files under flink-runtime-web/web-dashboard/ - all are TypeScript / HTML / LESS changes. The CI failures in Azure build #74768 are caused by a well-known release-1.20 infrastructure flaky (MinioTestContainerTest in flink-filesystems/flink-s3-fs-base), which is completely unrelated to this PR.

Evidence:

  • The failing test MinioTestContainerTest is in flink-filesystems/flink-s3-fs-base, while this PR only modifies flink-runtime-web/web-dashboard/*
  • The root cause is an outdated testcontainers/Jackson version on release-1.20 that cannot parse Docker daemon timestamps with 9-digit nanosecond precision - a branch-level infrastructure issue, not a code issue
  • Two empty-commit re-runs (build #74758 and #74768) both hit the exact same flaky

Given that:

  1. This PR has been reviewed and approved in the original master PR [FLINK-39042][webui] Make watermark timestamps timezone-aware and configurable #27552
  2. The changes are purely front-end (Angular) and isolated to the web dashboard module
  3. The CI failures are confirmed 100% unrelated to this PR scope
  4. The release-1.20 branch infrastructure flaky is unlikely to be resolved in the near term

I kindly request the committer to consider a no-CI-required merge for this backport PR, following the same approach used for EOL branch backports (e.g., PR #28048 on release-1.15).

Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

target:release-1.20

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@featzhang @flinkbot