From befe62f8a03b5454838fae4f41bd39094e25d88f Mon Sep 17 00:00:00 2001
From: benonymity <benonymity@gmail.com>
Date: Sun, 21 Aug 2022 15:02:22 -0400
Subject: [PATCH 1/3] feat: downloads page for iOS

---
 components/app/SideDrawer.vue |  7 +++
 pages/downloads.vue           | 86 +++++++++++++++++++++++++++++++++++
 2 files changed, 93 insertions(+)
 create mode 100644 pages/downloads.vue

diff --git a/components/app/SideDrawer.vue b/components/app/SideDrawer.vue
index f51a1568..fec146db 100644
--- a/components/app/SideDrawer.vue
+++ b/components/app/SideDrawer.vue
@@ -113,6 +113,13 @@ export default {
           text: 'Local Media',
           to: '/localMedia/folders'
         })
+      } else {
+        items.push({
+        icon: 'download',
+        iconOutlined: false,
+        text: 'Downloads',
+        to: '/downloads'
+        })
       }
       items.push({
         icon: 'settings',
diff --git a/pages/downloads.vue b/pages/downloads.vue
new file mode 100644
index 00000000..b1a7f284
--- /dev/null
+++ b/pages/downloads.vue
@@ -0,0 +1,86 @@
+<template>
+  <div class="w-full h-full py-6 px-4 overflow-y-auto">
+    <p class="mb-2 text-base text-white">Downloads ({{ localLibraryItems.length }})</p>
+
+    <div class="w-full media-item-container overflow-y-auto">
+      <template v-for="(mediaItem, num) in localLibraryItems">
+        <div :key="mediaItem.id">
+          <div class="flex w-full items-center">
+            <nuxt-link :to="`/item/${mediaItem.id}`" class="flex flex-grow">
+              <div class="w-16 h-16 min-w-16 min-h-16 flex-none bg-primary relative self-center">
+                <img v-if="mediaItem.coverPathSrc" :src="mediaItem.coverPathSrc" class="w-full h-full object-contain" />
+              </div>
+              <div class="px-2 self-center">
+                <p class="text-sm">{{ mediaItem.media.metadata.title }}</p>
+                <p v-if="mediaItem.mediaType == 'book'" class="text-xs text-gray-300">{{ mediaItem.media.tracks.length }} Track{{ mediaItem.media.tracks.length == 1 ? '' : 's' }}</p>
+                <p v-else-if="mediaItem.mediaType == 'podcast'" class="text-xs text-gray-300">{{ mediaItem.media.episodes.length }} Episode{{ mediaItem.media.episodes.length == 1 ? '' : 's' }}</p>
+                <p v-if="size(mediaItem)" class="text-xs text-gray-300">{{ $bytesPretty(size(mediaItem)) }}</p>
+              </div>
+            </nuxt-link>
+            <div class="w-12 h-12 flex items-center">
+              <span class="material-icons text-2xl text-red-400" @click="deleteItem(mediaItem)">delete</span>
+            </div>
+          </div>
+          <div v-if="num+1 < localLibraryItems.length" class="flex border-t border-white border-opacity-10 my-3"/>
+        </div>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script>
+import { Capacitor } from '@capacitor/core'
+import { Dialog } from '@capacitor/dialog'
+import { AbsFileSystem } from '@/plugins/capacitor'
+
+export default {
+  data() {
+    return {
+      localLibraryItems: [],
+    }
+  },
+  methods: {
+    async init() {
+      var items = (await this.$db.getLocalLibraryItems()) || []
+      this.localLibraryItems = items.map((lmi) => {
+        console.log('Local library item', JSON.stringify(lmi))
+        return {
+          ...lmi,
+          coverPathSrc: lmi.coverContentUrl ? Capacitor.convertFileSrc(lmi.coverContentUrl) : null
+        }
+      })
+    },
+    size(item) {
+      console.log('sizing' + item)
+      let size = null
+      if (item.localFiles) {
+        for (let i = 0; i < item.localFiles.length; i++) {
+          size = size + item.localFiles[i].size
+        }
+      return size
+      }
+    },
+    async deleteItem(item) {
+      const { value } = await Dialog.confirm({
+        title: 'Confirm',
+        message: `Warning! This will delete "${item.media.metadata.title}" and all associated local files. Are you sure?`
+      })
+      if (value) {
+        var res = await AbsFileSystem.deleteItem(item)
+        if (res && res.success) {
+          this.$toast.success('Deleted Successfully')
+          this.init()
+        } else this.$toast.error('Failed to delete')
+      }
+    },
+  },
+  mounted() {
+    this.$eventBus.$on('new-local-library-item', this.newLocalLibraryItem)
+    this.init()
+  },
+  beforeDestroy() {
+    this.$eventBus.$off('new-local-library-item', this.newLocalLibraryItem)
+  }
+}
+</script>
+

From d7c414f6c026508908ca9a49590edc0badb2bb49 Mon Sep 17 00:00:00 2001
From: advplyr <advplyr@protonmail.com>
Date: Sun, 21 Aug 2022 15:59:44 -0500
Subject: [PATCH 2/3] Merge

---
 ios/App/Podfile | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/ios/App/Podfile b/ios/App/Podfile
index 89125e80..dcdae730 100644
--- a/ios/App/Podfile
+++ b/ios/App/Podfile
@@ -9,12 +9,12 @@ install! 'cocoapods', :disable_input_output_paths => true
 def capacitor_pods
   pod 'Capacitor', :path => '../../node_modules/@capacitor/ios'
   pod 'CapacitorCordova', :path => '../../node_modules/@capacitor/ios'
-  pod 'CapacitorApp', :path => '..\..\node_modules\@capacitor\app'
-  pod 'CapacitorDialog', :path => '..\..\node_modules\@capacitor\dialog'
-  pod 'CapacitorHaptics', :path => '..\..\node_modules\@capacitor\haptics'
-  pod 'CapacitorNetwork', :path => '..\..\node_modules\@capacitor\network'
-  pod 'CapacitorStatusBar', :path => '..\..\node_modules\@capacitor\status-bar'
-  pod 'CapacitorStorage', :path => '..\..\node_modules\@capacitor\storage'
+  pod 'CapacitorApp', :path => '../../node_modules/@capacitor/app'
+  pod 'CapacitorDialog', :path => '../../node_modules/@capacitor/dialog'
+  pod 'CapacitorHaptics', :path => '../../node_modules/@capacitor/haptics'
+  pod 'CapacitorNetwork', :path => '../../node_modules/@capacitor/network'
+  pod 'CapacitorStatusBar', :path => '../../node_modules/@capacitor/status-bar'
+  pod 'CapacitorStorage', :path => '../../node_modules/@capacitor/storage'
 end
 
 target 'App' do

From d331e1f9ab5f2a28448bd4fe9d529b8a4d5740d5 Mon Sep 17 00:00:00 2001
From: advplyr <advplyr@protonmail.com>
Date: Sun, 21 Aug 2022 16:20:10 -0500
Subject: [PATCH 3/3] iOS downloads page cleanup UI

---
 pages/downloads.vue | 86 +++++++++++++++++++++------------------------
 1 file changed, 41 insertions(+), 45 deletions(-)

diff --git a/pages/downloads.vue b/pages/downloads.vue
index b1a7f284..52863e3e 100644
--- a/pages/downloads.vue
+++ b/pages/downloads.vue
@@ -2,26 +2,24 @@
   <div class="w-full h-full py-6 px-4 overflow-y-auto">
     <p class="mb-2 text-base text-white">Downloads ({{ localLibraryItems.length }})</p>
 
-    <div class="w-full media-item-container overflow-y-auto">
+    <div class="w-full">
       <template v-for="(mediaItem, num) in localLibraryItems">
-        <div :key="mediaItem.id">
-          <div class="flex w-full items-center">
-            <nuxt-link :to="`/item/${mediaItem.id}`" class="flex flex-grow">
-              <div class="w-16 h-16 min-w-16 min-h-16 flex-none bg-primary relative self-center">
-                <img v-if="mediaItem.coverPathSrc" :src="mediaItem.coverPathSrc" class="w-full h-full object-contain" />
-              </div>
-              <div class="px-2 self-center">
-                <p class="text-sm">{{ mediaItem.media.metadata.title }}</p>
-                <p v-if="mediaItem.mediaType == 'book'" class="text-xs text-gray-300">{{ mediaItem.media.tracks.length }} Track{{ mediaItem.media.tracks.length == 1 ? '' : 's' }}</p>
-                <p v-else-if="mediaItem.mediaType == 'podcast'" class="text-xs text-gray-300">{{ mediaItem.media.episodes.length }} Episode{{ mediaItem.media.episodes.length == 1 ? '' : 's' }}</p>
-                <p v-if="size(mediaItem)" class="text-xs text-gray-300">{{ $bytesPretty(size(mediaItem)) }}</p>
-              </div>
-            </nuxt-link>
-            <div class="w-12 h-12 flex items-center">
-              <span class="material-icons text-2xl text-red-400" @click="deleteItem(mediaItem)">delete</span>
+        <div :key="mediaItem.id" class="w-full">
+          <nuxt-link :to="`/localMedia/item/${mediaItem.id}`" class="flex items-center">
+            <div class="w-16 h-16 min-w-16 min-h-16 flex-none bg-primary relative">
+              <img v-if="mediaItem.coverPathSrc" :src="mediaItem.coverPathSrc" class="w-full h-full object-contain" />
             </div>
-          </div>
-          <div v-if="num+1 < localLibraryItems.length" class="flex border-t border-white border-opacity-10 my-3"/>
+            <div class="px-2 flex-grow">
+              <p class="text-sm">{{ mediaItem.media.metadata.title }}</p>
+              <p v-if="mediaItem.mediaType == 'book'" class="text-xs text-gray-300">{{ mediaItem.media.tracks.length }} Track{{ mediaItem.media.tracks.length == 1 ? '' : 's' }}</p>
+              <p v-else-if="mediaItem.mediaType == 'podcast'" class="text-xs text-gray-300">{{ mediaItem.media.episodes.length }} Episode{{ mediaItem.media.episodes.length == 1 ? '' : 's' }}</p>
+              <p v-if="mediaItem.size" class="text-xs text-gray-300">{{ $bytesPretty(mediaItem.size) }}</p>
+            </div>
+            <div class="w-12 h-12 flex items-center justify-center">
+              <span class="material-icons text-2xl text-gray-400">chevron_right</span>
+            </div>
+          </nuxt-link>
+          <div v-if="num+1 < localLibraryItems.length" class="flex border-t border-white border-opacity-10 my-3" />
         </div>
       </template>
     </div>
@@ -30,49 +28,47 @@
 
 <script>
 import { Capacitor } from '@capacitor/core'
-import { Dialog } from '@capacitor/dialog'
-import { AbsFileSystem } from '@/plugins/capacitor'
 
 export default {
   data() {
     return {
-      localLibraryItems: [],
+      localLibraryItems: []
     }
   },
   methods: {
+    getSize(item) {
+      if (!item || !item.localFiles) return 0
+      let size = 0
+      for (let i = 0; i < item.localFiles.length; i++) {
+        size += item.localFiles[i].size
+      }
+      return size
+    },
+    newLocalLibraryItem(item) {
+      if (!item) return
+      const itemIndex = this.localLibraryItems.findIndex((li) => li.id === item.id)
+      const newItemObj = {
+        ...item,
+        size: this.getSize(item),
+        coverPathSrc: item.coverContentUrl ? Capacitor.convertFileSrc(item.coverContentUrl) : null
+      }
+      if (itemIndex >= 0) {
+        this.localLibraryItems.splice(itemIndex, 1, newItemObj)
+      } else {
+        this.localLibraryItems.push(newItemObj)
+      }
+    },
     async init() {
       var items = (await this.$db.getLocalLibraryItems()) || []
       this.localLibraryItems = items.map((lmi) => {
         console.log('Local library item', JSON.stringify(lmi))
         return {
           ...lmi,
+          size: this.getSize(lmi),
           coverPathSrc: lmi.coverContentUrl ? Capacitor.convertFileSrc(lmi.coverContentUrl) : null
         }
       })
-    },
-    size(item) {
-      console.log('sizing' + item)
-      let size = null
-      if (item.localFiles) {
-        for (let i = 0; i < item.localFiles.length; i++) {
-          size = size + item.localFiles[i].size
-        }
-      return size
-      }
-    },
-    async deleteItem(item) {
-      const { value } = await Dialog.confirm({
-        title: 'Confirm',
-        message: `Warning! This will delete "${item.media.metadata.title}" and all associated local files. Are you sure?`
-      })
-      if (value) {
-        var res = await AbsFileSystem.deleteItem(item)
-        if (res && res.success) {
-          this.$toast.success('Deleted Successfully')
-          this.init()
-        } else this.$toast.error('Failed to delete')
-      }
-    },
+    }
   },
   mounted() {
     this.$eventBus.$on('new-local-library-item', this.newLocalLibraryItem)