allaw-ui 2.5.5 → 2.5.6

package/dist/components/molecules/billingCount/BillingCount.d.ts

@@ -6,5 +6,5 @@ export type BillingCountProps = {
     resetTimer?: boolean;
     pauseTimer?: boolean;
 };
-declare const BillingCount: ({ onEnd, setIsStarted, pauseTimer, resetTimer, }: BillingCountProps) => React.JSX.Element;
+declare const BillingCount: ({ onEnd, setIsStarted, resetTimer, pauseTimer, }: BillingCountProps) => React.JSX.Element;
 export default BillingCount;

package/dist/components/molecules/billingCount/BillingCount.js

@@ -2,145 +2,156 @@ import React, { useEffect, useState, useRef } from "react";
 import "./BillingCount.css";
 var LOCAL_STORAGE_KEYS = {
     START_TIME: "startTimeBilling",
-    ELAPSED_TIME: "elapsedTime",
+    ACCUMULATED_TIME: "accumulatedTime",
     IS_RUNNING: "isRunning",
+    HAS_STARTED_BEFORE: "hasStartedBefore",
 };
 var BillingCount = function (_a) {
-    var onEnd = _a.onEnd, setIsStarted = _a.setIsStarted, pauseTimer = _a.pauseTimer, resetTimer = _a.resetTimer;
-    var _b = useState(0), time = _b[0], setTime = _b[1];
-    var _c = useState(false), isPaused = _c[0], setIsPaused = _c[1];
-    var _d = useState(false), isRunning = _d[0], setIsRunning = _d[1];
-    var _e = useState(false), isInitialized = _e[0], setIsInitialized = _e[1];
+    var onEnd = _a.onEnd, setIsStarted = _a.setIsStarted, resetTimer = _a.resetTimer, pauseTimer = _a.pauseTimer;
+    var _b = useState(0), elapsedSeconds = _b[0], setElapsedSeconds = _b[1];
+    var _c = useState(false), isRunning = _c[0], setIsRunning = _c[1];
     var intervalRef = useRef(null);
+    // --- Au premier render, on relit le localStorage
     useEffect(function () {
-        setIsInitialized(true);
-    }, []);
-    useEffect(function () {
-        setTime(getSavedElapsedTime());
-    }, []);
-    useEffect(function () {
-        if (!isInitialized)
-            return;
-        if (resetTimer)
-            setTime(0);
-        setIsPaused(false);
-        setIsRunning(false);
-        clearTimerData();
-        if (intervalRef.current) {
-            clearInterval(intervalRef.current);
+        var savedAccumulated = getAccumulatedTime();
+        var savedIsRunning = localStorage.getItem(LOCAL_STORAGE_KEYS.IS_RUNNING) === "true";
+        var savedStartTime = getStartTime();
+        var hasStartedBefore = localStorage.getItem(LOCAL_STORAGE_KEYS.HAS_STARTED_BEFORE) === "true"; // ✅ Vérifier si un chrono a déjà été utilisé
+        if (savedAccumulated > 0) {
+            setElapsedSeconds(savedAccumulated);
         }
-        else if (pauseTimer) {
-            pauseTimerHandler();
+        if (hasStartedBefore && savedIsRunning && savedStartTime > 0) {
+            // ✅ Reprendre seulement si le chrono a déjà été lancé au moins une fois
+            setIsRunning(true);
+            setIsStarted && setIsStarted(true);
         }
-        else if (!pauseTimer && !isRunning && isPaused) {
-            startTimerHandler();
+        else {
+            // ✅ Ne pas démarrer automatiquement si aucun chrono n'a été lancé
+            setIsRunning(false);
+            setIsStarted && setIsStarted(false);
         }
-    }, [resetTimer]);
+    }, [setIsStarted]);
+    // --- Gère l'interval pour mettre à jour l'affichage
     useEffect(function () {
-        if (isRunning && !isPaused) {
-            intervalRef.current = setInterval(function () {
-                setTime(function (prevTime) {
-                    var newElapsedTime = prevTime + 1;
-                    updateElapsedTime(newElapsedTime);
-                    return newElapsedTime;
-                });
+        if (isRunning) {
+            // Créé un interval toutes les 1000ms
+            intervalRef.current = window.setInterval(function () {
+                var newElapsed = computeElapsedTime(); // on recalcule via Date.now()
+                setElapsedSeconds(newElapsed);
             }, 1000);
         }
         else if (intervalRef.current) {
+            // On stoppe l'interval
             clearInterval(intervalRef.current);
             intervalRef.current = null;
         }
+        // Cleanup si le composant se démonte
         return function () {
             if (intervalRef.current)
                 clearInterval(intervalRef.current);
         };
-    }, [isRunning, isPaused]);
+    }, [isRunning]);
+    // --- Sur changement de resetTimer/pauseTimer
+    //     on applique la logique de reset, de pause ou de start
     useEffect(function () {
-        if (!isInitialized)
-            return;
+        var hasStartedBefore = localStorage.getItem(LOCAL_STORAGE_KEYS.HAS_STARTED_BEFORE) === "true";
+        var savedAccumulated = getAccumulatedTime();
         if (resetTimer) {
-            pauseTimerHandler();
-        }
-        else if (!pauseTimer && !resetTimer) {
-            startTimerHandler();
+            resetTimerHandler();
         }
         else if (pauseTimer) {
             pauseTimerHandler();
         }
-    }, [pauseTimer, resetTimer]);
-    // Gestion de reprise de chrono en cas de refresh de page
-    useEffect(function () {
-        var savedElapsedTime = getSavedElapsedTime();
-        var savedIsRunning = localStorage.getItem(LOCAL_STORAGE_KEYS.IS_RUNNING) === "true";
-        setTime(savedElapsedTime);
-        if (savedIsRunning && savedElapsedTime > 0) {
-            setIsRunning(true);
-            setIsStarted && setIsStarted(true);
-        }
-        else {
-            setIsRunning(false);
-            setIsStarted && setIsStarted(false);
-        }
-    }, [setIsStarted]);
-    // Mise a jour du temps de session
-    var updateElapsedTime = function (elapsedTime) {
-        localStorage.setItem(LOCAL_STORAGE_KEYS.ELAPSED_TIME, elapsedTime.toString());
-    };
-    // Cleanup du localStorage après un reset de session de travail
-    var clearTimerData = function () {
-        localStorage.removeItem(LOCAL_STORAGE_KEYS.START_TIME);
-        localStorage.removeItem(LOCAL_STORAGE_KEYS.ELAPSED_TIME);
-        localStorage.removeItem(LOCAL_STORAGE_KEYS.IS_RUNNING);
-    };
-    var getSavedElapsedTime = function () {
-        return parseInt(localStorage.getItem(LOCAL_STORAGE_KEYS.ELAPSED_TIME) || "0", 10);
-    };
-    var getCurrentElapsedTime = function () {
-        var savedStartTime = localStorage.getItem(LOCAL_STORAGE_KEYS.START_TIME);
-        if (savedStartTime) {
-            return getSavedElapsedTime();
+        else if (!pauseTimer && !resetTimer) {
+            // ⚠️ Ne lance le chrono que s'il est déjà en cours ou s'il y a du temps accumulé
+            if (hasStartedBefore && savedAccumulated > 0) {
+                startTimerHandler();
+            }
         }
-        return getSavedElapsedTime();
+    }, [resetTimer, pauseTimer]);
+    // --- Fonctions utilitaires ---
+    // Calcule la différence en s'appuyant sur:
+    //   accumulatedTime (secondes) + (Date.now() - startTime) / 1000
+    var computeElapsedTime = function () {
+        var savedStartTime = getStartTime();
+        var savedAccumulated = getAccumulatedTime();
+        if (!savedStartTime)
+            return savedAccumulated;
+        var now = Date.now();
+        var diffSeconds = Math.floor((now - savedStartTime) / 1000);
+        return savedAccumulated + diffSeconds;
     };
+    // On lance ou relance le chrono
     var startTimerHandler = function () {
-        if (!isRunning) {
-            localStorage.setItem(LOCAL_STORAGE_KEYS.START_TIME, new Date().toISOString());
+        var isRunningFlag = localStorage.getItem(LOCAL_STORAGE_KEYS.IS_RUNNING) === "true";
+        if (!isRunningFlag) {
+            // ✅ Indiquer que le chrono a été démarré au moins une fois
+            localStorage.setItem(LOCAL_STORAGE_KEYS.HAS_STARTED_BEFORE, "true");
+            localStorage.setItem(LOCAL_STORAGE_KEYS.START_TIME, Date.now().toString());
             localStorage.setItem(LOCAL_STORAGE_KEYS.IS_RUNNING, "true");
-            setTime(getSavedElapsedTime());
             setIsRunning(true);
             setIsStarted && setIsStarted(true);
         }
     };
+    // On met le chrono en pause
     var pauseTimerHandler = function () {
-        if (isRunning) {
-            var elapsed = getCurrentElapsedTime();
-            updateElapsedTime(elapsed);
+        var currentlyRunning = localStorage.getItem(LOCAL_STORAGE_KEYS.IS_RUNNING) === "true";
+        if (currentlyRunning) {
+            // On calcule le temps total vraiment écoulé
+            var newElapsed = computeElapsedTime();
+            // On met à jour l'accumulatedTime en localStorage
+            localStorage.setItem(LOCAL_STORAGE_KEYS.ACCUMULATED_TIME, newElapsed.toString());
+            // On arrête
             localStorage.setItem(LOCAL_STORAGE_KEYS.IS_RUNNING, "false");
-            setTime(elapsed);
+            localStorage.removeItem(LOCAL_STORAGE_KEYS.START_TIME);
+            setElapsedSeconds(newElapsed);
             setIsRunning(false);
             setIsStarted && setIsStarted(false);
+            onEnd(newElapsed); // si on veut déclencher l'événement "onEnd"
         }
     };
+    // On remet tout à zéro
+    var resetTimerHandler = function () {
+        clearTimerData();
+        localStorage.setItem(LOCAL_STORAGE_KEYS.HAS_STARTED_BEFORE, "false");
+        setElapsedSeconds(0);
+        setIsRunning(false);
+        setIsStarted && setIsStarted(false);
+    };
     var handleButtonClick = function () {
-        if (!isRunning) {
-            startTimerHandler();
+        if (isRunning) {
+            pauseTimerHandler();
         }
         else {
-            pauseTimerHandler();
-            onEnd(getCurrentElapsedTime());
+            startTimerHandler();
         }
     };
-    var formatTime = function (seconds) {
-        var hrs = Math.floor(seconds / 3600);
-        var mins = Math.floor((seconds % 3600) / 60);
-        var secs = seconds % 60;
+    // --- Lecture / écriture localStorage ---
+    var getStartTime = function () {
+        var val = localStorage.getItem(LOCAL_STORAGE_KEYS.START_TIME);
+        return val ? parseInt(val, 10) : 0;
+    };
+    var getAccumulatedTime = function () {
+        var val = localStorage.getItem(LOCAL_STORAGE_KEYS.ACCUMULATED_TIME);
+        return val ? parseInt(val, 10) : 0;
+    };
+    var clearTimerData = function () {
+        localStorage.removeItem(LOCAL_STORAGE_KEYS.START_TIME);
+        localStorage.removeItem(LOCAL_STORAGE_KEYS.ACCUMULATED_TIME);
+        localStorage.removeItem(LOCAL_STORAGE_KEYS.IS_RUNNING);
+    };
+    // --- Format d'affichage
+    var formatTime = function (totalSeconds) {
+        var hrs = Math.floor(totalSeconds / 3600);
+        var mins = Math.floor((totalSeconds % 3600) / 60);
+        var secs = totalSeconds % 60;
         return "".concat(hrs.toString().padStart(2, "0"), ":").concat(mins
             .toString()
             .padStart(2, "0"), ":").concat(secs.toString().padStart(2, "0"));
     };
     return (React.createElement("button", { onClick: handleButtonClick, className: "billing-button-wrapper ".concat(isRunning ? "isRunning" : "") },
         React.createElement("i", { className: "allaw-icon-clock" }),
-        React.createElement("span", { className: "billing-time" }, formatTime(time)),
+        React.createElement("span", { className: "billing-time" }, formatTime(elapsedSeconds)),
         React.createElement("i", { className: isRunning ? "allaw-icon-pause" : "allaw-icon-play", style: { fontSize: "12px", color: "#25BEEB", fontWeight: 800 } })));
 };
 export default BillingCount;

package/dist/components/molecules/stepper/Stepper.css

@@ -19,10 +19,11 @@
 .stepper-content {
   width: 100%;
   flex: 1;
+  margin: 20px 0;
   overflow-y: auto;
   display: flex;
   flex-direction: column;
-  align-items: flex-start;
+  align-items: center;
   font-family: "Open Sans", sans-serif;
   font-size: 16px;
   font-weight: 400;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "allaw-ui",
-  "version": "2.5.5",
+  "version": "2.5.6",
   "description": "Composants UI pour l'application Allaw",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",