Use <Time /> in Mapped Instance table (#23313)

The start/end dates for a mapped instance weren't updating when a user changed their timezone. Using <Time /> fixes that (cherry picked from commit 98ec8c6)
apache · May 8, 2022 · ee19458 · ee19458
1 parent d81bf85
commit ee19458
Showing 1 changed file with 4 additions and 3 deletions.
diff --git a/airflow/www/static/js/tree/details/content/taskInstance/MappedInstances.jsx b/airflow/www/static/js/tree/details/content/taskInstance/MappedInstances.jsx
@@ -31,10 +31,11 @@ import {
 } from 'react-icons/md';
 
 import { getMetaValue } from '../../../../utils';
-import { formatDateTime, formatDuration, getDuration } from '../../../../datetime_utils';
+import { formatDuration, getDuration } from '../../../../datetime_utils';
 import { useMappedInstances } from '../../../api';
 import { SimpleStatus } from '../../../StatusBox';
 import Table from '../../../Table';
+import Time from '../../../Time';
 
 const renderedTemplatesUrl = getMetaValue('rendered_templates_url');
 const logUrl = getMetaValue('log_url');
@@ -84,8 +85,8 @@ const MappedInstances = ({
           </Flex>
         ),
         duration: mi.duration && formatDuration(getDuration(mi.startDate, mi.endDate)),
-        startDate: mi.startDate && formatDateTime(mi.startDate),
-        endDate: mi.endDate && formatDateTime(mi.endDate),
+        startDate: <Time dateTime={mi.startDate} />,
+        endDate: <Time dateTime={mi.endDate} />,
         links: (
           <Flex alignItems="center">
             <IconLink mr={1} title="Details" aria-label="Details" icon={<MdDetails />} href={detailsLink} />