Merge pull request #1473 from nichwall/local_folders_ui_update

Add description for local folder usage

pages/localMedia/folders/index.vue

@@ -1,6 +1,11 @@
 <template>
   <div class="w-full h-full py-6">
-    <h1 class="text-base font-semibold px-2 mb-2">{{ $strings.HeaderLocalFolders }}</h1>
+    <div class="flex items-center mb-2">
+      <h1 class="text-base font-semibold px-2">
+        {{ $strings.HeaderLocalFolders }}
+      </h1>
+      <button type="button" class="material-icons-outlined" @click.stop="showLocalFolderMoreInfo">info</button>
+    </div>
 
     <div v-if="!isIos" class="w-full max-w-full px-2 py-2">
       <template v-for="folder in localFolders">
@@ -33,6 +38,7 @@
 
 <script>
 import { AbsFileSystem } from '@/plugins/capacitor'
+import { Dialog } from '@capacitor/dialog'
 
 export default {
   data() {
@@ -87,6 +93,16 @@ export default {
         this.$toast.success('Folder permission success')
       }
     },
+    async showLocalFolderMoreInfo() {
+      const confirmResult = await Dialog.confirm({
+        title: this.$strings.HeaderLocalFolders,
+        message: this.$strings.MessageLocalFolderDescription,
+        cancelButtonTitle: 'View More'
+      })
+      if (!confirmResult.value) {
+        window.open('https://www.audiobookshelf.org/guides/android_app_shared_storage', '_blank')
+      }
+    },
     async init() {
       const androidSdkVersion = await this.$getAndroidSDKVersion()
       this.isAndroid10OrBelow = !!androidSdkVersion && androidSdkVersion <= 29
@@ -100,4 +116,4 @@ export default {
     this.init()
   }
 }
-</script>
+</script>

strings/en-us.json

@@ -296,6 +296,7 @@
   "MessageItemMissing": "Item is missing and must be fixed on the server. Typically an item is marked as missing because the file paths are not accessible.",
   "MessageLoading": "Loading...",
   "MessageLoadingServerData": "Loading server data...",
+  "MessageLocalFolderDescription": "'Internal App Storage' is only accessible by this app. This app only supports media downloaded directly through the app. Shared storage folders can be used to allow other apps to access media downloaded by this app.",
   "MessageMarkAsFinished": "Mark as Finished",
   "MessageMediaLinkedToADifferentServer": "Media is linked to an Audiobookshelf server on a different address ({0}). Progress will be synced when connected to this server address.",
   "MessageMediaLinkedToADifferentUser": "Media is linked to this server but was downloaded by a different user. Progress will only be synced to the user that downloaded it.",