allaw-ui 2.5.3 → 2.5.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/components/molecules/billingCount/BillingCount.d.ts +1 -1
  2. package/dist/components/molecules/billingCount/BillingCount.js +89 -89
  3. package/package.json +1 -1
package/dist/components/molecules/billingCount/BillingCount.d.ts CHANGED
@@ -6,5 +6,5 @@ export type BillingCountProps = {
6
6
  resetTimer?: boolean;
7
7
  pauseTimer?: boolean;
8
8
  };
9
- declare const BillingCount: ({ onEnd, setIsStarted, pauseTimer, resetTimer, }: BillingCountProps) => React.JSX.Element;
9
+ declare const BillingCount: ({ onEnd, setIsStarted, resetTimer, pauseTimer, }: BillingCountProps) => React.JSX.Element;
10
10
  export default BillingCount;
package/dist/components/molecules/billingCount/BillingCount.js CHANGED
@@ -2,145 +2,145 @@ import React, { useEffect, useState, useRef } from "react";
2
2
  import "./BillingCount.css";
3
3
  var LOCAL_STORAGE_KEYS = {
4
4
  START_TIME: "startTimeBilling",
5
- ELAPSED_TIME: "elapsedTime",
5
+ ACCUMULATED_TIME: "accumulatedTime",
6
6
  IS_RUNNING: "isRunning",
7
7
  };
8
8
  var BillingCount = function (_a) {
9
- var onEnd = _a.onEnd, setIsStarted = _a.setIsStarted, pauseTimer = _a.pauseTimer, resetTimer = _a.resetTimer;
10
- var _b = useState(0), time = _b[0], setTime = _b[1];
11
- var _c = useState(false), isPaused = _c[0], setIsPaused = _c[1];
12
- var _d = useState(false), isRunning = _d[0], setIsRunning = _d[1];
13
- var _e = useState(false), isInitialized = _e[0], setIsInitialized = _e[1];
9
+ var onEnd = _a.onEnd, setIsStarted = _a.setIsStarted, resetTimer = _a.resetTimer, pauseTimer = _a.pauseTimer;
10
+ var _b = useState(0), elapsedSeconds = _b[0], setElapsedSeconds = _b[1];
11
+ var _c = useState(false), isRunning = _c[0], setIsRunning = _c[1];
14
12
  var intervalRef = useRef(null);
13
+ // --- Au premier render, on relit le localStorage
15
14
  useEffect(function () {
16
- setIsInitialized(true);
17
- }, []);
18
- useEffect(function () {
19
- setTime(getSavedElapsedTime());
20
- }, []);
21
- useEffect(function () {
22
- if (!isInitialized)
23
- return;
24
- if (resetTimer)
25
- setTime(0);
26
- setIsPaused(false);
27
- setIsRunning(false);
28
- clearTimerData();
29
- if (intervalRef.current) {
30
- clearInterval(intervalRef.current);
15
+ var savedAccumulated = getAccumulatedTime(); // secondes
16
+ var savedIsRunning = localStorage.getItem(LOCAL_STORAGE_KEYS.IS_RUNNING) === "true";
17
+ var savedStartTime = getStartTime(); // en ms ou 0
18
+ if (savedAccumulated) {
19
+ setElapsedSeconds(savedAccumulated);
31
20
  }
32
- else if (pauseTimer) {
33
- pauseTimerHandler();
21
+ if (savedIsRunning && savedStartTime > 0) {
22
+ setIsRunning(true);
23
+ setIsStarted && setIsStarted(true);
34
24
  }
35
- else if (!pauseTimer && !isRunning && isPaused) {
36
- startTimerHandler();
25
+ else {
26
+ setIsRunning(false);
27
+ setIsStarted && setIsStarted(false);
37
28
  }
38
- }, [resetTimer]);
29
+ }, [setIsStarted]);
30
+ // --- Gère l'interval pour mettre à jour l'affichage
39
31
  useEffect(function () {
40
- if (isRunning && !isPaused) {
41
- intervalRef.current = setInterval(function () {
42
- setTime(function (prevTime) {
43
- var newElapsedTime = prevTime + 1;
44
- updateElapsedTime(newElapsedTime);
45
- return newElapsedTime;
46
- });
32
+ if (isRunning) {
33
+ // Créé un interval toutes les 1000ms
34
+ intervalRef.current = window.setInterval(function () {
35
+ var newElapsed = computeElapsedTime(); // on recalcule via Date.now()
36
+ setElapsedSeconds(newElapsed);
47
37
  }, 1000);
48
38
  }
49
39
  else if (intervalRef.current) {
40
+ // On stoppe l'interval
50
41
  clearInterval(intervalRef.current);
51
42
  intervalRef.current = null;
52
43
  }
44
+ // Cleanup si le composant se démonte
53
45
  return function () {
54
46
  if (intervalRef.current)
55
47
  clearInterval(intervalRef.current);
56
48
  };
57
- }, [isRunning, isPaused]);
49
+ }, [isRunning]);
50
+ // --- Sur changement de resetTimer/pauseTimer
51
+ // on applique la logique de reset, de pause ou de start
58
52
  useEffect(function () {
59
- if (!isInitialized)
60
- return;
61
53
  if (resetTimer) {
62
- pauseTimerHandler();
63
- }
64
- else if (!pauseTimer && !resetTimer) {
65
- startTimerHandler();
54
+ resetTimerHandler();
66
55
  }
67
56
  else if (pauseTimer) {
68
57
  pauseTimerHandler();
69
58
  }
70
- }, [pauseTimer, resetTimer]);
71
- // Gestion de reprise de chrono en cas de refresh de page
72
- useEffect(function () {
73
- var savedElapsedTime = getSavedElapsedTime();
74
- var savedIsRunning = localStorage.getItem(LOCAL_STORAGE_KEYS.IS_RUNNING) === "true";
75
- setTime(savedElapsedTime);
76
- if (savedIsRunning && savedElapsedTime > 0) {
77
- setIsRunning(true);
78
- setIsStarted && setIsStarted(true);
79
- }
80
- else {
81
- setIsRunning(false);
82
- setIsStarted && setIsStarted(false);
83
- }
84
- }, [setIsStarted]);
85
- // Mise a jour du temps de session
86
- var updateElapsedTime = function (elapsedTime) {
87
- localStorage.setItem(LOCAL_STORAGE_KEYS.ELAPSED_TIME, elapsedTime.toString());
88
- };
89
- // Cleanup du localStorage après un reset de session de travail
90
- var clearTimerData = function () {
91
- localStorage.removeItem(LOCAL_STORAGE_KEYS.START_TIME);
92
- localStorage.removeItem(LOCAL_STORAGE_KEYS.ELAPSED_TIME);
93
- localStorage.removeItem(LOCAL_STORAGE_KEYS.IS_RUNNING);
94
- };
95
- var getSavedElapsedTime = function () {
96
- return parseInt(localStorage.getItem(LOCAL_STORAGE_KEYS.ELAPSED_TIME) || "0", 10);
97
- };
98
- var getCurrentElapsedTime = function () {
99
- var savedStartTime = localStorage.getItem(LOCAL_STORAGE_KEYS.START_TIME);
100
- if (savedStartTime) {
101
- return getSavedElapsedTime();
59
+ else if (!pauseTimer && !resetTimer) {
60
+ startTimerHandler();
102
61
  }
103
- return getSavedElapsedTime();
62
+ }, [resetTimer, pauseTimer]);
63
+ // --- Fonctions utilitaires ---
64
+ // Calcule la différence en s'appuyant sur:
65
+ // accumulatedTime (secondes) + (Date.now() - startTime) / 1000
66
+ var computeElapsedTime = function () {
67
+ var savedStartTime = getStartTime();
68
+ var savedAccumulated = getAccumulatedTime();
69
+ if (!savedStartTime)
70
+ return savedAccumulated;
71
+ var now = Date.now();
72
+ var diffSeconds = Math.floor((now - savedStartTime) / 1000);
73
+ return savedAccumulated + diffSeconds;
104
74
  };
75
+ // On lance ou relance le chrono
105
76
  var startTimerHandler = function () {
106
- if (!isRunning) {
107
- localStorage.setItem(LOCAL_STORAGE_KEYS.START_TIME, new Date().toISOString());
77
+ var isRunningFlag = localStorage.getItem(LOCAL_STORAGE_KEYS.IS_RUNNING) === "true";
78
+ if (!isRunningFlag) {
79
+ // On enregistre le moment précis du démarrage (ms)
80
+ localStorage.setItem(LOCAL_STORAGE_KEYS.START_TIME, Date.now().toString());
108
81
  localStorage.setItem(LOCAL_STORAGE_KEYS.IS_RUNNING, "true");
109
- setTime(getSavedElapsedTime());
110
82
  setIsRunning(true);
111
83
  setIsStarted && setIsStarted(true);
112
84
  }
113
85
  };
86
+ // On met le chrono en pause
114
87
  var pauseTimerHandler = function () {
115
- if (isRunning) {
116
- var elapsed = getCurrentElapsedTime();
117
- updateElapsedTime(elapsed);
88
+ var currentlyRunning = localStorage.getItem(LOCAL_STORAGE_KEYS.IS_RUNNING) === "true";
89
+ if (currentlyRunning) {
90
+ // On calcule le temps total vraiment écoulé
91
+ var newElapsed = computeElapsedTime();
92
+ // On met à jour l'accumulatedTime en localStorage
93
+ localStorage.setItem(LOCAL_STORAGE_KEYS.ACCUMULATED_TIME, newElapsed.toString());
94
+ // On arrête
118
95
  localStorage.setItem(LOCAL_STORAGE_KEYS.IS_RUNNING, "false");
119
- setTime(elapsed);
96
+ localStorage.removeItem(LOCAL_STORAGE_KEYS.START_TIME);
97
+ setElapsedSeconds(newElapsed);
120
98
  setIsRunning(false);
121
99
  setIsStarted && setIsStarted(false);
100
+ onEnd(newElapsed); // si on veut déclencher l'événement "onEnd"
122
101
  }
123
102
  };
103
+ // On remet tout à zéro
104
+ var resetTimerHandler = function () {
105
+ clearTimerData();
106
+ setElapsedSeconds(0);
107
+ setIsRunning(false);
108
+ setIsStarted && setIsStarted(false);
109
+ };
124
110
  var handleButtonClick = function () {
125
- if (!isRunning) {
126
- startTimerHandler();
111
+ if (isRunning) {
112
+ pauseTimerHandler();
127
113
  }
128
114
  else {
129
- pauseTimerHandler();
130
- onEnd(getCurrentElapsedTime());
115
+ startTimerHandler();
131
116
  }
132
117
  };
133
- var formatTime = function (seconds) {
134
- var hrs = Math.floor(seconds / 3600);
135
- var mins = Math.floor((seconds % 3600) / 60);
136
- var secs = seconds % 60;
118
+ // --- Lecture / écriture localStorage ---
119
+ var getStartTime = function () {
120
+ var val = localStorage.getItem(LOCAL_STORAGE_KEYS.START_TIME);
121
+ return val ? parseInt(val, 10) : 0;
122
+ };
123
+ var getAccumulatedTime = function () {
124
+ var val = localStorage.getItem(LOCAL_STORAGE_KEYS.ACCUMULATED_TIME);
125
+ return val ? parseInt(val, 10) : 0;
126
+ };
127
+ var clearTimerData = function () {
128
+ localStorage.removeItem(LOCAL_STORAGE_KEYS.START_TIME);
129
+ localStorage.removeItem(LOCAL_STORAGE_KEYS.ACCUMULATED_TIME);
130
+ localStorage.removeItem(LOCAL_STORAGE_KEYS.IS_RUNNING);
131
+ };
132
+ // --- Format d'affichage
133
+ var formatTime = function (totalSeconds) {
134
+ var hrs = Math.floor(totalSeconds / 3600);
135
+ var mins = Math.floor((totalSeconds % 3600) / 60);
136
+ var secs = totalSeconds % 60;
137
137
  return "".concat(hrs.toString().padStart(2, "0"), ":").concat(mins
138
138
  .toString()
139
139
  .padStart(2, "0"), ":").concat(secs.toString().padStart(2, "0"));
140
140
  };
141
141
  return (React.createElement("button", { onClick: handleButtonClick, className: "billing-button-wrapper ".concat(isRunning ? "isRunning" : "") },
142
142
  React.createElement("i", { className: "allaw-icon-clock" }),
143
- React.createElement("span", { className: "billing-time" }, formatTime(time)),
143
+ React.createElement("span", { className: "billing-time" }, formatTime(elapsedSeconds)),
144
144
  React.createElement("i", { className: isRunning ? "allaw-icon-pause" : "allaw-icon-play", style: { fontSize: "12px", color: "#25BEEB", fontWeight: 800 } })));
145
145
  };
146
146
  export default BillingCount;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "allaw-ui",
3
- "version": "2.5.3",
3
+ "version": "2.5.4",
4
4
  "description": "Composants UI pour l'application Allaw",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",