You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@airflow.apache.org by bb...@apache.org on 2021/09/29 19:16:12 UTC

[airflow] branch main updated: Improve how UI handles datetimes (#18611)

This is an automated email from the ASF dual-hosted git repository.

bbovenzi pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/airflow.git


The following commit(s) were added to refs/heads/main by this push:
     new 324aca4  Improve how UI handles datetimes (#18611)
324aca4 is described below

commit 324aca410bbbddb22336746338ea8a60ad0b3989
Author: Brent Bovenzi <br...@gmail.com>
AuthorDate: Wed Sep 29 14:15:50 2021 -0500

    Improve how UI handles datetimes (#18611)
---
 airflow/www/static/js/datetime_utils.js          | 6 ------
 airflow/www/static/js/task.js                    | 2 +-
 airflow/www/static/js/ti_log.js                  | 3 +--
 airflow/www/templates/airflow/dag_details.html   | 4 ++--
 airflow/www/templates/airflow/task_instance.html | 2 +-
 airflow/www/views.py                             | 1 +
 6 files changed, 6 insertions(+), 12 deletions(-)

diff --git a/airflow/www/static/js/datetime_utils.js b/airflow/www/static/js/datetime_utils.js
index 9357382..381c25e 100644
--- a/airflow/www/static/js/datetime_utils.js
+++ b/airflow/www/static/js/datetime_utils.js
@@ -91,12 +91,6 @@ export function updateAllDateTimes() {
   $('.datetime input').each((_, el) => {
     el.value = moment(el.value).format();
   });
-
-  $('.js-format-date').each((_, el) => {
-    el.innerHTML = moment(el.innerHTML, 'YYYY-MM-DD').isValid()
-      ? formatDateTime(el.innerHTML)
-      : el.innerHTML;
-  });
 }
 
 export function setDisplayedTimezone(tz) {
diff --git a/airflow/www/static/js/task.js b/airflow/www/static/js/task.js
index 8e6c890..6d0ee23 100644
--- a/airflow/www/static/js/task.js
+++ b/airflow/www/static/js/task.js
@@ -25,7 +25,7 @@ document.addEventListener('DOMContentLoaded', () => {
     const value = attr.innerHTML;
     if (value.length === 32 && moment(value, 'YYYY-MM-DD').isValid()) {
       // 32 is the length of our timestamps
-      attr.className = 'js-format-date';
+      attr.innerHTML = `<time datetime="${value}">${value}</time>`;
     } else if (value.includes('http')) {
       // very basic url detection
       attr.innerHTML = `<a href=${value}>${value}</a>`;
diff --git a/airflow/www/static/js/ti_log.js b/airflow/www/static/js/ti_log.js
index b2909d8..a0ac2b2 100644
--- a/airflow/www/static/js/ti_log.js
+++ b/airflow/www/static/js/ti_log.js
@@ -18,7 +18,6 @@
  */
 
 /* global document, window, $, */
-import { formatDateTime } from './datetime_utils';
 import { escapeHtml } from './main';
 import getMetaValue from './meta_value';
 
@@ -117,7 +116,7 @@ function autoTailingLog(tryNumber, metadata = null, autoTailing = false) {
         const escapedMessage = escapeHtml(item[1]);
         const linkifiedMessage = escapedMessage
           .replace(urlRegex, (url) => `<a href="${url}" target="_blank">${url}</a>`)
-          .replaceAll(dateRegex, (date) => `<span class="js-format-date">${formatDateTime(`${date}+00:00`)}</span>`);
+          .replaceAll(dateRegex, (date) => `<time datetime="${date}+00:00">${date}+00:00</time>`);
         logBlock.innerHTML += `${linkifiedMessage}\n`;
       });
 
diff --git a/airflow/www/templates/airflow/dag_details.html b/airflow/www/templates/airflow/dag_details.html
index 4d8fe0e..a06fc99 100644
--- a/airflow/www/templates/airflow/dag_details.html
+++ b/airflow/www/templates/airflow/dag_details.html
@@ -55,7 +55,7 @@
     {% if dag.catchup %}
       <tr>
         <th>Start Date</th>
-        <td class="js-format-date">{{ dag.start_date }}</td>
+        <td><time datetime="{{ dag.start_date }}">{{ dag.start_date }}</time></td>
       </tr>
     {% else %}
       <tr>
@@ -65,7 +65,7 @@
     {% endif %}
     <tr>
       <th>End Date</th>
-      <td class="js-format-date">{{ dag.end_date }}</td>
+      <td><time datetime="{{ dag.end_date }}">{{ dag.end_date }}</time></td>
     </tr>
     <tr>
       <th>Max Active Runs</th>
diff --git a/airflow/www/templates/airflow/task_instance.html b/airflow/www/templates/airflow/task_instance.html
index 1719466..8626cae 100644
--- a/airflow/www/templates/airflow/task_instance.html
+++ b/airflow/www/templates/airflow/task_instance.html
@@ -26,7 +26,7 @@
   <br>
   <h4>
     <span class="text-muted">Task Instance:</span> <span>{{ task_id }}</span>
-    <span class="text-muted">at</span> <span class="js-format-date">{{ execution_date }}</span>
+    <span class="text-muted">at</span> <time datetime="{{ execution_date }}">{{ execution_date }}</time>
   </h4>
   <ul class="nav nav-pills">
     <li><a href="{{ url_for('Airflow.task', dag_id=dag.dag_id, task_id=task_id, execution_date=execution_date) }}">
diff --git a/airflow/www/views.py b/airflow/www/views.py
index 4a22fab..8b1ea77 100644
--- a/airflow/www/views.py
+++ b/airflow/www/views.py
@@ -3918,6 +3918,7 @@ class DagRunModelView(AirflowPrivilegeVerifierModelView):
         'state': wwwutils.state_f,
         'start_date': wwwutils.datetime_f('start_date'),
         'end_date': wwwutils.datetime_f('end_date'),
+        'queued_at': wwwutils.datetime_f('queued_at'),
         'dag_id': wwwutils.dag_link,
         'run_id': wwwutils.dag_run_link,
         'conf': wwwutils.json_f('conf'),