feat: add activated-at column to frontend detours list

mbta · Jan 15, 2025 · eb4f28a · eb4f28a
1 parent e02c584
commit eb4f28a
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 9 deletions.
diff --git a/assets/src/components/detoursTable.tsx b/assets/src/components/detoursTable.tsx
@@ -1,8 +1,8 @@
 import React from "react"
 import { Table } from "react-bootstrap"
 import { RoutePill } from "./routePill"
-import { useCurrentTimeSeconds } from "../hooks/useCurrentTime"
-import { timeAgoLabel } from "../util/dateTime"
+import { useCurrentTime } from "../hooks/useCurrentTime"
+import { timeAgoLabel, timeAgoLabelFromDate } from "../util/dateTime"
 import { SimpleDetour } from "../models/detoursList"
 import { EmptyDetourTableIcon } from "../helpers/skateIcons"
 import { joinClasses } from "../helpers/dom"
@@ -55,7 +55,11 @@ export const DetoursTable = ({
     </thead>
     <tbody>
       {data ? (
-        <PopulatedDetourRows data={data} onOpenDetour={onOpenDetour} />
+        <PopulatedDetourRows
+          status={status}
+          data={data}
+          onOpenDetour={onOpenDetour}
+        />
       ) : (
         <EmptyDetourRows message={`No ${status} detours.`} />
       )}
@@ -65,12 +69,15 @@ export const DetoursTable = ({
 
 const PopulatedDetourRows = ({
   data,
+  status,
   onOpenDetour,
 }: {
   data: SimpleDetour[]
+  status: DetourStatus
   onOpenDetour: (detourId: number) => void
 }) => {
-  const epochNowInSeconds = useCurrentTimeSeconds()
+  const epochNow = useCurrentTime()
+  const epochNowInSeconds = epochNow.valueOf() / 1000
 
   return (
     <>
@@ -91,7 +98,9 @@ const PopulatedDetourRows = ({
             {detour.intersection}
           </td>
           <td className="align-middle p-3 u-hide-for-mobile">
-            {timeAgoLabel(epochNowInSeconds, detour.updatedAt)}
+            {status === DetourStatus.Active && detour.activatedAt
+              ? timeAgoLabelFromDate(detour.activatedAt, epochNow)
+              : timeAgoLabel(epochNowInSeconds, detour.updatedAt)}
           </td>
         </tr>
       ))}

diff --git a/assets/tests/components/detours/__snapshots__/detoursListPage.openDetour.test.tsx.snap b/assets/tests/components/detours/__snapshots__/detoursListPage.openDetour.test.tsx.snap
@@ -124,7 +124,7 @@ exports[`Detours Page: Open a Detour renders detour details in an open drawer on
             <td
               class="align-middle p-3 u-hide-for-mobile"
             >
-              26 hours ago
+              Just now
             </td>
           </tr>
           <tr>
@@ -163,7 +163,7 @@ exports[`Detours Page: Open a Detour renders detour details in an open drawer on
             <td
               class="align-middle p-3 u-hide-for-mobile"
             >
-              26 hours ago
+              Just now
             </td>
           </tr>
         </tbody>
@@ -971,7 +971,7 @@ exports[`Detours Page: Open a Detour renders detour details modal to match mocke
             <td
               class="align-middle p-3 u-hide-for-mobile"
             >
-              26 hours ago
+              Just now
             </td>
           </tr>
           <tr>
@@ -1010,7 +1010,7 @@ exports[`Detours Page: Open a Detour renders detour details modal to match mocke
             <td
               class="align-middle p-3 u-hide-for-mobile"
             >
-              26 hours ago
+              Just now
             </td>
           </tr>
         </tbody>