Add Links to Edge React UI

[jscheffl]

Some (next) level of beautification to React UI of Edge Provider:

• Adding links from tasks to the Dag pages
• Adding links from a job to worker
• Adding time prints as relative time stamps "N seconds ago" instead of "2025-09-07T23:45:12.12345Z"
• Some more tooltip to worker state

@pierrejeambrun / @shubhamraj-git / @bbovenzi I attempted to use <Link to=...> from react-router-dom but seems this is only working inside the plugin but links to core UI generate blank pages. Is there a security barrier I need to break or how can I make internal links working from the plugin? Security barrier? Needed to switch to the <Link href=... from React which is always making a full page reload which is un-cool.

FYI @dheerajturaga

[dheerajturaga]

@jscheffl, I tested this. Couple of observations.

1. The Edge Worker Jobs seem to vanish after a few minutes

2. The relative time print updating every second is probably not necessary, We should probably do less than a minute ago and then do x minutes ago instead. having the page change less often would be my personal nit

[jscheffl]

1. The Edge Worker Jobs seem to vanish after a few minutes

The jobs are vanishing after completion, the time is configurable - individually for failed and success, see: https://airflow.apache.org/docs/apache-airflow-providers-edge3/stable/configurations-ref.html#job-success-purge

2. The relative time print updating every second is probably not necessary, We should probably do less than a minute ago and then do x minutes ago instead. having the page change less often would be my personal nit

Pushed an update to disable "live updates", then the time is only calculated on page refresh. Still in seconds - is this OK? Or do you think a string less than a minute ago is better? Then I need to wrap the <TimeAgo> Component into a custom UI component as it does not support this logic.

[dheerajturaga]

1. The Edge Worker Jobs seem to vanish after a few minutes

The jobs are vanishing after completion, the time is configurable - individually for failed and success, see: https://airflow.apache.org/docs/apache-airflow-providers-edge3/stable/configurations-ref.html#job-success-purge

2. The relative time print updating every second is probably not necessary, We should probably do less than a minute ago and then do x minutes ago instead. having the page change less often would be my personal nit

Pushed an update to disable "live updates", then the time is only calculated on page refresh. Still in seconds - is this OK? Or do you think a string less than a minute ago is better? Then I need to wrap the <TimeAgo> Component into a custom UI component as it does not support this logic.

Yup! This looks good!

[Copilot]

Pull Request Overview

This PR enhances the React UI for the Edge Provider by adding navigation links, relative timestamps, and improved tooltips to improve user experience and navigation.

• Adds clickable links from jobs to DAG pages and from workers to job details
• Replaces absolute timestamps with relative "time ago" format using react-timeago
• Enhances worker state badges with descriptive tooltips and adds scroll-to-anchor functionality

Reviewed Changes

Copilot reviewed 7 out of 9 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
providers/edge3/www-hash.txt	Updates the hash for the built web assets
providers/edge3/src/airflow/providers/edge3/plugins/www/src/pages/WorkerPage.tsx	Adds TimeAgo components for timestamps and scroll-to-anchor functionality
providers/edge3/src/airflow/providers/edge3/plugins/www/src/pages/JobsPage.tsx	Adds navigation links to DAGs/tasks and TimeAgo components for timestamps
providers/edge3/src/airflow/providers/edge3/plugins/www/src/components/ui/index.ts	Exports the new ScrollToAnchor component
providers/edge3/src/airflow/providers/edge3/plugins/www/src/components/ui/ScrollToAnchor.tsx	New component for handling URL hash navigation
providers/edge3/src/airflow/providers/edge3/plugins/www/src/components/WorkerStateBadge.tsx	Adds tooltips with state descriptions
providers/edge3/src/airflow/providers/edge3/plugins/www/package.json	Adds react-timeago dependency and other packages

Files not reviewed (1)

• providers/edge3/src/airflow/providers/edge3/plugins/www/pnpm-lock.yaml: Language not supported

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}