From fe44af7d38bdb2cbfa626cfd288f8d19f6eb2656 Mon Sep 17 00:00:00 2001
From: Nick Sandstrom <32273437+nick4810@users.noreply.github.com>
Date: Sat, 27 Jun 2026 01:51:47 -0700
Subject: [PATCH] Updated to use datetime util

---
 frontend/src/components/cards/VodConnectionCard.jsx | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/cards/VodConnectionCard.jsx b/frontend/src/components/cards/VodConnectionCard.jsx
index 90b4c034..8efe4e55 100644
--- a/frontend/src/components/cards/VodConnectionCard.jsx
+++ b/frontend/src/components/cards/VodConnectionCard.jsx
@@ -16,6 +16,7 @@ import {
 } from '@mantine/core';
 import {
   convertToSec,
+  formatDuration,
   fromNow,
   toFriendlyDuration,
   useDateTimeFormat,
@@ -31,8 +32,6 @@ import {
   calculateConnectionDuration,
   calculateConnectionStartTime,
   calculateProgress,
-  formatDuration,
-  formatTime,
   getEpisodeDisplayTitle,
   getEpisodeSubtitle,
   getMovieDisplayTitle,
@@ -154,7 +153,7 @@ const ConnectionProgress = ({ connection, durationSecs }) => {
           Progress
         </Text>
         <Text size="xs" c="dimmed">
-          {formatTime(currentTime)} / {formatTime(totalTime)}
+          {formatDuration(currentTime)} / {formatDuration(totalTime)}
         </Text>
       </Group>
       <Progress
@@ -370,11 +369,10 @@ const VodConnectionCard = ({ vodContent, stopVODClient }) => {
               </Badge>
             </Tooltip>
           )}
-
           {metadata.duration_secs && (
             <Tooltip label="Content Duration">
               <Badge size="sm" variant="light" color="blue">
-                {formatDuration(metadata.duration_secs)}
+                {formatDuration(metadata.duration_secs, { zeroValue: 'Unknown', precision: 'hm' })}
               </Badge>
             </Tooltip>
           )}