perf: Add missing fields in dashboard / sortOptions (#713) @Larsluph

src/components/Settings/Tabs/VueTorrent/VDesktopCard.vue

@@ -54,6 +54,7 @@
 import draggable from 'vuedraggable'
 import { mdiMenu } from '@mdi/js'
 import { i18n } from '@/plugins/i18n'
+import { mapState } from 'vuex'
 
 export default {
   name: 'VDesktopCard',
@@ -64,41 +65,23 @@ export default {
     mdiMenu
   }),
   computed: {
+    ...mapState(['webuiSettings']),
     busyDesktopTorrentProperties() {
-      return this.injectLocalization(this.$store.state.webuiSettings.busyDesktopTorrentProperties)
+      return this.injectLocalization(this.webuiSettings.busyDesktopTorrentProperties)
     },
     doneDesktopTorrentProperties() {
-      return this.injectLocalization(this.$store.state.webuiSettings.doneDesktopTorrentProperties)
+      return this.injectLocalization(this.webuiSettings.doneDesktopTorrentProperties)
     }
   },
   methods: {
     injectLocalization(properties) {
-      const localePrefix = 'modals.settings.pageVueTorrent.properties'
+      properties.forEach(property => {
-      const localeMap = {
+        // convert component name from PascalCase to snake_case to match locale key
-        Size: i18n.t(`${localePrefix}.size`),
+        const value = property.name
-        Progress: i18n.t(`${localePrefix}.progress`),
+            .replace(/\.?([A-Z]+)/g, (x, y) => "_" + y.toLowerCase())
-        Download: i18n.t(`${localePrefix}.downloadSpeed`),
+            .replace(/^_/, "")
-        Upload: i18n.t(`${localePrefix}.uploadSpeed`),
+        property.label = i18n.t(`torrent.properties.${value}`)
-        Downloaded: i18n.t(`${localePrefix}.downloaded`),
+      })
-        Directory: i18n.t(`${localePrefix}.save_path`),
-        Uploaded: i18n.t(`${localePrefix}.uploaded`),
-        ETA: i18n.t(`${localePrefix}.ETA`),
-        Peers: i18n.t(`${localePrefix}.peers`),
-        Seeds: i18n.t(`${localePrefix}.seeds`),
-        Status: i18n.t(`${localePrefix}.state`),
-        Ratio: i18n.t(`${localePrefix}.ratio`),
-        Tracker: i18n.t(`${localePrefix}.tracker`),
-        Category: i18n.t(`${localePrefix}.category`),
-        Tags: i18n.t(`${localePrefix}.tags`),
-        AddedOn: i18n.t(`${localePrefix}.addedOn`),
-        Availability: i18n.t(`${localePrefix}.availability`),
-        LastActivity: i18n.t(`${localePrefix}.last_activity`),
-        CompletedOn: i18n.t(`${localePrefix}.completion_on`),
-        GlobalSpeed: i18n.t(`${localePrefix}.globalSpeed`),
-        GlobalVolume: i18n.t(`${localePrefix}.globalVolume`)
-      }
-
-      properties.forEach(property => (property.label = localeMap[property.name]))
       return properties
     }
   }

src/components/Settings/Tabs/VueTorrent/VGeneral.vue

@@ -276,6 +276,7 @@ export default {
         const ajv = new Ajv()
         const validate = ajv.compile(StoreStateSchema)
         isValidJson = validate(userState)
+        console.error(validate.errors)
       } catch (e) {
         console.error(e)
         isValidJson = false

src/components/Settings/Tabs/VueTorrent/VMobileCard.vue

@@ -61,24 +61,12 @@ export default {
   },
   methods: {
     injectLocalization(properties) {
-      const localePrefix = 'modals.settings.pageVueTorrent.properties'
+      properties.forEach(property => {
-      const localeMap = {
+        const value = property.name
-        Size: i18n.t(`${localePrefix}.size`),
+            .replace(/\.?([A-Z]+)/g, (x, y) => "_" + y.toLowerCase())
-        Progress: i18n.t(`${localePrefix}.progress`),
+            .replace(/^_/, "")
-        Download: i18n.t(`${localePrefix}.downloadSpeed`),
+        property.label = i18n.t(`torrent.properties.${value}`)
-        Upload: i18n.t(`${localePrefix}.uploadSpeed`),
+      })
-        ETA: i18n.t(`${localePrefix}.ETA`),
-        Peers: i18n.t(`${localePrefix}.peers`),
-        Seeds: i18n.t(`${localePrefix}.seeds`),
-        Status: i18n.t(`${localePrefix}.state`),
-        Ratio: i18n.t(`${localePrefix}.ratio`),
-        Uploaded: i18n.t(`${localePrefix}.uploaded`),
-        Tracker: i18n.t(`${localePrefix}.tracker`),
-        Category: i18n.t(`${localePrefix}.category`),
-        Tags: i18n.t(`${localePrefix}.tags`)
-      }
-
-      properties.forEach(property => (property.label = localeMap[property.name]))
       return properties
     }
   }

src/components/Torrent/DashboardItems/AddedOn.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm2>
     <div class="caption grey--text">
-      {{ $t('torrent.added') | titleCase }}
+      {{ $t('torrent.properties.added_on') | titleCase }}
     </div>
     <div>{{ torrent.added_on }}</div>
   </v-flex>

src/components/Torrent/DashboardItems/AmountLeft.vue

@@ -0,0 +1,25 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.amount_left') | titleCase }}
+    </div>
+    <div>
+      {{ torrent.amount_left | getDataValue(2) }}
+      <span class="caption grey--text">
+        {{ torrent.amount_left | getDataUnit }}
+      </span>
+    </div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'AmountLeft',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/Availability.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('torrent.availability') | titleCase }}
+      {{ $t('torrent.properties.availability') | titleCase }}
     </div>
     <div>
       {{ availability }}

src/components/Torrent/DashboardItems/Category.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex v-if="torrent.category" xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('category') }}
+      {{ $t('torrent.properties.category') }}
     </div>
     <v-chip small class="upload white--text caption">
       {{ torrent.category }}

src/components/Torrent/DashboardItems/CompletedOn.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm2>
     <div class="caption grey--text">
-      {{ $t('torrent.completed_on') | titleCase }}
+      {{ $t('torrent.properties.completed_on') | titleCase }}
     </div>
     <div>{{ torrent.completed_on }}</div>
   </v-flex>

src/components/Torrent/DashboardItems/ContentPath.vue

@@ -0,0 +1,20 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.content_path') | titleCase }}
+    </div>
+    <div>{{ torrent.content_path }}</div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'ContentPath',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/DownloadLimit.vue

@@ -0,0 +1,23 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.download_limit') | titleCase }}
+    </div>
+    <div>
+      {{ torrent.dl_limit | getDataValue(1) }}
+      <span class="caption grey--text"> {{ torrent.dl_limit | getDataUnit }}/s </span>
+    </div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'DownloadLimit',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/DownloadPath.vue

@@ -0,0 +1,20 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.download_path') | titleCase }}
+    </div>
+    <div>{{ torrent.download_path }}</div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'DownloadPath',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/DownloadSpeed.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('download') }}
+      {{ $t('torrent.properties.download_speed') }}
     </div>
     <div>
       {{ torrent.dlspeed | getDataValue(1) }}
@@ -15,7 +15,7 @@ import { defineComponent } from 'vue'
 import { Torrent } from '@/models'
 
 export default defineComponent({
-  name: 'Download',
+  name: 'DownloadSpeed',
   props: {
     torrent: Torrent
   }

src/components/Torrent/DashboardItems/Downloaded.vue

@@ -1,12 +1,12 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('downloaded') }}
+      {{ $t('torrent.properties.downloaded') }}
     </div>
     <div>
-      {{ torrent.dloaded | getDataValue(2) }}
+      {{ torrent.downloaded | getDataValue(2) }}
       <span class="caption grey--text">
-        {{ torrent.dloaded | getDataUnit }}
+        {{ torrent.downloaded | getDataUnit }}
       </span>
     </div>
   </v-flex>

src/components/Torrent/DashboardItems/DownloadedSession.vue

@@ -0,0 +1,25 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.downloaded_session') | titleCase }}
+    </div>
+    <div>
+      {{ torrent.downloaded_session | getDataValue(2) }}
+      <span class="caption grey--text">
+        {{ torrent.downloaded_session | getDataUnit }}
+      </span>
+    </div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'DownloadedSession',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/ETA.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('ETA') }}
+      {{ $t('torrent.properties.eta') }}
     </div>
     <div>
       {{ torrent.eta }}

src/components/Torrent/DashboardItems/GlobalSpeed.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('globalSpeed') }}
+      {{ $t('torrent.properties.global_speed') }}
     </div>
     <div>
       {{ torrent.globalSpeed | getDataValue(1) }}

src/components/Torrent/DashboardItems/GlobalVolume.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('globalVolume') }}
+      {{ $t('torrent.properties.global_volume') }}
     </div>
     <div>
       {{ torrent.globalVolume | getDataValue }}

src/components/Torrent/DashboardItems/Hash.vue

@@ -0,0 +1,20 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.hash') | titleCase }}
+    </div>
+    <div>{{ torrent.hash }}</div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'Hash',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/InfoHashV1.vue

@@ -0,0 +1,20 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.info_hash_v1') | titleCase }}
+    </div>
+    <div>{{ torrent.infohash_v1 }}</div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'InfoHashV1',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/InfoHashV2.vue

@@ -0,0 +1,20 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.info_hash_v2') | titleCase }}
+    </div>
+    <div>{{ torrent.infohash_v2 }}</div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'InfoHashV2',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/LastActivity.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm1>
     <div class="caption grey--text">
-      {{ $t('torrent.last_activity') | titleCase }}
+      {{ $t('torrent.properties.last_activity') | titleCase }}
     </div>
     <div>{{ torrent.last_activity }}</div>
   </v-flex>

src/components/Torrent/DashboardItems/Peers.vue

@@ -1,11 +1,11 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('peers') }}
+      {{ $t('torrent.properties.peers') }}
     </div>
     <div>
       {{ torrent.num_leechs }}
-      <span class="grey--text caption"> /{{ torrent.available_peers }} </span>
+      <span class="grey--text caption"> / {{ torrent.available_peers }} </span>
     </div>
   </v-flex>
 </template>
@@ -15,7 +15,7 @@ import { defineComponent } from 'vue'
 import { Torrent } from '@/models'
 
 export default defineComponent({
-  name: 'DashboardPeers',
+  name: 'Peers',
   props: {
     torrent: Torrent
   }

src/components/Torrent/DashboardItems/Progress.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs12 sm1 md1 class="mr-4">
     <div class="caption grey--text">
-      {{ $t('torrent.progress') | titleCase }}
+      {{ $t('torrent.properties.progress') | titleCase }}
     </div>
     <v-progress-linear :value="torrent.progress" height="20" :style="phoneLayout ? '' : 'width: 80%;'" :color="`torrent-${state}`" rounded>
       <span class="caption white--text"> {{ torrent.progress }}% </span>

src/components/Torrent/DashboardItems/Ratio.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('ratio') }}
+      {{ $t('torrent.properties.ratio') }}
     </div>
     <div>{{ torrent.ratio }}</div>
   </v-flex>

src/components/Torrent/DashboardItems/SavePath.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 md2 sm1>
     <div class="caption grey--text">
-      {{ $t('torrent.directory') | titleCase }}
+      {{ $t('torrent.properties.save_path') | titleCase }}
     </div>
     <div class="truncate" :title="torrent.savePath">
       {{ torrent.savePath }}
@@ -14,7 +14,7 @@ import { defineComponent } from 'vue'
 import { Torrent } from '@/models'
 
 export default defineComponent({
-  name: 'Directory',
+  name: 'SavePath',
   props: {
     torrent: Torrent
   }

src/components/Torrent/DashboardItems/Seeds.vue

@@ -1,11 +1,11 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('seeds') }}
+      {{ $t('torrent.properties.seeds') }}
     </div>
     <div>
       {{ torrent.num_seeds }}
-      <span class="grey--text caption"> /{{ torrent.available_seeds }} </span>
+      <span class="grey--text caption"> / {{ torrent.available_seeds }} </span>
     </div>
   </v-flex>
 </template>

src/components/Torrent/DashboardItems/SeenComplete.vue

@@ -0,0 +1,20 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.seen_complete') | titleCase }}
+    </div>
+    <div>{{ torrent.seen_complete }}</div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'SeenComplete',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/Size.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('torrent.size') | titleCase }}
+      {{ $t('torrent.properties.size') | titleCase }}
     </div>
     <div>
       {{ torrent.size | getDataValue }}

src/components/Torrent/DashboardItems/Status.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('status') }}
+      {{ $t('torrent.properties.status') }}
     </div>
     <v-chip style="height: 1.3em" class="caption white--text px-2" :class="state">
       {{ stateString }}

src/components/Torrent/DashboardItems/Tags.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex v-if="torrent.tags && torrent.tags.length" xs6 sm2>
     <div class="caption grey--text">
-      {{ $t('tags') }}
+      {{ $t('torrent.properties.tags') }}
     </div>
     <v-row wrap class="ma-0">
       <v-chip v-for="tag in torrent.tags" :key="tag" small class="tags white--text caption mb-1 mx-1">

src/components/Torrent/DashboardItems/TimeActive.vue

@@ -0,0 +1,20 @@
+<template>
+  <v-flex xs6 sm2 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.time_active') | titleCase }}
+    </div>
+    <div>{{ torrent.time_active }}</div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'TimeActive',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/TotalSize.vue

@@ -0,0 +1,25 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.total_size') | titleCase }}
+    </div>
+    <div>
+      {{ torrent.total_size | getDataValue }}
+      <span class="caption grey--text">
+        {{ torrent.total_size | getDataUnit }}
+      </span>
+    </div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'TotalSize',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/Tracker.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex v-if="torrent.tracker" xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('tracker') }}
+      {{ $t('torrent.properties.tracker') }}
     </div>
     <v-chip small class="moving white--text caption">
       {{ trackerString }}
@@ -23,7 +23,7 @@ export default defineComponent({
   },
   computed: {
     trackerString() {
-      return getDomainBody(this.torrent.tracker)
+      return getDomainBody(this.torrent?.tracker)
     }
   }
 })

src/components/Torrent/DashboardItems/TrackersCount.vue

@@ -0,0 +1,20 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.trackers_count') | titleCase }}
+    </div>
+    <div>{{ torrent.trackers_count }}</div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'TrackersCount',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/UploadLimit.vue

@@ -0,0 +1,23 @@
+<template>
+  <v-flex xs6 sm1 md1>
+    <div class="caption grey--text">
+      {{ $t('torrent.properties.upload_limit') }}
+    </div>
+    <div>
+      {{ torrent.up_limit | getDataValue(1) }}
+      <span class="caption grey--text"> {{ torrent.up_limit | getDataUnit(1) }}/s </span>
+    </div>
+  </v-flex>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { Torrent } from '@/models'
+
+export default defineComponent({
+  name: 'UploadLimit',
+  props: {
+    torrent: Torrent
+  }
+})
+</script>

src/components/Torrent/DashboardItems/UploadSpeed.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('upload') }}
+      {{ $t('torrent.properties.upload_speed') }}
     </div>
     <div>
       {{ torrent.upspeed | getDataValue(1) }}
@@ -15,7 +15,7 @@ import { defineComponent } from 'vue'
 import { Torrent } from '@/models'
 
 export default defineComponent({
-  name: 'Upload',
+  name: 'UploadSpeed',
   props: {
     torrent: Torrent
   }

src/components/Torrent/DashboardItems/Uploaded.vue

@@ -1,7 +1,7 @@
 <template>
   <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('uploaded') }}
+      {{ $t('torrent.properties.uploaded') }}
     </div>
     <div>
       {{ torrent.uploaded | getDataValue }}

src/components/Torrent/DashboardItems/UploadedSession.vue

@@ -1,7 +1,7 @@
 <template>
-  <v-flex xs6 sm2 md2>
+  <v-flex xs6 sm1 md1>
     <div class="caption grey--text">
-      {{ $t('torrent.uploadedSession') }}
+      {{ $t('torrent.properties.uploaded_session') | titleCase }}
     </div>
     <div>
       {{ torrent.uploaded_session | getDataValue }}

src/components/Torrent/DashboardItems/index.ts

@@ -1,47 +1,73 @@
-import Size from './Size.vue'
-import Progress from './Progress.vue'
-import Download from './Download.vue'
-import Downloaded from './Downloaded.vue'
-import Directory from './Directory.vue'
-import Ratio from './Ratio.vue'
-import Upload from './Upload.vue'
-import ETA from './ETA.vue'
-import Peers from './Peers.vue'
-import Seeds from './Seeds.vue'
-import Status from './Status.vue'
-import Tracker from './Tracker.vue'
-import Category from './Category.vue'
-import Tags from './Tags.vue'
 import AddedOn from './AddedOn.vue'
-import Uploaded from './Uploaded.vue'
+import AmountLeft from './AmountLeft.vue'
-import UploadedSession from './UploadedSession.vue'
 import Availability from './Availability.vue'
-import LastActivity from './LastActivity.vue'
+import Category from './Category.vue'
 import CompletedOn from './CompletedOn.vue'
+import ContentPath from './ContentPath.vue'
+import DownloadLimit from './DownloadLimit.vue'
+import DownloadPath from './DownloadPath.vue'
+import DownloadSpeed from './DownloadSpeed.vue'
+import Downloaded from './Downloaded.vue'
+import DownloadedSession from './DownloadedSession.vue'
+import ETA from './ETA.vue'
 import GlobalSpeed from './GlobalSpeed.vue'
 import GlobalVolume from './GlobalVolume.vue'
+import Hash from './Hash.vue'
+import InfoHashV1 from './InfoHashV1.vue'
+import InfoHashV2 from './InfoHashV2.vue'
+import LastActivity from './LastActivity.vue'
+import Peers from './Peers.vue'
+import Progress from './Progress.vue'
+import Ratio from './Ratio.vue'
+import SavePath from './SavePath.vue'
+import Seeds from './Seeds.vue'
+import SeenComplete from './SeenComplete.vue'
+import Size from './Size.vue'
+import Status from './Status.vue'
+import Tags from './Tags.vue'
+import TimeActive from './TimeActive.vue'
+import TotalSize from './TotalSize.vue'
+import Tracker from './Tracker.vue'
+import TrackersCount from './TrackersCount.vue'
+import UploadLimit from './UploadLimit.vue'
+import UploadSpeed from './UploadSpeed.vue'
+import Uploaded from './Uploaded.vue'
+import UploadedSession from './UploadedSession.vue'
 
 export {
-  Size,
-  CompletedOn,
-  LastActivity,
-  Progress,
-  Download,
-  Directory,
-  Ratio,
-  Upload,
-  ETA,
-  Peers,
-  Seeds,
-  Status,
-  Tracker,
-  Category,
-  Tags,
   AddedOn,
-  Uploaded,
+  AmountLeft,
-  UploadedSession,
-  Downloaded,
   Availability,
+  Category,
+  CompletedOn,
+  ContentPath,
+  DownloadLimit,
+  DownloadPath,
+  DownloadSpeed,
+  Downloaded,
+  DownloadedSession,
+  ETA,
   GlobalSpeed,
-  GlobalVolume
+  GlobalVolume,
+  Hash,
+  InfoHashV1,
+  InfoHashV2,
+  LastActivity,
+  Peers,
+  Progress,
+  Ratio,
+  SavePath,
+  Seeds,
+  SeenComplete,
+  Size,
+  Status,
+  Tags,
+  TimeActive,
+  TotalSize,
+  Tracker,
+  TrackersCount,
+  UploadLimit,
+  UploadSpeed,
+  Uploaded,
+  UploadedSession
 }

src/components/Torrent/MobileCard.vue

@@ -22,8 +22,8 @@
     <v-flex xs12 class="pa-0 ma-1 row spangap">
       <span v-if="isSizeActive">
         <span class="downloaded">
-          <span class="body-2">{{ torrent.dloaded | getDataValue }} </span>
+          <span class="body-2">{{ torrent.downloaded | getDataValue }} </span>
-          <span class="grey--text caption">{{ torrent.dloaded | getDataUnit }}</span>
+          <span class="grey--text caption">{{ torrent.downloaded | getDataUnit }}</span>
         </span>
         <span class="grey--text caption">/</span>
         <span class="size">
@@ -58,14 +58,14 @@
       <div v-if="isPeersActive" class="caption grey--text">{{ torrent.num_leechs }}/{{ torrent.available_peers }} peers</div>
       <v-spacer />
       <div>
-        <span v-if="isDownloadActive && torrent.dlspeed">
+        <span v-if="isDownloadSpeedActive && torrent.dlspeed">
           <v-icon small class="grey--text">
             {{ mdiChevronDown }}
           </v-icon>
           <span class="caption font-weight-medium grey--text">{{ torrent.dlspeed | getDataValue(1) }} </span>
           <span class="caption grey--text" style="font-size: 0.6em !important"> {{ torrent.dlspeed | getDataUnit }}/s </span>
         </span>
-        <span v-if="isUploadActive && torrent.upspeed">
+        <span v-if="isUploadSpeedActive && torrent.upspeed">
           <v-icon small class="grey--text">
             {{ mdiChevronUp }}
           </v-icon>
@@ -141,11 +141,11 @@ export default {
     isPeersActive() {
       return this.properties.find(e => e.name === DashboardProperty.PEERS).active
     },
-    isDownloadActive() {
+    isDownloadSpeedActive() {
-      return this.properties.find(e => e.name === DashboardProperty.DOWNLOAD).active
+      return this.properties.find(e => e.name === DashboardProperty.DOWNLOAD_SPEED).active
     },
-    isUploadActive() {
+    isUploadSpeedActive() {
-      return this.properties.find(e => e.name === DashboardProperty.UPLOAD).active
+      return this.properties.find(e => e.name === DashboardProperty.UPLOAD_SPEED).active
     }
   }
 }

src/components/TorrentDetail/Tabs/Info.vue

@@ -58,8 +58,8 @@
             {{ $t('torrent.downloaded') | titleCase }}
           </td>
           <td>
-            {{ torrent.dloaded | getDataValue }}
+            {{ torrent.downloaded | getDataValue }}
-            {{ torrent.dloaded | getDataUnit(1) }}
+            {{ torrent.downloaded | getDataUnit(1) }}
           </td>
         </tr>
         <tr>

src/enums/vuetorrent/DashboardProperty.ts

@@ -1,23 +1,37 @@
 export enum DashboardProperty {
-  SIZE = 'Size',
-  PROGRESS = 'Progress',
-  DOWNLOAD = 'Download',
-  UPLOAD = 'Upload',
-  DOWNLOADED = 'Downloaded',
-  DIRECTORY = 'Directory',
-  UPLOADED = 'Uploaded',
-  ETA = 'ETA',
-  PEERS = 'Peers',
-  SEEDS = 'Seeds',
-  STATUS = 'Status',
-  RATIO = 'Ratio',
-  TRACKER = 'Tracker',
-  CATEGORY = 'Category',
-  TAGS = 'Tags',
   ADDED_ON = 'AddedOn',
+  AMOUNT_LEFT = 'AmountLeft',
   AVAILABILITY = 'Availability',
-  LAST_ACTIVITY = 'LastActivity',
+  CATEGORY = 'Category',
   COMPLETED_ON = 'CompletedOn',
+  CONTENT_PATH = 'ContentPath',
+  DOWNLOAD_SPEED = 'DownloadSpeed',
+  DOWNLOADED = 'Downloaded',
+  DOWNLOADED_SESSION = 'DownloadedSession',
+  DOWNLOAD_LIMIT = 'DownloadLimit',
+  DOWNLOAD_PATH = 'DownloadPath',
+  ETA = 'ETA',
   GLOBAL_SPEED = 'GlobalSpeed',
-  GLOBAL_VOLUME = 'GlobalVolume'
+  GLOBAL_VOLUME = 'GlobalVolume',
+  HASH = 'Hash',
+  INFOHASH_V1 = 'InfoHashV1',
+  INFOHASH_V2 = 'InfoHashV2',
+  LAST_ACTIVITY = 'LastActivity',
+  PEERS = 'Peers',
+  PROGRESS = 'Progress',
+  RATIO = 'Ratio',
+  SAVE_PATH = 'SavePath',
+  SEEDS = 'Seeds',
+  SEEN_COMPLETE = 'SeenComplete',
+  SIZE = 'Size',
+  STATUS = 'Status',
+  TAGS = 'Tags',
+  TIME_ACTIVE = 'TimeActive',
+  TOTAL_SIZE = 'TotalSize',
+  TRACKER = 'Tracker',
+  TRACKERS_COUND = 'TrackersCount',
+  UPLOAD_LIMIT = 'UploadLimit',
+  UPLOAD_SPEED = 'UploadSpeed',
+  UPLOADED = 'Uploaded',
+  UPLOADED_SESSION = 'UploadedSession'
 }

src/lang/en.json

@@ -59,9 +59,48 @@
       "selectAll": "Select All",
       "selectAllCaption": "Select / Release All (Ctrl + A)"
     },
-    "emptyTorrentList": "Nothing to see here!"
+    "emptyTorrentList": "Nothing to see here!",
+    "not_complete": "Not Yet Completed"
   },
   "torrent": {
+    "properties": {
+      "added_on": "Added On",
+      "amount_left": "Amount Left",
+      "availability": "Availability",
+      "category": "Category",
+      "completed_on": "Completed On",
+      "content_path": "Content Path",
+      "download_limit": "Download Limit",
+      "download_speed": "Download Speed",
+      "downloaded": "Downloaded (global)",
+      "downloaded_session": "Downloaded (session)",
+      "download_path": "Download Path",
+      "eta": "ETA",
+      "global_speed": "Global Speed",
+      "global_volume": "Global Volume",
+      "hash": "Hash",
+      "info_hash_v1": "Infohash v1",
+      "info_hash_v2": "Infohash v2",
+      "last_activity": "Last Activity",
+      "peers": "Peers",
+      "priority": "Priority",
+      "progress": "Progress",
+      "ratio": "Ratio",
+      "save_path": "Save Path",
+      "seeds": "Seeds",
+      "seen_complete": "Seen Complete",
+      "size": "Size",
+      "status": "Status",
+      "tags": "Tags",
+      "time_active": "Time Active",
+      "total_size": "Total Size",
+      "tracker": "Tracker",
+      "trackers_count": "Trackers Count",
+      "upload_limit": "Upload Limit",
+      "upload_speed": "Upload Speed",
+      "uploaded": "Uploaded (global)",
+      "uploaded_session": "Uploaded (session)"
+    },
     "title": "Title",
     "added": "Added On",
     "availability": "Availability",
@@ -464,30 +503,58 @@
       "title": "Sort Torrents",
       "reverse": "Reverse",
       "sortBy": {
+        "default": "Default",
+        "added_on": "Added On",
+        "amount_left": "Amount Left",
+        "auto_tmm": "Auto TMM",
         "availability": "Availability",
         "category": "Category",
         "completed": "Completed",
         "completion_on": "Completed On",
-        "downloaded": "Downloaded",
+        "content_path": "Content Path",
-        "ETA": "ETA",
+        "dl_limit": "Download Limit",
-        "name": "Name",
+        "dlspeed": "Download Speed",
-        "default": "Default",
+        "download_path": "Download Path",
+        "downloaded": "Downloaded (Global)",
+        "downloaded_session": "Downloaded (Session)",
+        "eta": "ETA",
+        "f_l_piece_prio": "First / Last Piece Priority",
+        "force_start": "Force Start",
+        "globalSpeed": "Global Speed",
+        "globalVolume": "Global Volume",
+        "hash": "Hash",
+        "infohash_v1": "Infohash v1",
+        "infohash_v2": "Infohash v2",
         "last_activity": "Last Activity",
-        "peers": "Peers",
+        "magnet_uri": "Magnet URI",
+        "max_ratio": "Max Ratio",
+        "max_seeding_time": "Max Seeding Time",
+        "name": "Name",
+        "num_complete": "Seeds (swarm)",
+        "num_incomplete": "Peers (swarm)",
+        "num_leechs": "Peers (connected)",
+        "num_seeds": "Seeds (connected)",
         "priority": "Priority",
         "progress": "Progress",
         "ratio": "Ratio",
-        "save_path": "Directory",
+        "ratio_limit": "Ratio Limit",
-        "seeds": "Seeds",
+        "save_path": "Save Path",
+        "seeding_time": "Seeding Time",
+        "seeding_time_limit": "Seeding Time Limit",
+        "seen_complete": "Seen Complete",
+        "seq_dl": "Sequential Download",
         "size": "Size",
         "state": "State",
-        "uploaded": "Uploaded",
+        "super_seeding": "Super Seeding",
-        "addedOn": "Added On",
+        "tags": "Tags",
-        "downloadSpeed": "Download Speed",
+        "time_active": "Time Active",
-        "timeActive": "Time Active",
+        "total_size": "Total Size",
-        "uploadSpeed": "Upload Speed",
+        "tracker": "Tracker",
-        "globalSpeed": "Global Speed",
+        "trackers_count": "Trackers Count",
-        "globalVolume": "Global Volume"
+        "up_limit": "Upload Limit",
+        "uploaded": "Uploaded (Global)",
+        "uploaded_session": "Uploaded (Session)",
+        "upspeed": "Upload Speed"
       }
     },
     "speedLimit": {
@@ -516,7 +583,7 @@
     "pasteNotSupported": "Unable to paste, context isn't secured",
     "shutdownSuccess": "qBittorrent was shutdown successfully!",
     "shutdownError": "Unable to shutdown app. Make sure qBittorrent is running!",
-    "invalidJson": "Invalid JSON!"
+    "invalidJson": "Invalid JSON! Check console for details"
   },
   "rightClick": {
     "resume": "resume",

src/models/Torrent.ts

@@ -1,9 +1,10 @@
 import dayjs from 'dayjs'
 import duration from 'dayjs/plugin/duration'
 import relativeTime from 'dayjs/plugin/relativeTime'
-import { TorrentState as QbitTorrentState } from '@/enums/qbit'
+import {Priority, TorrentState as QbitTorrentState} from '@/enums/qbit'
 import { TorrentState as VtTorrentState } from '@/enums/vuetorrent'
 import type { Torrent as QbitTorrent } from '@/types/qbit/models'
+import i18n from "@/plugins/i18n";
 
 dayjs.extend(duration)
 dayjs.extend(relativeTime)
@@ -13,88 +14,112 @@ const durationFormat = 'D[d] H[h] m[m] s[s]'
 export default class Torrent {
   static computedValues = ['globalSpeed', 'globalVolume']
 
-  name: string
-  size: number
   added_on: string
+  amount_left: number
+  auto_tmm: boolean
+  availability: number
+  available_peers: number
+  available_seeds: number
+  category: string
   completed_on: string
+  content_path: string
+  dl_limit: number
   dlspeed: number
-  dloaded: number
+  download_path: string
-  upspeed: number
+  downloaded: number
-  uploaded: number
+  downloaded_session : number
-  uploaded_session: number
   eta: string
+  f_l_piece_prio: boolean
+  forced: boolean
+  hash: string
+  infohash_v1: string
+  infohash_v2: string
+  last_activity: string
+  magnet: string
+  name: string
   num_leechs: number
   num_seeds: number
-  state: VtTorrentState
+  priority: Priority
-  hash: string
-  available_seeds: number
-  available_peers: number
-  savePath: string
   progress: number
   ratio: number
-  tags: string[] | null
-  category: string
-  tracker: string
-  f_l_piece_prio: boolean
-  seq_dl: boolean
-  auto_tmm: boolean
-  dl_limit: number
-  up_limit: number
   ratio_limit: number
   ratio_time_limit: number
-  availability: number
+  savePath: string
-  forced: boolean
-  magnet: string
-  time_active: string
   seeding_time: string | null
-  last_activity: string
+  seen_complete: string
+  seq_dl: boolean
+  size: number
+  state: VtTorrentState
+  super_seeding: boolean
+  tags: string[] | null
+  time_active: string
+  total_size: number
+  tracker: string
+  trackers_count: number
+  up_limit: number
+  uploaded: number
+  uploaded_session: number
+  upspeed: number
   globalSpeed: number
   globalVolume: number
   constructor(data: QbitTorrent, format = 'DD/MM/YYYY, HH:mm:ss') {
-    this.name = data.name
-    this.size = data.size
     this.added_on = dayjs(data.added_on * 1000).format(format)
-    this.completed_on = dayjs(data.completion_on * 1000).format(format)
+    this.amount_left = data.amount_left
+    this.auto_tmm = data.auto_tmm
+    this.availability = Math.round(data.availability * 100) / 100
+    this.available_peers = data.num_incomplete
+    this.available_seeds = data.num_complete
+    this.category = data.category
+    this.completed_on = data.completion_on > 0
+        ? dayjs(data.completion_on * 1000).format(format)
+        : i18n.t('dashboard.not_complete').toString()
+    this.content_path = data.content_path
+    this.dl_limit = data.dl_limit
     this.dlspeed = data.dlspeed
-    this.dloaded = data.completed
+    this.download_path = data.download_path
-    this.upspeed = data.upspeed
+    this.downloaded = data.downloaded
-    this.uploaded = data.uploaded
+    this.downloaded_session = data.downloaded_session
-    this.uploaded_session = data.uploaded_session
     this.eta = this.formatEta(data.eta)
+    this.f_l_piece_prio = data.f_l_piece_prio
+    this.forced = data.force_start
+    this.hash = data.hash
+    this.infohash_v1 = data.infohash_v1
+    this.infohash_v2 = data.infohash_v2
+    this.last_activity = dayjs(data.last_activity * 1000).fromNow()
+    this.magnet = data.magnet_uri
+    this.name = data.name
     this.num_leechs = data.num_leechs
     this.num_seeds = data.num_seeds
-    this.state = this.formatState(data.state)
+    this.priority = data.priority
-    this.hash = data.hash
-    this.available_seeds = data.num_complete
-    this.available_peers = data.num_incomplete
-    this.savePath = data.save_path
     this.progress = Math.round(data.progress * 10000) / 100
     this.ratio = Math.round(data.ratio * 100) / 100
-    this.tags = data.tags.length > 0 ? data.tags.split(', ').map(t => t.trim()) : null
-    this.category = data.category
-    this.tracker = data.tracker
-    this.f_l_piece_prio = data.f_l_piece_prio
-    this.seq_dl = data.seq_dl
-    this.auto_tmm = data.auto_tmm
-    this.dl_limit = data.dl_limit
-    this.up_limit = data.up_limit
     this.ratio_limit = data.max_ratio
     this.ratio_time_limit = data.max_seeding_time
-    this.availability = Math.round(data.availability * 100) / 100
+    this.savePath = data.save_path
-    this.forced = data.state.includes('forced')
-    this.magnet = data.magnet_uri
-    this.time_active = dayjs.duration(data.time_active, 'seconds').format(durationFormat)
     this.seeding_time = data.seeding_time > 0 ? dayjs.duration(data.seeding_time, 'seconds').format(durationFormat) : null
-    this.last_activity = dayjs(data.last_activity * 1000).fromNow()
+    this.seen_complete = dayjs(data.seen_complete * 1000).format(format)
+    this.seq_dl = data.seq_dl
+    this.size = data.size
+    this.state = this.formatState(data.state)
+    this.super_seeding = data.super_seeding
+    this.tags = data.tags.length > 0 ? data.tags.split(', ').map(t => t.trim()) : null
+    this.time_active = dayjs.duration(data.time_active, 'seconds').format(durationFormat)
+    this.total_size = data.total_size
+    this.tracker = data.tracker
+    this.trackers_count = data.trackers_count
+    this.up_limit = data.up_limit
+    this.uploaded = data.uploaded
+    this.uploaded_session = data.uploaded_session
+    this.upspeed = data.upspeed
 
     // computed values
     this.globalSpeed = this.dlspeed + this.upspeed
-    this.globalVolume = this.dloaded + this.uploaded
+    this.globalVolume = this.downloaded + this.uploaded
 
     Object.freeze(this)
   }
 
-  formatState(state: QbitTorrentState): VtTorrentState {
+  private formatState(state: QbitTorrentState): VtTorrentState {
     switch (state) {
       case QbitTorrentState.FORCED_DL:
       case QbitTorrentState.DOWNLOADING:
@@ -130,7 +155,7 @@ export default class Torrent {
     }
   }
 
-  formatEta(value: number): string {
+  private formatEta(value: number): string {
     const options = { dayLimit: 100 }
     const minute = 60
     const hour = minute * 60

src/schemas/StoreState.ts

@@ -80,35 +80,49 @@ export const StoreStateSchema: JSONSchemaType<PersistentStoreState> = {
       $id: '/schemas/desktopDashboardProperties',
       type: 'array',
       uniqueItems: true,
-      minItems: 21,
+      minItems: 35,
-      maxItems: 21,
+      maxItems: 35,
       items: {
         type: 'object',
         properties: {
           name: {
             type: 'string',
             enum: [
-              DashboardProperty.SIZE,
-              DashboardProperty.PROGRESS,
-              DashboardProperty.DOWNLOAD,
-              DashboardProperty.UPLOAD,
-              DashboardProperty.DOWNLOADED,
-              DashboardProperty.DIRECTORY,
-              DashboardProperty.UPLOADED,
-              DashboardProperty.ETA,
-              DashboardProperty.PEERS,
-              DashboardProperty.SEEDS,
-              DashboardProperty.STATUS,
-              DashboardProperty.RATIO,
-              DashboardProperty.TRACKER,
-              DashboardProperty.CATEGORY,
-              DashboardProperty.TAGS,
               DashboardProperty.ADDED_ON,
+              DashboardProperty.AMOUNT_LEFT,
               DashboardProperty.AVAILABILITY,
-              DashboardProperty.LAST_ACTIVITY,
+              DashboardProperty.CATEGORY,
               DashboardProperty.COMPLETED_ON,
+              DashboardProperty.CONTENT_PATH,
+              DashboardProperty.DOWNLOAD_SPEED,
+              DashboardProperty.DOWNLOADED,
+              DashboardProperty.DOWNLOADED_SESSION,
+              DashboardProperty.DOWNLOAD_LIMIT,
+              DashboardProperty.DOWNLOAD_PATH,
+              DashboardProperty.ETA,
               DashboardProperty.GLOBAL_SPEED,
-              DashboardProperty.GLOBAL_VOLUME
+              DashboardProperty.GLOBAL_VOLUME,
+              DashboardProperty.HASH,
+              DashboardProperty.INFOHASH_V1,
+              DashboardProperty.INFOHASH_V2,
+              DashboardProperty.LAST_ACTIVITY,
+              DashboardProperty.PEERS,
+              DashboardProperty.PROGRESS,
+              DashboardProperty.RATIO,
+              DashboardProperty.SAVE_PATH,
+              DashboardProperty.SEEDS,
+              DashboardProperty.SEEN_COMPLETE,
+              DashboardProperty.SIZE,
+              DashboardProperty.STATUS,
+              DashboardProperty.TAGS,
+              DashboardProperty.TIME_ACTIVE,
+              DashboardProperty.TOTAL_SIZE,
+              DashboardProperty.TRACKER,
+              DashboardProperty.TRACKERS_COUND,
+              DashboardProperty.UPLOAD_LIMIT,
+              DashboardProperty.UPLOAD_SPEED,
+              DashboardProperty.UPLOADED,
+              DashboardProperty.UPLOADED_SESSION
             ]
           },
           active: { type: 'boolean' }
@@ -130,8 +144,8 @@ export const StoreStateSchema: JSONSchemaType<PersistentStoreState> = {
             enum: [
               DashboardProperty.SIZE,
               DashboardProperty.PROGRESS,
-              DashboardProperty.DOWNLOAD,
+              DashboardProperty.DOWNLOAD_SPEED,
-              DashboardProperty.UPLOAD,
+              DashboardProperty.UPLOAD_SPEED,
               DashboardProperty.ETA,
               DashboardProperty.PEERS,
               DashboardProperty.SEEDS,

src/store/index.ts

@@ -25,10 +25,10 @@ Vue.use(Vuex)
 const desktopPropertiesTemplate = [
   { name: DashboardProperty.SIZE, active: true },
   { name: DashboardProperty.PROGRESS, active: true },
-  { name: DashboardProperty.DOWNLOAD, active: true },
+  { name: DashboardProperty.DOWNLOAD_SPEED, active: true },
-  { name: DashboardProperty.UPLOAD, active: true },
+  { name: DashboardProperty.UPLOAD_SPEED, active: true },
   { name: DashboardProperty.DOWNLOADED, active: true },
-  { name: DashboardProperty.DIRECTORY, active: false },
+  { name: DashboardProperty.SAVE_PATH, active: false },
   { name: DashboardProperty.UPLOADED, active: true },
   { name: DashboardProperty.ETA, active: true },
   { name: DashboardProperty.PEERS, active: true },
@@ -42,6 +42,20 @@ const desktopPropertiesTemplate = [
   { name: DashboardProperty.AVAILABILITY, active: true },
   { name: DashboardProperty.LAST_ACTIVITY, active: false },
   { name: DashboardProperty.COMPLETED_ON, active: false },
+  { name: DashboardProperty.AMOUNT_LEFT, active: false },
+  { name: DashboardProperty.CONTENT_PATH, active: false },
+  { name: DashboardProperty.DOWNLOADED_SESSION, active: false },
+  { name: DashboardProperty.DOWNLOAD_LIMIT, active: false },
+  { name: DashboardProperty.DOWNLOAD_PATH, active: false },
+  { name: DashboardProperty.HASH, active: false },
+  { name: DashboardProperty.INFOHASH_V1, active: false },
+  { name: DashboardProperty.INFOHASH_V2, active: false },
+  { name: DashboardProperty.SEEN_COMPLETE, active: false },
+  { name: DashboardProperty.TIME_ACTIVE, active: false },
+  { name: DashboardProperty.TOTAL_SIZE, active: false },
+  { name: DashboardProperty.TRACKERS_COUND, active: false },
+  { name: DashboardProperty.UPLOADED_SESSION, active: false },
+  { name: DashboardProperty.UPLOAD_LIMIT, active: false },
   { name: DashboardProperty.GLOBAL_SPEED, active: false },
   { name: DashboardProperty.GLOBAL_VOLUME, active: false }
 ]
@@ -58,8 +72,8 @@ const mobilePropertiesTemplate = [
   { name: DashboardProperty.ETA, active: true },
   { name: DashboardProperty.SEEDS, active: true },
   { name: DashboardProperty.PEERS, active: true },
-  { name: DashboardProperty.DOWNLOAD, active: true },
+  { name: DashboardProperty.DOWNLOAD_SPEED, active: true },
-  { name: DashboardProperty.UPLOAD, active: true }
+  { name: DashboardProperty.UPLOAD_SPEED, active: true }
 ]
 
 export default new Vuex.Store<StoreState>({

src/types/qbit/models/Torrent.ts

@@ -1,92 +1,103 @@
 import type { TorrentState } from '@/enums/qbit'
+import {Priority} from "@/enums/qbit";
 
 export default interface Torrent {
-  // Time (Unix Epoch) when the torrent was added to the client
+  /** Time (Unix Epoch) when the torrent was added to the client */
   added_on: number
-  // Amount of data left to download (bytes)
+  /** Amount of data left to download (bytes) */
   amount_left: number
-  // Whether this torrent is managed by Automatic Torrent Management
+  /** Whether this torrent is managed by Automatic Torrent Management */
   auto_tmm: boolean
-  // Percentage of file pieces currently available
+  /** Percentage of file pieces currently available */
   availability: number
-  // Category of the torrent
+  /** Category of the torrent */
   category: string
-  // Amount of transfer data completed (bytes)
+  /** Amount of transfer data completed (bytes) */
   completed: number
-  // Time (Unix Epoch) when the torrent completed
+  /** Time (Unix Epoch) when the torrent completed */
   completion_on: number
-  // Absolute path of torrent content (root path for multifile torrents, absolute file path for singlefile torrents)
+  /** Absolute path of torrent content (root path for multifile torrents, absolute file path for singlefile torrents) */
   content_path: string
-  // Torrent download speed limit (bytes/s). -1 if ulimited.
+  /** Torrent download speed limit (bytes/s). -1 if unlimited. */
   dl_limit: number
-  // Torrent download speed (bytes/s)
+  /** Torrent download speed (bytes/s) */
   dlspeed: number
-  // Amount of data downloaded
+  /** TODO */
+  download_path: string
+  /** Amount of data downloaded */
   downloaded: number
-  // Amount of data downloaded this session
+  /** Amount of data downloaded this session */
   downloaded_session: number
-  // Torrent ETA (seconds)
+  /** Torrent ETA (seconds) */
   eta: number
-  // True if first last piece are prioritized
+  /** True if first last piece are prioritized */
   f_l_piece_prio: boolean
-  // True if force start is enabled for this torrent
+  /** True if force start is enabled for this torrent */
   force_start: boolean
-  // Torrent hash
+  /** Torrent hash */
   hash: string
-  // Last time (Unix Epoch) when a chunk was downloaded/uploaded
+  /** TODO */
+  infohash_v1: string
+  /** TODO */
+  infohash_v2: string
+  /** Last time (Unix Epoch) when a chunk was downloaded/uploaded */
   last_activity: number
-  // Magnet URI corresponding to this torrent
+  /** Magnet URI corresponding to this torrent */
   magnet_uri: string
-  // Maximum share ratio until torrent is stopped from seeding/uploading
+  /** Maximum share ratio until torrent is stopped from seeding/uploading */
   max_ratio: number
-  // Maximum seeding time (seconds) until torrent is stopped from seeding
+  /** Maximum seeding time (seconds) until torrent is stopped from seeding */
   max_seeding_time: number
-  // Torrent name
+  /** Torrent name */
   name: string
-  // Number of seeds in the swarm
+  /** Number of seeds in the swarm */
   num_complete: number
-  // Number of leechers in the swarm
+  /** Number of leechers in the swarm */
   num_incomplete: number
-  // Number of leechers connected to
+  /** Number of leechers connected to */
   num_leechs: number
-  // Number of seeds connected to
+  /** Number of seeds connected to */
   num_seeds: number
-  // Torrent priority. Returns -1 if queuing is disabled or torrent is in seed mode
+  /** Torrent priority. Returns -1 if queuing is disabled or torrent is in seed mode */
-  priority: number
+  priority: Priority
-  // Torrent progress (percentage/100)
+  /** Torrent progress (percentage/100) */
   progress: number
-  // Torrent share ratio. Max ratio value: 9999.
+  /** Torrent share ratio. Max ratio value: 9999. */
   ratio: number
+  /** TODO */
   ratio_limit: number
-  // Path where this torrent's data is stored
+  /** Path where this torrent's data is stored */
   save_path: string
-  // Torrent elapsed time while complete (seconds)
+  /** Torrent elapsed time while complete (seconds) */
   seeding_time: number
+  /** TODO */
   seeding_time_limit: number
-  // Time (Unix Epoch) when this torrent was last seen complete
+  /** Time (Unix Epoch) when this torrent was last seen complete */
   seen_complete: number
-  // True if sequential download is enabled
+  /** True if sequential download is enabled */
   seq_dl: boolean
-  // Total size (bytes) of files selected for download
+  /** Total size (bytes) of files selected for download */
   size: number
-  // Torrent state. See table here below for the possible values
+  /** Torrent state. See table here below for the possible values */
   state: TorrentState
-  // True if super seeding is enabled
+  /** True if super seeding is enabled */
   super_seeding: boolean
-  // Comma-concatenated tag list of the torrent
+  /** Comma-concatenated tag list of the torrent */
   tags: string
-  // Total active time (seconds)
+  /** Total active time (seconds) */
   time_active: number
-  // Total size (bytes) of all file in this torrent (including unselected ones)
+  /** Total size (bytes) of all file in this torrent (including unselected ones) */
   total_size: number
-  // The first tracker with working status. Returns empty string if no tracker is working.
+  /** The first tracker with working status. Returns empty string if no tracker is working. */
   tracker: string
-  // Torrent upload speed limit (bytes/s). -1 if unlimited.
+  /** TODO */
+  trackers_count: number
+  /** Torrent upload speed limit (bytes/s). -1 if unlimited. */
   up_limit: number
-  // Amount of data uploaded
+  /** Amount of data uploaded */
   uploaded: number
-  // Amount of data uploaded this session
+  /** Amount of data uploaded this session */
   uploaded_session: number
-  // Torrent upload speed (bytes/s)
+  /** Torrent upload speed (bytes/s) */
   upspeed: number
 }

src/views/Dashboard.vue

@@ -159,6 +159,61 @@ export default {
   components: { Torrent, TorrentRightClickMenu },
   mixins: [TorrentSelect, General],
   data() {
+    const sortOptions = [
+      { value: 'added_on', text: this.$t('modals.sort.sortBy.added_on') },
+      { value: 'amount_left', text: this.$t('modals.sort.sortBy.amount_left') },
+      { value: 'auto_tmm', text: this.$t('modals.sort.sortBy.auto_tmm') },
+      { value: 'availability', text: this.$t('modals.sort.sortBy.availability') },
+      { value: 'category', text: this.$t('modals.sort.sortBy.category') },
+      { value: 'completed', text: this.$t('modals.sort.sortBy.completed') },
+      { value: 'completion_on', text: this.$t('modals.sort.sortBy.completion_on') },
+      { value: 'content_path', text: this.$t('modals.sort.sortBy.content_path') },
+      { value: 'dl_limit', text: this.$t('modals.sort.sortBy.dl_limit') },
+      { value: 'dlspeed', text: this.$t('modals.sort.sortBy.dlspeed') },
+      { value: 'download_path', text: this.$t('modals.sort.sortBy.download_path') },
+      { value: 'downloaded', text: this.$t('modals.sort.sortBy.downloaded') },
+      { value: 'downloaded_session', text: this.$t('modals.sort.sortBy.downloaded_session') },
+      { value: 'eta', text: this.$t('modals.sort.sortBy.eta') },
+      { value: 'f_l_piece_prio', text: this.$t('modals.sort.sortBy.f_l_piece_prio') },
+      { value: 'force_start', text: this.$t('modals.sort.sortBy.force_start') },
+      { value: 'globalSpeed', text: this.$t('modals.sort.sortBy.globalSpeed') },
+      { value: 'globalVolume', text: this.$t('modals.sort.sortBy.globalVolume') },
+      { value: 'hash', text: this.$t('modals.sort.sortBy.hash') },
+      { value: 'infohash_v1', text: this.$t('modals.sort.sortBy.infohash_v1') },
+      { value: 'infohash_v2', text: this.$t('modals.sort.sortBy.infohash_v2') },
+      { value: 'last_activity', text: this.$t('modals.sort.sortBy.last_activity') },
+      { value: 'magnet_uri', text: this.$t('modals.sort.sortBy.magnet_uri') },
+      { value: 'max_ratio', text: this.$t('modals.sort.sortBy.max_ratio') },
+      { value: 'max_seeding_time', text: this.$t('modals.sort.sortBy.max_seeding_time') },
+      { value: 'name', text: this.$t('modals.sort.sortBy.name') },
+      { value: 'num_complete', text: this.$t('modals.sort.sortBy.num_complete') },
+      { value: 'num_incomplete', text: this.$t('modals.sort.sortBy.num_incomplete') },
+      { value: 'num_leechs', text: this.$t('modals.sort.sortBy.num_leechs') },
+      { value: 'num_seeds', text: this.$t('modals.sort.sortBy.num_seeds') },
+      { value: 'priority', text: this.$t('modals.sort.sortBy.priority') },
+      { value: 'progress', text: this.$t('modals.sort.sortBy.progress') },
+      { value: 'ratio', text: this.$t('modals.sort.sortBy.ratio') },
+      { value: 'ratio_limit', text: this.$t('modals.sort.sortBy.ratio_limit') },
+      { value: 'save_path', text: this.$t('modals.sort.sortBy.save_path') },
+      { value: 'seeding_time', text: this.$t('modals.sort.sortBy.seeding_time') },
+      { value: 'seeding_time_limit', text: this.$t('modals.sort.sortBy.seeding_time_limit') },
+      { value: 'seen_complete', text: this.$t('modals.sort.sortBy.seen_complete') },
+      { value: 'seq_dl', text: this.$t('modals.sort.sortBy.seq_dl') },
+      { value: 'size', text: this.$t('modals.sort.sortBy.size') },
+      { value: 'state', text: this.$t('modals.sort.sortBy.state') },
+      { value: 'super_seeding', text: this.$t('modals.sort.sortBy.super_seeding') },
+      { value: 'tags', text: this.$t('modals.sort.sortBy.tags') },
+      { value: 'time_active', text: this.$t('modals.sort.sortBy.time_active') },
+      { value: 'total_size', text: this.$t('modals.sort.sortBy.total_size') },
+      { value: 'tracker', text: this.$t('modals.sort.sortBy.tracker') },
+      { value: 'trackers_count', text: this.$t('modals.sort.sortBy.trackers_count') },
+      { value: 'up_limit', text: this.$t('modals.sort.sortBy.up_limit') },
+      { value: 'uploaded', text: this.$t('modals.sort.sortBy.uploaded') },
+      { value: 'uploaded_session', text: this.$t('modals.sort.sortBy.uploaded_session') },
+      { value: 'upspeed', text: this.$t('modals.sort.sortBy.upspeed') }
+    ]
+    sortOptions.sort((a,b) => a.text.localeCompare(b.text))
+
     return {
       data: null,
       trcMenu: {
@@ -177,29 +232,7 @@ export default {
       sortEnabled: false,
       sortOptions: [
         { value: '', text: this.$t('modals.sort.sortBy.default') },
-        { value: 'added_on', text: this.$t('modals.sort.sortBy.addedOn') },
+        ...sortOptions
-        { value: 'availability', text: this.$t('modals.sort.sortBy.availability') },
-        { value: 'category', text: this.$t('modals.sort.sortBy.category') },
-        { value: 'completed', text: this.$t('modals.sort.sortBy.completed') },
-        { value: 'completion_on', text: this.$t('modals.sort.sortBy.completion_on') },
-        { value: 'dlspeed', text: this.$t('modals.sort.sortBy.downloadSpeed') },
-        { value: 'downloaded', text: this.$t('modals.sort.sortBy.downloaded') },
-        { value: 'eta', text: this.$t('modals.sort.sortBy.ETA') },
-        { value: 'globalSpeed', text: this.$t('modals.sort.sortBy.globalSpeed') },
-        { value: 'globalVolume', text: this.$t('modals.sort.sortBy.globalVolume') },
-        { value: 'last_activity', text: this.$t('modals.sort.sortBy.last_activity') },
-        { value: 'name', text: this.$t('modals.sort.sortBy.name') },
-        { value: 'num_leechs', text: this.$t('modals.sort.sortBy.peers') },
-        { value: 'num_seeds', text: this.$t('modals.sort.sortBy.seeds') },
-        { value: 'priority', text: this.$t('modals.sort.sortBy.priority') },
-        { value: 'progress', text: this.$t('modals.sort.sortBy.progress') },
-        { value: 'ratio', text: this.$t('modals.sort.sortBy.ratio') },
-        { value: 'save_path', text: this.$t('modals.sort.sortBy.save_path') },
-        { value: 'size', text: this.$t('modals.sort.sortBy.size') },
-        { value: 'state', text: this.$t('modals.sort.sortBy.state') },
-        { value: 'time_active', text: this.$t('modals.sort.sortBy.timeActive') },
-        { value: 'uploaded', text: this.$t('modals.sort.sortBy.uploaded') },
-        { value: 'upspeed', text: this.$t('modals.sort.sortBy.uploadSpeed') }
       ],
       mdiTextBoxSearch,
       mdiChevronLeftCircle,

tests/unit/DesktopCard.spec.js

@@ -2,9 +2,85 @@ import { describe, beforeEach, it, expect, vi } from 'vitest'
 import { shallowMount } from '@vue/test-utils'
 
 import DesktopCard from '@/components/Settings/Tabs/VueTorrent/VDesktopCard.vue'
+import {DashboardProperty} from "@/enums/vuetorrent";
 
 let wrapper
 
+const desktopPropertiesTemplate = [
+  { name: DashboardProperty.SIZE, active: true },
+  { name: DashboardProperty.PROGRESS, active: true },
+  { name: DashboardProperty.DOWNLOAD_SPEED, active: true },
+  { name: DashboardProperty.UPLOAD_SPEED, active: true },
+  { name: DashboardProperty.DOWNLOADED, active: true },
+  { name: DashboardProperty.SAVE_PATH, active: false },
+  { name: DashboardProperty.UPLOADED, active: true },
+  { name: DashboardProperty.ETA, active: true },
+  { name: DashboardProperty.PEERS, active: true },
+  { name: DashboardProperty.SEEDS, active: true },
+  { name: DashboardProperty.STATUS, active: true },
+  { name: DashboardProperty.RATIO, active: true },
+  { name: DashboardProperty.TRACKER, active: false },
+  { name: DashboardProperty.CATEGORY, active: true },
+  { name: DashboardProperty.TAGS, active: true },
+  { name: DashboardProperty.ADDED_ON, active: true },
+  { name: DashboardProperty.AVAILABILITY, active: true },
+  { name: DashboardProperty.LAST_ACTIVITY, active: false },
+  { name: DashboardProperty.COMPLETED_ON, active: false },
+  { name: DashboardProperty.AMOUNT_LEFT, active: false },
+  { name: DashboardProperty.CONTENT_PATH, active: false },
+  { name: DashboardProperty.DOWNLOADED_SESSION, active: false },
+  { name: DashboardProperty.DOWNLOAD_LIMIT, active: false },
+  { name: DashboardProperty.DOWNLOAD_PATH, active: false },
+  { name: DashboardProperty.HASH, active: false },
+  { name: DashboardProperty.INFOHASH_V1, active: false },
+  { name: DashboardProperty.INFOHASH_V2, active: false },
+  { name: DashboardProperty.SEEN_COMPLETE, active: false },
+  { name: DashboardProperty.TIME_ACTIVE, active: false },
+  { name: DashboardProperty.TOTAL_SIZE, active: false },
+  { name: DashboardProperty.TRACKERS_COUND, active: false },
+  { name: DashboardProperty.UPLOADED_SESSION, active: false },
+  { name: DashboardProperty.UPLOAD_LIMIT, active: false },
+  { name: DashboardProperty.GLOBAL_SPEED, active: false },
+  { name: DashboardProperty.GLOBAL_VOLUME, active: false }
+]
+const desktopPropertiesTemplateExpected = [
+  { name: 'Size', label: 'Size', active: true },
+  { name: 'Progress', label: 'Progress', active: true },
+  { name: 'DownloadSpeed', label: 'Download Speed', active: true },
+  { name: 'UploadSpeed', label: 'Upload Speed', active: true },
+  { name: 'Downloaded', label: 'Downloaded (global)', active: true },
+  { name: 'SavePath', label: 'Save Path', active: false },
+  { name: 'Uploaded', label: 'Uploaded (global)', active: true },
+  { name: 'ETA', label: 'ETA', active: true },
+  { name: 'Peers', label: 'Peers', active: true },
+  { name: 'Seeds', label: 'Seeds', active: true },
+  { name: 'Status', label: 'Status', active: true },
+  { name: 'Ratio', label: 'Ratio', active: true },
+  { name: 'Tracker', label: 'Tracker', active: false },
+  { name: 'Category', label: 'Category', active: true },
+  { name: 'Tags', label: 'Tags', active: true },
+  { name: 'AddedOn', label: 'Added On', active: true },
+  { name: 'Availability', label: 'Availability', active: true },
+  { name: 'LastActivity', label: 'Last Activity', active: false },
+  { name: 'CompletedOn', label: 'Completed On', active: false },
+  { name: 'AmountLeft', label: 'Amount Left', active: false },
+  { name: 'ContentPath', label: 'Content Path', active: false },
+  { name: 'DownloadedSession', label: 'Downloaded (session)', active: false },
+  { name: 'DownloadLimit', label: 'Download Limit', active: false },
+  { name: 'DownloadPath', label: 'Download Path', active: false },
+  { name: 'Hash', label: 'Hash', active: false },
+  { name: 'InfoHashV1', label: 'Infohash v1', active: false },
+  { name: 'InfoHashV2', label: 'Infohash v2', active: false },
+  { name: 'SeenComplete', label: 'Seen Complete', active: false },
+  { name: 'TimeActive', label: 'Time Active', active: false },
+  { name: 'TotalSize', label: 'Total Size', active: false },
+  { name: 'TrackersCount', label: 'Trackers Count', active: false },
+  { name: 'UploadedSession', label: 'Uploaded (session)', active: false },
+  { name: 'UploadLimit', label: 'Upload Limit', active: false },
+  { name: 'GlobalSpeed', label: 'Global Speed', active: false },
+  { name: 'GlobalVolume', label: 'Global Volume', active: false }
+]
+
 describe('DesktopCard', () => {
   beforeEach(() => {
     wrapper = shallowMount(DesktopCard, {
@@ -27,40 +103,11 @@ describe('DesktopCard', () => {
               title: 'Default',
               rightDrawer: false,
               paginationSize: 15,
-              busyDesktopTorrentProperties: [
+              dateFormat: 'DD/MM/YYYY, HH:mm:ss',
-                { name: 'Size', active: true },
+              openSideBarOnStart: true,
-                { name: 'Progress', active: true },
+              showShutdownButton: true,
-                { name: 'Download', active: true },
+              busyDesktopTorrentProperties: JSON.parse(JSON.stringify(desktopPropertiesTemplate)),
-                { name: 'Upload', active: true },
+              doneDesktopTorrentProperties: JSON.parse(JSON.stringify(desktopPropertiesTemplate))
-                { name: 'Downloaded', active: true },
-                { name: 'Uploaded', active: true },
-                { name: 'ETA', active: true },
-                { name: 'Peers', active: true },
-                { name: 'Seeds', active: true },
-                { name: 'Status', active: true },
-                { name: 'Ratio', active: true },
-                { name: 'Category', active: true },
-                { name: 'Tags', active: true },
-                { name: 'AddedOn', active: true },
-                { name: 'Availability', active: true }
-              ],
-              doneDesktopTorrentProperties: [
-                { name: 'Size', active: true },
-                { name: 'Progress', active: true },
-                { name: 'Download', active: true },
-                { name: 'Upload', active: true },
-                { name: 'Downloaded', active: true },
-                { name: 'Uploaded', active: true },
-                { name: 'ETA', active: true },
-                { name: 'Peers', active: true },
-                { name: 'Seeds', active: true },
-                { name: 'Status', active: true },
-                { name: 'Ratio', active: true },
-                { name: 'Category', active: true },
-                { name: 'Tags', active: true },
-                { name: 'AddedOn', active: true },
-                { name: 'Availability', active: true }
-              ]
             }
           }
         }
@@ -73,44 +120,10 @@ describe('DesktopCard', () => {
   })
 
   it('tests busyDesktopTorrentProperties', () => {
-    const busyDesktopTorrentProperties = [
+    expect(wrapper.vm.busyDesktopTorrentProperties).toEqual(desktopPropertiesTemplateExpected)
-      { name: 'Size', label: 'Size', active: true },
-      { name: 'Progress', label: 'Progress', active: true },
-      { name: 'Download', label: 'Download Speed', active: true },
-      { name: 'Upload', label: 'Upload Speed', active: true },
-      { name: 'Downloaded', label: 'Downloaded', active: true },
-      { name: 'Uploaded', label: 'Uploaded', active: true },
-      { name: 'ETA', label: 'ETA', active: true },
-      { name: 'Peers', label: 'Peers', active: true },
-      { name: 'Seeds', label: 'Seeds', active: true },
-      { name: 'Status', label: 'State', active: true },
-      { name: 'Ratio', label: 'Ratio', active: true },
-      { name: 'Category', label: 'Category', active: true },
-      { name: 'Tags', label: 'Tags', active: true },
-      { name: 'AddedOn', label: 'Added On', active: true },
-      { name: 'Availability', label: 'Availability', active: true }
-    ]
-    expect(wrapper.vm.busyDesktopTorrentProperties).toEqual(busyDesktopTorrentProperties)
   })
 
   it('tests doneDesktopTorrentProperties', () => {
-    const doneDesktopTorrentProperties = [
+    expect(wrapper.vm.doneDesktopTorrentProperties).toEqual(desktopPropertiesTemplateExpected)
-      { name: 'Size', label: 'Size', active: true },
-      { name: 'Progress', label: 'Progress', active: true },
-      { name: 'Download', label: 'Download Speed', active: true },
-      { name: 'Upload', label: 'Upload Speed', active: true },
-      { name: 'Downloaded', label: 'Downloaded', active: true },
-      { name: 'Uploaded', label: 'Uploaded', active: true },
-      { name: 'ETA', label: 'ETA', active: true },
-      { name: 'Peers', label: 'Peers', active: true },
-      { name: 'Seeds', label: 'Seeds', active: true },
-      { name: 'Status', label: 'State', active: true },
-      { name: 'Ratio', label: 'Ratio', active: true },
-      { name: 'Category', label: 'Category', active: true },
-      { name: 'Tags', label: 'Tags', active: true },
-      { name: 'AddedOn', label: 'Added On', active: true },
-      { name: 'Availability', label: 'Availability', active: true }
-    ]
-    expect(wrapper.vm.doneDesktopTorrentProperties).toEqual(doneDesktopTorrentProperties)
   })
 })

tests/unit/MobileCard.spec.js

@@ -0,0 +1,85 @@
+import { describe, beforeEach, it, expect, vi } from 'vitest'
+import { shallowMount } from '@vue/test-utils'
+
+import MobileCard from '@/components/Settings/Tabs/VueTorrent/VMobileCard.vue'
+import {DashboardProperty} from '@/enums/vuetorrent'
+
+let wrapper
+
+const mobilePropertiesTemplate = [
+  { name: DashboardProperty.STATUS, active: true },
+  { name: DashboardProperty.TRACKER, active: true },
+  { name: DashboardProperty.CATEGORY, active: true },
+  { name: DashboardProperty.TAGS, active: true },
+  { name: DashboardProperty.SIZE, active: true },
+  { name: DashboardProperty.PROGRESS, active: true },
+  { name: DashboardProperty.RATIO, active: true },
+  { name: DashboardProperty.UPLOADED, active: true },
+  { name: DashboardProperty.ETA, active: true },
+  { name: DashboardProperty.SEEDS, active: true },
+  { name: DashboardProperty.PEERS, active: true },
+  { name: DashboardProperty.DOWNLOAD_SPEED, active: true },
+  { name: DashboardProperty.UPLOAD_SPEED, active: true }
+]
+const mobilePropertiesTemplateExpected = [
+  { name: 'Status', label: 'Status', active: true },
+  { name: 'Tracker', label: 'Tracker', active: true },
+  { name: 'Category', label: 'Category', active: true },
+  { name: 'Tags', label: 'Tags', active: true },
+  { name: 'Size', label: 'Size', active: true },
+  { name: 'Progress', label: 'Progress', active: true },
+  { name: 'Ratio', label: 'Ratio', active: true },
+  { name: 'Uploaded', label: 'Uploaded (global)', active: true },
+  { name: 'ETA', label: 'ETA', active: true },
+  { name: 'Seeds', label: 'Seeds', active: true },
+  { name: 'Peers', label: 'Peers', active: true },
+  { name: 'DownloadSpeed', label: 'Download Speed', active: true },
+  { name: 'UploadSpeed', label: 'Upload Speed', active: true }
+]
+
+describe('MobileCard', () => {
+  beforeEach(() => {
+    wrapper = shallowMount(MobileCard, {
+      mocks: {
+        $t: x => x,
+        $store: {
+          getters: { getAppVersion: vi.fn() },
+          state: {
+            webuiSettings: {
+              lang: 'en',
+              darkTheme: false,
+              showFreeSpace: true,
+              showSpeedGraph: true,
+              showSessionStat: true,
+              showAlltimeStat: true,
+              showCurrentSpeed: true,
+              showTrackerFilter: false,
+              showSpeedInTitle: false,
+              deleteWithFiles: false,
+              title: 'Default',
+              rightDrawer: false,
+              paginationSize: 15,
+              dateFormat: 'DD/MM/YYYY, HH:mm:ss',
+              openSideBarOnStart: true,
+              showShutdownButton: true,
+              busyMobileCardProperties: JSON.parse(JSON.stringify(mobilePropertiesTemplate)),
+              doneMobileCardProperties: JSON.parse(JSON.stringify(mobilePropertiesTemplate))
+            }
+          }
+        }
+      }
+    })
+  })
+
+  it('render correctly', () => {
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('tests busyMobileCardProperties', () => {
+    expect(wrapper.vm.busyMobileCardProperties).toEqual(mobilePropertiesTemplateExpected)
+  })
+
+  it('tests doneMobileCardProperties', () => {
+    expect(wrapper.vm.doneMobileCardProperties).toEqual(mobilePropertiesTemplateExpected)
+  })
+})

tests/unit/__snapshots__/DesktopCard.spec.js.snap

@@ -7,7 +7,7 @@ exports[`DesktopCard > render correctly 1`] = `
       <v-subheader-stub> modals.settings.pageVueTorrent.pageDesktopCard.busyTorrentTip </v-subheader-stub>
       <v-row-stub tag=\\"div\\" dense=\\"true\\">
         <v-list-stub tag=\\"div\\" flat=\\"true\\" class=\\"ma-2 pa-0\\">
-          <draggable-stub list=\\"[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]\\" clone=\\"[Function]\\" element=\\"div\\" tag=\\"tbody\\">
+          <draggable-stub list=\\"[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]\\" clone=\\"[Function]\\" element=\\"div\\" tag=\\"tbody\\">
             <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
               <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
               <v-list-item-content-stub tag=\\"div\\">
@@ -47,7 +47,16 @@ exports[`DesktopCard > render correctly 1`] = `
             <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
               <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
               <v-list-item-content-stub tag=\\"div\\">
-                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Downloaded</v-list-item-title-stub>
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Downloaded (global)</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Save Path</v-list-item-title-stub>
               </v-list-item-content-stub>
               <v-list-item-action-stub>
                 <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
@@ -56,7 +65,7 @@ exports[`DesktopCard > render correctly 1`] = `
             <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
               <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
               <v-list-item-content-stub tag=\\"div\\">
-                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Uploaded</v-list-item-title-stub>
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Uploaded (global)</v-list-item-title-stub>
               </v-list-item-content-stub>
               <v-list-item-action-stub>
                 <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
@@ -92,7 +101,7 @@ exports[`DesktopCard > render correctly 1`] = `
             <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
               <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
               <v-list-item-content-stub tag=\\"div\\">
-                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">State</v-list-item-title-stub>
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Status</v-list-item-title-stub>
               </v-list-item-content-stub>
               <v-list-item-action-stub>
                 <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
@@ -107,6 +116,15 @@ exports[`DesktopCard > render correctly 1`] = `
                 <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
               </v-list-item-action-stub>
             </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Tracker</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
             <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
               <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
               <v-list-item-content-stub tag=\\"div\\">
@@ -143,6 +161,168 @@ exports[`DesktopCard > render correctly 1`] = `
                 <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
               </v-list-item-action-stub>
             </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Last Activity</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Completed On</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Amount Left</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Content Path</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Downloaded (session)</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Download Limit</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Download Path</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Hash</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Infohash v1</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Infohash v2</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Seen Complete</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Time Active</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Total Size</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Trackers Count</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Uploaded (session)</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Upload Limit</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Global Speed</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Global Volume</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
           </draggable-stub>
         </v-list-stub>
       </v-row-stub>
@@ -151,7 +331,7 @@ exports[`DesktopCard > render correctly 1`] = `
       <v-subheader-stub> modals.settings.pageVueTorrent.pageDesktopCard.completedTorrentTip </v-subheader-stub>
       <v-row-stub tag=\\"div\\" dense=\\"true\\">
         <v-list-stub tag=\\"div\\" flat=\\"true\\" class=\\"ma-2 pa-0\\">
-          <draggable-stub list=\\"[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]\\" clone=\\"[Function]\\" element=\\"div\\" tag=\\"tbody\\">
+          <draggable-stub list=\\"[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]\\" clone=\\"[Function]\\" element=\\"div\\" tag=\\"tbody\\">
             <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
               <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
               <v-list-item-content-stub tag=\\"div\\">
@@ -191,7 +371,16 @@ exports[`DesktopCard > render correctly 1`] = `
             <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
               <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
               <v-list-item-content-stub tag=\\"div\\">
-                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Downloaded</v-list-item-title-stub>
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Downloaded (global)</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Save Path</v-list-item-title-stub>
               </v-list-item-content-stub>
               <v-list-item-action-stub>
                 <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
@@ -200,7 +389,7 @@ exports[`DesktopCard > render correctly 1`] = `
             <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
               <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
               <v-list-item-content-stub tag=\\"div\\">
-                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Uploaded</v-list-item-title-stub>
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Uploaded (global)</v-list-item-title-stub>
               </v-list-item-content-stub>
               <v-list-item-action-stub>
                 <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
@@ -236,7 +425,7 @@ exports[`DesktopCard > render correctly 1`] = `
             <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
               <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
               <v-list-item-content-stub tag=\\"div\\">
-                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">State</v-list-item-title-stub>
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Status</v-list-item-title-stub>
               </v-list-item-content-stub>
               <v-list-item-action-stub>
                 <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
@@ -251,6 +440,15 @@ exports[`DesktopCard > render correctly 1`] = `
                 <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
               </v-list-item-action-stub>
             </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Tracker</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
             <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
               <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
               <v-list-item-content-stub tag=\\"div\\">
@@ -287,6 +485,168 @@ exports[`DesktopCard > render correctly 1`] = `
                 <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
               </v-list-item-action-stub>
             </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Last Activity</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Completed On</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Amount Left</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Content Path</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Downloaded (session)</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Download Limit</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Download Path</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Hash</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Infohash v1</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Infohash v2</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Seen Complete</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Time Active</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Total Size</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Trackers Count</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Uploaded (session)</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Upload Limit</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Global Speed</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
+            <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+              <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+              <v-list-item-content-stub tag=\\"div\\">
+                <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Global Volume</v-list-item-title-stub>
+              </v-list-item-content-stub>
+              <v-list-item-action-stub>
+                <v-icon-stub> M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z </v-icon-stub>
+              </v-list-item-action-stub>
+            </v-list-item-stub>
           </draggable-stub>
         </v-list-stub>
       </v-row-stub>

tests/unit/__snapshots__/MobileCard.spec.js.snap

@@ -0,0 +1,178 @@
+// Vitest Snapshot v1
+
+exports[`MobileCard > render correctly 1`] = `
+"<v-card-stub loaderheight=\\"4\\" tag=\\"div\\" flat=\\"true\\">
+  <v-row-stub tag=\\"div\\" dense=\\"true\\">
+    <v-col-stub cols=\\"12\\" md=\\"6\\" tag=\\"div\\">
+      <v-subheader-stub> modals.settings.pageVueTorrent.pageMobileCard.busyTorrentTip </v-subheader-stub>
+      <v-row-stub tag=\\"div\\" dense=\\"true\\">
+        <v-list-stub tag=\\"div\\" flat=\\"true\\" class=\\"ma-2 pa-0\\">
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Status</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Tracker</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Category</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Tags</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Size</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Progress</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Ratio</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Uploaded (global)</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">ETA</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Seeds</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Peers</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Download Speed</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Upload Speed</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+        </v-list-stub>
+      </v-row-stub>
+    </v-col-stub>
+    <v-col-stub cols=\\"12\\" md=\\"6\\" tag=\\"div\\">
+      <v-subheader-stub> modals.settings.pageVueTorrent.pageMobileCard.completedTorrentTip </v-subheader-stub>
+      <v-row-stub tag=\\"div\\" dense=\\"true\\">
+        <v-list-stub tag=\\"div\\" flat=\\"true\\" class=\\"ma-2 pa-0\\">
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Status</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Tracker</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Category</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Tags</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Size</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Progress</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Ratio</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Uploaded (global)</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">ETA</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Seeds</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Peers</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Download Speed</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+          <v-list-item-stub activeclass=\\"\\" tag=\\"div\\" class=\\"ma-2 elevation-2 rounded-lg pointer\\">
+            <v-checkbox-stub errorcount=\\"1\\" errormessages=\\"\\" messages=\\"\\" rules=\\"\\" successmessages=\\"\\" backgroundcolor=\\"\\" dense=\\"true\\" hidedetails=\\"true\\" ripple=\\"true\\" valuecomparator=\\"[Function]\\" inputvalue=\\"true\\" indeterminateicon=\\"$checkboxIndeterminate\\" officon=\\"$checkboxOff\\" onicon=\\"$checkboxOn\\" class=\\"pa-0 ma-0\\"></v-checkbox-stub>
+            <v-list-item-content-stub tag=\\"div\\">
+              <v-list-item-title-stub tag=\\"div\\" class=\\"truncate\\">Upload Speed</v-list-item-title-stub>
+            </v-list-item-content-stub>
+          </v-list-item-stub>
+        </v-list-stub>
+      </v-row-stub>
+    </v-col-stub>
+  </v-row-stub>
+</v-card-stub>"
+`;