[Improved]: Refactored camera access handling and internationalized s…

…tatic text for product scanning modal (#329)

Moved the 'hasCameraAccess' check to the parent components (ShipmentDetails, ReturnDetails, and PurchaseOrderDetails), ensuring consistent handling of camera permissions across all views. Also, updated static text with the translate function to support internationalization, improving usability for global users.

src/utils/index.ts

@@ -52,4 +52,16 @@ const handleDateTimeInput = (dateTimeValue: any) => {
   return DateTime.fromISO(dateTime).toMillis()
 }
 
-export { handleDateTimeInput, showToast, hasError, copyToClipboard }
+const hasCameraAccess = async () => {
+  try {
+    const stream = await navigator.mediaDevices.getUserMedia({ video: true });
+    if (stream) {
+      showToast(translate('Camera access granted.'));
+    }
+  } catch (error) {
+    console.error('Camera access denied:', error);
+    showToast(translate('Camera permission is denied. Please enable the camera permission in your device settings to use the scanner.'));
+  }
+}
+
+export { handleDateTimeInput, showToast, hasError, copyToClipboard, hasCameraAccess }

src/views/PurchaseOrderDetail.vue

@@ -190,6 +190,7 @@ import LocationPopover from '@/components/LocationPopover.vue'
 import ImageModal from '@/components/ImageModal.vue';
 import { copyToClipboard, hasError, showToast } from '@/utils';
 import { Actions, hasPermission } from '@/authorization'
+import { hasCameraAccess } from '@/utils/';
 
 export default defineComponent({
   name: "PurchaseOrderDetails",
@@ -249,6 +250,10 @@ export default defineComponent({
       return imageModal.present();
     },
     async scan() {
+      if (!hasCameraAccess()) {
+        showToast(translate("Camera access is required to scan items."));
+        return;
+      }
       const modal = await modalController
       .create({
         component: Scanner,

src/views/ReturnDetails.vue

@@ -117,6 +117,7 @@ import ImageModal from '@/components/ImageModal.vue';
 import { hasError } from '@/utils';
 import { showToast } from '@/utils'
 import { Actions, hasPermission } from '@/authorization'
+import { hasCameraAccess } from '@/utils';
 
 export default defineComponent({
   name: "ReturnDetails",
@@ -268,6 +269,10 @@ export default defineComponent({
       this.queryString = ''
     },
     async scanCode () {
+      if (!hasCameraAccess()) {
+        showToast(translate("Camera access is required to scan items."));
+        return;
+      }
       const modal = await modalController
         .create({
           component: Scanner,

src/views/ShipmentDetails.vue

@@ -123,6 +123,7 @@ import LocationPopover from '@/components/LocationPopover.vue'
 import ImageModal from '@/components/ImageModal.vue';
 import { hasError, showToast } from '@/utils'
 import { Actions, hasPermission } from '@/authorization'
+import { hasCameraAccess } from '@/utils'
 
 export default defineComponent({
   name: "ShipmentDetails",
@@ -287,6 +288,10 @@ export default defineComponent({
       this.queryString = ''
     },
     async scanCode () {
+      if (!hasCameraAccess()) {
+        showToast(translate("Camera access is required to scan items."));
+        return;
+      }
       const modal = await modalController
         .create({
           component: Scanner,