Fix:Native back button go back or ask before quitting #52, Fix:Appbar back button

android/app/capacitor.build.gradle

@@ -10,6 +10,7 @@ android {
 apply from: "../capacitor-cordova-android-plugins/cordova.variables.gradle"
 dependencies {
     implementation project(':capacitor-community-sqlite')
+    implementation project(':capacitor-app')
     implementation project(':capacitor-dialog')
     implementation project(':capacitor-network')
     implementation project(':capacitor-storage')

android/app/src/main/AndroidManifest.xml

@@ -50,6 +50,14 @@
             <action android:name="android.media.action.MEDIA_PLAY_FROM_SEARCH" />
             <category android:name="android.intent.category.DEFAULT" />
           </intent-filter>
+
+          <!-- Register URL scheme -->
+          <intent-filter>
+            <action android:name="android.intent.action.VIEW" />
+            <category android:name="android.intent.category.DEFAULT" />
+            <category android:name="android.intent.category.BROWSABLE" />
+            <data android:scheme="@string/custom_url_scheme" />
+          </intent-filter>
         </activity>
 
 

android/app/src/main/assets/capacitor.plugins.json

@@ -3,6 +3,10 @@
 		"pkg": "@capacitor-community/sqlite",
 		"classpath": "com.getcapacitor.community.database.sqlite.CapacitorSQLitePlugin"
 	},
+	{
+		"pkg": "@capacitor/app",
+		"classpath": "com.capacitorjs.plugins.app.AppPlugin"
+	},
 	{
 		"pkg": "@capacitor/dialog",
 		"classpath": "com.capacitorjs.plugins.dialog.DialogPlugin"

android/capacitor.settings.gradle

@@ -5,6 +5,9 @@ project(':capacitor-android').projectDir = new File('../node_modules/@capacitor/
 include ':capacitor-community-sqlite'
 project(':capacitor-community-sqlite').projectDir = new File('../node_modules/@capacitor-community/sqlite/android')
 
+include ':capacitor-app'
+project(':capacitor-app').projectDir = new File('../node_modules/@capacitor/app/android')
+
 include ':capacitor-dialog'
 project(':capacitor-dialog').projectDir = new File('../node_modules/@capacitor/dialog/android')
 

components/app/Appbar.vue

@@ -61,11 +61,7 @@ export default {
       this.$store.commit('libraries/setShowModal', true)
     },
     back() {
-      if (this.$route.name === 'audiobook-id-edit') {
+      window.history.back()
-        this.$router.push(`/audiobook/${this.$route.params.id}`)
-      } else {
-        this.$router.push('/bookshelf')
-      }
     }
   },
   mounted() {}

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "audiobookshelf-app",
-  "version": "v0.9.17-beta",
+  "version": "0.9.33-beta",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -1010,6 +1010,11 @@
       "resolved": "https://registry.npmjs.org/@capacitor/android/-/android-3.2.2.tgz",
       "integrity": "sha512-+/qbSZIHPP1VndRUe5c6dgheLV0MgX9CXeUo7el8ODHgVrC2DXKhczgvs+EpTAmvS2VZFxzDeld7AMUmHybTcg=="
     },
+    "@capacitor/app": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/@capacitor/app/-/app-1.0.7.tgz",
+      "integrity": "sha512-7CcMGp9yshBR0fkmNPVsYmUUhlAQnJFCeJGJIF3862D5l+drBjEOE+QoGjiKtaqPriadkGCsoYVrX10yGULDpA=="
+    },
     "@capacitor/cli": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/@capacitor/cli/-/cli-3.1.2.tgz",

package.json

@@ -12,6 +12,7 @@
   "dependencies": {
     "@capacitor-community/sqlite": "^3.2.0",
     "@capacitor/android": "^3.2.2",
+    "@capacitor/app": "^1.0.7",
     "@capacitor/cli": "^3.1.2",
     "@capacitor/core": "^3.2.2",
     "@capacitor/dialog": "^1.0.3",

plugins/init.client.js

@@ -1,6 +1,23 @@
 import Vue from 'vue'
+import { App } from '@capacitor/app'
+import { Dialog } from '@capacitor/dialog'
 import { formatDistance, format } from 'date-fns'
 
+App.addListener('backButton', async ({ canGoBack }) => {
+  if (!canGoBack) {
+    const { value } = await Dialog.confirm({
+      title: 'Confirm',
+      message: `Did you want to exit the app?`,
+    })
+    if (value) {
+      App.exitApp()
+    }
+
+  } else {
+    window.history.back()
+  }
+});
+
 Vue.prototype.$eventBus = new Vue()
 
 Vue.prototype.$isDev = process.env.NODE_ENV !== 'production'