@monkvision/inspection-capture-web 5.0.21 → 5.1.0

package/lib/hooks/useCaptureDuration.js

@@ -0,0 +1,208 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCaptureDuration = void 0;
+var common_1 = require("@monkvision/common");
+var network_1 = require("@monkvision/network");
+var react_1 = require("react");
+var monitoring_1 = require("@monkvision/monitoring");
+var CAPTURE_DURATION = 'capture_duration';
+/**
+ * Custom hook used to track the duration of an inspection session.
+ */
+function useCaptureDuration(_a) {
+    var _this = this;
+    var apiConfig = _a.apiConfig, inspectionId = _a.inspectionId, isInspectionCompleted = _a.isInspectionCompleted, _b = _a.heartbeatInterval, heartbeatInterval = _b === void 0 ? 30000 : _b, _c = _a.idleTimeout, idleTimeout = _c === void 0 ? 10000 : _c;
+    var startTimeRef = (0, react_1.useRef)(Date.now());
+    var totalActiveTimeRef = (0, react_1.useRef)(0);
+    var heartbeatTimerRef = (0, react_1.useRef)(null);
+    var idleTimerRef = (0, react_1.useRef)(null);
+    var pendingUpdateRef = (0, react_1.useRef)(false);
+    var captureDurationRef = (0, react_1.useRef)(0);
+    var isActive = (0, react_1.useRef)(true);
+    var cycleCountRef = (0, react_1.useRef)(0);
+    var updateAdditionalData = (0, network_1.useMonkApi)(apiConfig).updateAdditionalData;
+    var handleError = (0, monitoring_1.useMonitoring)().handleError;
+    var pauseTracking = (0, react_1.useCallback)(function () {
+        if (isActive.current) {
+            isActive.current = false;
+            totalActiveTimeRef.current += (Date.now() - startTimeRef.current) / 1000;
+        }
+    }, []);
+    var resumeTracking = (0, react_1.useCallback)(function () {
+        if (!isActive.current) {
+            startTimeRef.current = Date.now();
+            isActive.current = true;
+        }
+    }, []);
+    var updateDuration = (0, react_1.useCallback)(function (forceUpdate) {
+        if (forceUpdate === void 0) { forceUpdate = false; }
+        return __awaiter(_this, void 0, void 0, function () {
+            var existingDuration_1, err_1;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        if (isInspectionCompleted || pendingUpdateRef.current) {
+                            return [2 /*return*/, 0];
+                        }
+                        if (forceUpdate) {
+                            totalActiveTimeRef.current += (Date.now() - startTimeRef.current) / 1000;
+                        }
+                        _a.label = 1;
+                    case 1:
+                        _a.trys.push([1, 3, 4, 5]);
+                        pendingUpdateRef.current = true;
+                        existingDuration_1 = 0;
+                        return [4 /*yield*/, updateAdditionalData({
+                                id: inspectionId,
+                                callback: function (existingData) {
+                                    existingDuration_1 = (existingData === null || existingData === void 0 ? void 0 : existingData[CAPTURE_DURATION])
+                                        ? existingData === null || existingData === void 0 ? void 0 : existingData[CAPTURE_DURATION]
+                                        : 0;
+                                    return __assign(__assign({}, existingData), { capture_duration: existingDuration_1 + totalActiveTimeRef.current });
+                                },
+                            })];
+                    case 2:
+                        _a.sent();
+                        captureDurationRef.current = existingDuration_1 + totalActiveTimeRef.current;
+                        startTimeRef.current = Date.now();
+                        totalActiveTimeRef.current = 0;
+                        return [2 /*return*/, captureDurationRef.current];
+                    case 3:
+                        err_1 = _a.sent();
+                        handleError(err_1);
+                        throw err_1;
+                    case 4:
+                        pendingUpdateRef.current = false;
+                        return [7 /*endfinally*/];
+                    case 5: return [2 /*return*/];
+                }
+            });
+        });
+    }, [updateAdditionalData, inspectionId, isInspectionCompleted, handleError]);
+    var restartIdleTimer = (0, react_1.useCallback)(function () {
+        if (idleTimerRef.current) {
+            clearInterval(idleTimerRef.current);
+        }
+        idleTimerRef.current = setInterval(function () {
+            pauseTracking();
+        }, idleTimeout);
+    }, [pauseTracking]);
+    (0, react_1.useEffect)(function () {
+        if (isInspectionCompleted) {
+            return undefined;
+        }
+        var activityEvents = [
+            'touchstart',
+            'touchmove',
+            'touchend',
+            'click',
+            'scroll',
+            'keydown',
+            'mousedown',
+            'mousemove',
+        ];
+        var handleActivity = function () {
+            if (!isActive.current) {
+                cycleCountRef.current += 1;
+            }
+            resumeTracking();
+            restartIdleTimer();
+            if (cycleCountRef.current >= 5) {
+                updateDuration(true);
+                cycleCountRef.current = 0;
+            }
+        };
+        var handleBeforeUnload = function () {
+            updateDuration();
+        };
+        var handleVisibilityChange = function () {
+            if (document.hidden) {
+                updateDuration();
+                pauseTracking();
+            }
+            else {
+                resumeTracking();
+            }
+        };
+        heartbeatTimerRef.current = setInterval(function () {
+            if (isActive.current) {
+                updateDuration(true);
+            }
+        }, heartbeatInterval);
+        restartIdleTimer();
+        document.addEventListener('visibilitychange', handleVisibilityChange);
+        window.addEventListener('beforeunload', handleBeforeUnload);
+        activityEvents.forEach(function (event) {
+            document.addEventListener(event, handleActivity, { passive: true });
+        });
+        return function () {
+            document.removeEventListener('visibilitychange', handleVisibilityChange);
+            window.removeEventListener('beforeunload', handleBeforeUnload);
+            activityEvents.forEach(function (event) {
+                document.removeEventListener(event, handleActivity);
+            });
+            if (heartbeatTimerRef.current) {
+                clearInterval(heartbeatTimerRef.current);
+            }
+            if (idleTimerRef.current) {
+                clearInterval(idleTimerRef.current);
+            }
+        };
+    }, [
+        pauseTracking,
+        resumeTracking,
+        updateDuration,
+        heartbeatInterval,
+        isInspectionCompleted,
+        restartIdleTimer,
+    ]);
+    return (0, common_1.useObjectMemo)({ updateDuration: updateDuration });
+}
+exports.useCaptureDuration = useCaptureDuration;

package/lib/hooks/useTracking.js

@@ -14,6 +14,12 @@ function useTracking(_a) {
     var monitoring = (0, monitoring_1.useMonitoring)();
     (0, react_1.useEffect)(function () {
         var _a;
+        var currentAnalyticsUserId = analytics.getUserId();
+        var newAnalyticsUserId = "".concat(inspectionId, ":").concat(currentAnalyticsUserId);
+        if (currentAnalyticsUserId.includes(':')) {
+            newAnalyticsUserId = "".concat(inspectionId, ":").concat(currentAnalyticsUserId.split(':')[1]);
+        }
+        analytics.setUserId(newAnalyticsUserId);
         monitoring.setTags({
             inspectionId: inspectionId,
         });

package/lib/translations/de.json

@@ -42,6 +42,10 @@
                 "sightTutorial": "Verwenden Sie das Bild unten links, um sich bei der Rahmung führen zu lassen.<br>Tippen Sie darauf, um eine detaillierte Erklärung zu erhalten.",
                 "sight": "Richten Sie das Fahrzeug so gut wie möglich an den Linien aus, um das beste Foto zu erhalten.<br>Drücken Sie den Auslöser, um das Foto aufzunehmen.",
                 "next": "Weiter"
+            },
+            "sightTutorial": {
+                "tip": "Tipp",
+                "defaultTutorial": "Positionieren Sie sich wie im linken Diagramm gezeigt und stellen Sie sicher, dass die Kamera auf der richtigen Höhe ist.\nFalls ein Referenzfoto vorhanden ist, versuchen Sie, Ihren Bildausschnitt entsprechend anzupassen."
             }
         },
         "gallery": {

package/lib/translations/en.json

@@ -42,6 +42,10 @@
                 "sightTutorial": "Use bottom left image to guide you with the framing.<br>Tap it to see a detailed explanation.",
                 "sight": "Align the vehicle with the lines as much as possible to get the best shot.<br>Press the shutter button to take the photo.",
                 "next": "Next"
+            },
+            "sightTutorial": {
+                "tip": "Tip",
+                "defaultTutorial": "Position yourself as shown in the left diagram, ensuring the camera is at the correct height.\nIf a reference photo is provided, try to match your framing accordingly."
             }
         },
         "gallery": {

package/lib/translations/fr.json

@@ -42,6 +42,10 @@
                 "sightTutorial": "Utilisez l'image en bas à gauche pour vous guider dans le cadrage.<br>Appuyez dessus pour voir une explication détaillée.",
                 "sight": "Alignez le véhicule avec les lignes autant que possible pour obtenir la meilleure photo.<br>Appuyez sur le déclencheur pour prendre la photo.",
                 "next": "Suivant"
+            },
+            "sightTutorial": {
+                "tip": "Conseil",
+                "defaultTutorial": "Placez-vous comme indiqué dans le schéma de gauche en veillant à ce que la caméra soit à la bonne hauteur.\nSi une photo de référence est fournie, essayez d’adapter votre cadrage en conséquence."
             }
         },
         "gallery": {

package/lib/translations/nl.json

@@ -42,6 +42,10 @@
                 "sightTutorial": "Gebruik het plaatje linksonder om je te leiden bij het kadreren.<br>Klik erop voor een gedetailleerde uitleg.",
                 "sight": "Richt het voertuig zo goed mogelijk uit op de lijnen om de beste foto te krijgen.<br>Druk op de knop om de foto te nemen.",
                 "next": "Volgende"
+            },
+            "sightTutorial": {
+                "tip": "Tip",
+                "defaultTutorial": "Plaats jezelf zoals aangegeven in het linkerschema en zorg ervoor dat de camera op de juiste hoogte staat.\nAls er een referentiefoto is, probeer dan je kader hierop af te stemmen."
             }
         },
         "gallery": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@monkvision/inspection-capture-web",
-  "version": "5.0.21",
+  "version": "5.1.0",
   "license": "BSD-3-Clause-Clear",
   "packageManager": "yarn@3.2.4",
   "description": "MonkJs inspection capture package for React (web) used to implement the Monk inspection capture workflow",
@@ -28,12 +28,12 @@
     "lint:fix": "yarn run prettier:fix && yarn run eslint:fix"
   },
   "dependencies": {
-    "@monkvision/analytics": "5.0.21",
-    "@monkvision/camera-web": "5.0.21",
-    "@monkvision/common": "5.0.21",
-    "@monkvision/common-ui-web": "5.0.21",
-    "@monkvision/network": "5.0.21",
-    "@monkvision/sights": "5.0.21",
+    "@monkvision/analytics": "5.1.0",
+    "@monkvision/camera-web": "5.1.0",
+    "@monkvision/common": "5.1.0",
+    "@monkvision/common-ui-web": "5.1.0",
+    "@monkvision/network": "5.1.0",
+    "@monkvision/sights": "5.1.0",
     "i18next": "^23.4.5",
     "react-i18next": "^13.2.0"
   },
@@ -44,13 +44,13 @@
     "react-router-dom": "^6.22.3"
   },
   "devDependencies": {
-    "@monkvision/eslint-config-base": "5.0.21",
-    "@monkvision/eslint-config-typescript": "5.0.21",
-    "@monkvision/eslint-config-typescript-react": "5.0.21",
-    "@monkvision/jest-config": "5.0.21",
-    "@monkvision/prettier-config": "5.0.21",
-    "@monkvision/test-utils": "5.0.21",
-    "@monkvision/typescript-config": "5.0.21",
+    "@monkvision/eslint-config-base": "5.1.0",
+    "@monkvision/eslint-config-typescript": "5.1.0",
+    "@monkvision/eslint-config-typescript-react": "5.1.0",
+    "@monkvision/jest-config": "5.1.0",
+    "@monkvision/prettier-config": "5.1.0",
+    "@monkvision/test-utils": "5.1.0",
+    "@monkvision/typescript-config": "5.1.0",
     "@testing-library/react": "^12.1.5",
     "@testing-library/react-hooks": "^8.0.1",
     "@types/copyfiles": "^2",
@@ -93,5 +93,5 @@
     "url": "https://github.com/monkvision/monkjs/issues"
   },
   "homepage": "https://github.com/monkvision/monkjs",
-  "gitHead": "cd5e702c63e437dcd6daf445ba2b28294b8c03da"
+  "gitHead": "0ff06347d55681e32db67d69d36194061ca65780"
 }