merge(master): big merge for qrcode-reboot

src/views/ContactsView.vue

@@ -64,12 +64,12 @@
         </span>
       </span>
 
-      <router-link
-        :to="{ name: 'contact-qr' }"
+      <button
         class="flex items-center bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-1 mr-1 rounded-md"
+        @click="handleQRCodeClick"
       >
         <font-awesome icon="qrcode" class="fa-fw text-2xl" />
-      </router-link>
+      </button>
 
       <textarea
         v-model="contactInput"
@@ -284,7 +284,7 @@
               class="text-sm bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-1.5 rounded-md border border-slate-400"
               title="See more given activity"
             >
-              <fa icon="file-lines" class="fa-fw" />
+              <font-awesome icon="file-lines" class="fa-fw" />
             </router-link>
           </div>
         </div>
@@ -348,6 +348,7 @@ import * as R from "ramda";
 import { Component, Vue } from "vue-facing-decorator";
 import { RouteLocationNormalizedLoaded, Router } from "vue-router";
 import { useClipboard } from "@vueuse/core";
+import { Capacitor } from "@capacitor/core";
 
 import QuickNav from "../components/QuickNav.vue";
 import EntityIcon from "../components/EntityIcon.vue";
@@ -1433,5 +1434,13 @@ export default class ContactsView extends Vue {
       );
     }
   }
+
+  private handleQRCodeClick() {
+    if (Capacitor.isNativePlatform()) {
+      this.$router.push({ name: "contact-qr-scan-full" });
+    } else {
+      this.$router.push({ name: "contact-qr" });
+    }
+  }
 }
 </script>