[GitHub] [airflow] ryanahamilton commented on a change in pull request #16129: Format more dates with timezone

[GitBox <gi...@apache.org>]

ryanahamilton commented on a change in pull request #16129:
URL: https://github.com/apache/airflow/pull/16129#discussion_r641083047



##########
File path: airflow/www/templates/airflow/dag_details.html
##########
@@ -50,11 +50,11 @@ <h3>{{ title }}</h3>
     </tr>
     <tr>
       <th>Start Date</th>
-      <td>{{ dag.start_date }}</td>
+      <td class="format-date">{{ dag.start_date }}</td>

Review comment:
       ```suggestion
         <td class="js-format-date">{{ dag.start_date }}</td>
   ```

##########
File path: airflow/www/static/js/task.js
##########
@@ -17,11 +17,18 @@
  * under the License.
  */
 
-/* global document */
-import { formatDateTime } from './datetime_utils';
+/* global document, moment */
 
-// reformat execution date to be more human-readable
+// reformat task details to be more human-readable
 document.addEventListener('DOMContentLoaded', () => {
-  const date = document.getElementById('ti_execution_date');
-  date.innerHTML = formatDateTime(date.innerHTML);
+  document.querySelectorAll('.ti-attr').forEach((attr) => {
+    const value = attr.innerHTML;
+    if (value.length === 32 && moment(value, 'YYYY-MM-DD').isValid()) {
+      // 32 is the length of our timestamps
+      attr.className = 'format-date';

Review comment:
       ```suggestion
         attr.className = 'js-format-date';
   ```

##########
File path: airflow/www/templates/airflow/dag_details.html
##########
@@ -50,11 +50,11 @@ <h3>{{ title }}</h3>
     </tr>
     <tr>
       <th>Start Date</th>
-      <td>{{ dag.start_date }}</td>
+      <td class="format-date">{{ dag.start_date }}</td>
     </tr>
     <tr>
       <th>End Date</th>
-      <td>{{ dag.end_date }}</td>
+      <td class="format-date">{{ dag.end_date }}</td>

Review comment:
       ```suggestion
         <td class="js-format-date">{{ dag.end_date }}</td>
   ```

##########
File path: 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 id="ti_execution_date">{{ execution_date }}</span>
+    <span class="text-muted">at</span> <span class="format-date">{{ execution_date }}</span>

Review comment:
       ```suggestion
       <span class="text-muted">at</span> <span class="js-format-date">{{ execution_date }}</span>
   ```

##########
File path: airflow/www/static/js/ti_log.js
##########
@@ -113,7 +115,9 @@ function autoTailingLog(tryNumber, metadata = null, autoTailing = false) {
 
         // The message may contain HTML, so either have to escape it or write it as text.
         const escapedMessage = escapeHtml(item[1]);
-        const linkifiedMessage = escapedMessage.replace(urlRegex, (url) => `<a href="${url}" target="_blank">${url}</a>`);
+        const linkifiedMessage = escapedMessage
+          .replace(urlRegex, (url) => `<a href="${url}" target="_blank">${url}</a>`)
+          .replaceAll(dateRegex, (date) => `<span class="format-date">${formatDateTime(`${date}+00:00`)}</span>`);

Review comment:
       ```suggestion
             .replaceAll(dateRegex, (date) => `<span class="js-format-date">${formatDateTime(`${date}+00:00`)}</span>`);
   ```

##########
File path: airflow/www/static/js/datetime_utils.js
##########
@@ -88,6 +88,12 @@ export function updateAllDateTimes() {
   $('.datetime input').each((_, el) => {
     el.value = moment(el.value).format();
   });
+
+  $('.format-date').each((_, el) => {

Review comment:
       ```suggestion
     $('.js-format-date').each((_, el) => {
   ```




-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org