Implemented: toast notification on camera permission denial in Scanner (#165)

package.json

@@ -18,7 +18,7 @@
     "@hotwax/app-version-info": "^1.0.0",
     "@hotwax/apps-theme": "^1.1.0",
     "@hotwax/dxp-components": "^1.3.4",
-    "@hotwax/oms-api": "^1.6.0",
+    "@hotwax/oms-api": "^1.10.0",
     "@ionic/core": "6.7.5",
     "@ionic/vue": "6.7.5",
     "@ionic/vue-router": "6.7.5",

src/adapter/index.ts

@@ -1,8 +1,9 @@
-import { api, client, initialise, resetConfig, updateInstanceUrl, updateToken } from '@hotwax/oms-api'
+import { api, client, getConfig, initialise, resetConfig, updateInstanceUrl, updateToken } from '@hotwax/oms-api'
 
 export {
   api,
   client,
+  getConfig,
   initialise,
   resetConfig,
   updateInstanceUrl,

src/locales/en.json

@@ -2,7 +2,7 @@
   "App": "App",
   "Authenticating": "Authenticating",
   "Are you sure you want to change the time zone to?": "Are you sure you want to change the time zone to {timeZoneId}?",
-  "product barcode": "product barcode",
+  "Camera permission denied.": "Camera permission denied.",
   "Cancel": "Cancel",
   "Change": "Change",
   "Click the backdrop to dismiss.": "Click the backdrop to dismiss.",
@@ -35,6 +35,7 @@
   "Picklist Completed": "Picklist Completed",
   "Picklists": "Picklists",
   "Please allow camera access in your settings": "Please allow camera access in your settings",
+  "product barcode": "product barcode",
   "Product not found": "Product not found",
   "Product not found in remaining items": "Product not found in remaining items",
   "Scan": "Scan",

src/main.ts

@@ -30,6 +30,7 @@ import i18n from './i18n'
 import store from './store'
 import { dxpComponents } from '@hotwax/dxp-components'
 import { login, logout, loader } from './user-utils';
+import { getConfig, initialise } from '@hotwax/oms-api';
 
 const app = createApp(App)
   .use(IonicVue, {
@@ -43,7 +44,9 @@ const app = createApp(App)
     login,
     logout,
     loader,
-    appLoginUrl: process.env.VUE_APP_LOGIN_URL as string
+    appLoginUrl: process.env.VUE_APP_LOGIN_URL as string,
+    getConfig,
+    initialise
   });
 
 // Filters are removed in Vue 3 and global filter introduced https://v3.vuejs.org/guide/migration/filters.html#global-filters

src/views/Picklist-Detail.vue

@@ -170,16 +170,22 @@ export default defineComponent({
       })
     },
     async scanCode() {
-      const modal = await modalController
+      try {
+        // checking camera permission before opening the scanner
+        await navigator.mediaDevices.getUserMedia({ video: true });
+        const modal = await modalController
         .create({
           component: Scanner,
         });
-      modal.onDidDismiss()
+        modal.onDidDismiss()
         .then((result) => {
           //result : value of the scanned barcode/QRcode
           this.selectProduct(result.data.value)
         });
-      return modal.present();
+        return modal.present();
+      } catch (err) {
+        showToast(translate("Camera permission denied."));
+      }
     },
     sortPickists() {
       // Sort picklist products based on the sorting parameter selected

vue.config.js

@@ -1,10 +1,16 @@
+const path = require('path')
 require("@hotwax/app-version-info")
 module.exports = {
   // WHY THIS CONFIG: Error while using pinia while importing dxp-components - 
   // Can't import the named export 'computed' from non EcmaScript module (only default export is available)
   // WHY ERROR: Using Vue CLI 4.x may cause this error (according to Pinia docs, did their suggested resolution)
   // REFERENCE: https://pinia.vuejs.org/cookbook/migration-v1-v2.html#webpack-4-support
   configureWebpack: {
+    resolve: {
+      alias: {
+        vue: path.resolve('./node_modules/vue')
+      }
+    },
     module: {
       rules: [
         {
@@ -27,5 +33,6 @@ module.exports = {
       enableInSFC: true
     }
   },
-  runtimeCompiler: true
+  runtimeCompiler: true,
+  transpileDependencies: ['@hotwax/dxp-components']
 }