Added better display for when live stream will start.

app/src/DTO/ItemDTO.py

@@ -23,6 +23,7 @@ class ItemDTO:
     timestamp: float = time.time_ns()
     is_live: bool = None
     datetime: str = field(default_factory=lambda: str(formatdate(time.time())))
+    live_in: str = None
 
     # yt-dlp injected fields.
     tmpfilename: str = None

app/src/DataStore.py

@@ -129,6 +129,12 @@ class DataStore:
             except AttributeError:
                 pass
 
+        if hasattr(stored, 'live_in') and stored.status == 'finished':
+            try:
+                delattr(stored, 'live_in')
+            except AttributeError:
+                pass
+
         with sqlite3.connect(self.db_file) as db:
             db.execute(sqlStatement.strip(), (
                 stored._id,

app/src/DownloadQueue.py

@@ -54,11 +54,13 @@ class DownloadQueue:
             return {'status': 'error', 'msg': 'Invalid/empty data was given.'}
 
         error: str = None
+        live_in: str = None
 
         if 'live_status' in entry and 'release_timestamp' in entry and entry.get('live_status') == 'is_upcoming':
             dt_ts = datetime.fromtimestamp(
                 entry.get('release_timestamp'), tz=timezone.utc).strftime('%Y-%m-%d %H:%M:%S %z')
             error = f"Live stream is scheduled to start at {dt_ts}"
+            live_in = formatdate(entry.get('release_timestamp'))
         else:
             error = entry['msg'] if 'msg' in entry else None
 
@@ -125,6 +127,7 @@ class DownloadQueue:
                 datetime=formatdate(time.time()),
                 error=error,
                 is_live=entry['is_live'] if 'is_live' in entry else None,
+                live_in=live_in,
             )
 
             try:

frontend/src/components/Page-Completed.vue

@@ -82,7 +82,7 @@
               <div class="column is-12" v-if="item.error">
                 <span class="has-text-danger">{{ item.error }}</span>
               </div>
-              <div class="column is-4 has-text-centered">
+              <div class="column is-4 has-text-centered" v-if="!item.live_in">
                 <span class="icon-text">
                   <span class="icon"
                     :class="{ 'has-text-success': item.status === 'finished', 'has-text-danger': item.status !== 'finished' }">
@@ -98,6 +98,11 @@
                   {{ moment(item.datetime).fromNow() }}
                 </span>
               </div>
+              <div class="column is-4 has-text-centered" v-if="item.live_in && item.status != 'finished'">
+                <span :date-datetime="item.datetime" data-tooltip="Live in">
+                  {{ moment(item.live_in).fromNow() }}
+                </span>
+              </div>
               <div class="column is-4 has-text-centered">
                 <label class="checkbox is-block">
                   <input class="completed-checkbox" type="checkbox" v-model="selectedElms" :id="'checkbox-' + item._id"

frontend/src/components/Page-Downloading.vue

@@ -1,11 +1,11 @@
 <template>
   <h1 class="mt-3 is-size-3 is-clickable is-unselectable" @click="showQueue = !showQueue">
-    <icon class="icon-text">
+    <span class="icon-text">
       <span class="icon">
         <font-awesome-icon :icon="showQueue ? 'fa-solid fa-arrow-up' : 'fa-solid fa-arrow-down'" />
       </span>
       <span>Queue <span v-if="hasQueuedItems">({{ getTotal }})</span></span>
-    </icon>
+    </span>
   </h1>
 
   <div v-if="showQueue">