feat: render "active time" in torrent info tab (#537) @invakid404

src/components/TorrentDetail/Tabs/Info.vue

@@ -44,6 +44,15 @@
             {{ torrent.size | getDataUnit(1) }}
           </td>
         </tr>
+        <tr>
+          <td :class="commonStyle">
+            {{ $t("torrent.timeActive") | titleCase }}
+          </td>
+          <td>
+            {{ torrent.time_active }}
+            <span v-if="torrent.seeding_time">{{ `(${$t("torrent.seededFor")} ${torrent.seeding_time})` }}</span>
+          </td>
+        </tr>
         <tr>
           <td :class="commonStyle">
             {{ $t('torrent.downloaded') | titleCase }}

src/lang/en.js

@@ -57,7 +57,9 @@ const locale = {
     created: 'created by',
     comments: 'comments',
     uploadedSession: 'Uploaded Session',
-    torrentTitle: 'Torrent Title'
+    torrentTitle: 'Torrent Title',
+    timeActive: 'Time Active',
+    seededFor: 'seeded for'
   },
   /** Navbar */
   navbar: {

src/models/Torrent.js

@@ -1,3 +1,8 @@
+import dayjs from 'dayjs'
+import duration from 'dayjs/plugin/duration'
+
+dayjs.extend(duration)
+
 export default class Torrent {
   constructor(data) {
     this.name = data.name
@@ -32,6 +37,8 @@ export default class Torrent {
     this.availability = Math.round(data.availability * 100) / 100
     this.forced = data.state.includes('forced')
     this.magnet = data.magnet_uri
+    this.time_active = dayjs.duration(data.time_active, 'seconds').format('D[d] H[h] m[m] s[s]')
+    this.seeding_time = data.seeding_time > 0 ? dayjs.duration(data.seeding_time, 'seconds').format('D[d] H[h] m[m] s[s]') : null
 
     Object.freeze(this)
   }