allaw-ui 2.0.5 → 2.0.7

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 (5) hide show
  1. package/dist/components/molecules/billingCount/BillingCount.js +48 -49
  2. package/dist/components/molecules/stepper/ConfirmationModal.js +6 -1
  3. package/dist/components/molecules/stepper/Stepper.js +13 -1
  4. package/dist/stories/Header.stories.d.ts +3 -3
  5. package/package.json +1 -1
package/dist/components/molecules/billingCount/BillingCount.js CHANGED
@@ -1,54 +1,33 @@
1
1
  import React, { useEffect, useState, useRef } from "react";
2
- import { differenceInSeconds } from "date-fns";
3
2
  import "./BillingCount.css";
4
3
  var LOCAL_STORAGE_KEYS = {
5
4
  START_TIME: "startTimeBilling",
6
5
  ELAPSED_TIME: "elapsedTime",
6
+ IS_RUNNING: "isRunning",
7
7
  };
8
8
  var BillingCount = function (_a) {
9
9
  var onEnd = _a.onEnd, setIsStarted = _a.setIsStarted, pauseTimer = _a.pauseTimer, resetTimer = _a.resetTimer;
10
10
  var _b = useState(0), time = _b[0], setTime = _b[1];
11
11
  var _c = useState(false), isPaused = _c[0], setIsPaused = _c[1];
12
12
  var _d = useState(false), isRunning = _d[0], setIsRunning = _d[1];
13
- var intervalRef = useRef(null);
14
- var startTimeRef = useRef(null);
15
13
  var _e = useState(false), isInitialized = _e[0], setIsInitialized = _e[1];
14
+ var intervalRef = useRef(null);
16
15
  useEffect(function () {
17
16
  setIsInitialized(true);
18
17
  }, []);
19
- var updateElapsedTime = function (elapsedTime) {
20
- localStorage.setItem(LOCAL_STORAGE_KEYS.ELAPSED_TIME, elapsedTime.toString());
21
- };
22
- var clearTimerData = function () {
23
- localStorage.removeItem(LOCAL_STORAGE_KEYS.START_TIME);
24
- localStorage.removeItem(LOCAL_STORAGE_KEYS.ELAPSED_TIME);
25
- };
26
- var getSavedElapsedTime = function () {
27
- return parseInt(localStorage.getItem(LOCAL_STORAGE_KEYS.ELAPSED_TIME) || "0", 10);
28
- };
29
- var getCurrentElapsedTime = function () {
30
- var savedStartTime = localStorage.getItem(LOCAL_STORAGE_KEYS.START_TIME);
31
- if (savedStartTime) {
32
- var startTime = new Date(savedStartTime);
33
- var elapsedSinceStart = differenceInSeconds(new Date(), startTime);
34
- return elapsedSinceStart + getSavedElapsedTime();
35
- }
36
- return getSavedElapsedTime();
37
- };
38
18
  useEffect(function () {
39
19
  setTime(getSavedElapsedTime());
40
20
  }, []);
41
21
  useEffect(function () {
42
22
  if (!isInitialized)
43
23
  return;
44
- if (resetTimer) {
24
+ if (resetTimer)
45
25
  setTime(0);
46
- setIsPaused(false);
47
- setIsRunning(false);
48
- clearTimerData();
49
- if (intervalRef.current) {
50
- clearInterval(intervalRef.current);
51
- }
26
+ setIsPaused(false);
27
+ setIsRunning(false);
28
+ clearTimerData();
29
+ if (intervalRef.current) {
30
+ clearInterval(intervalRef.current);
52
31
  }
53
32
  else if (pauseTimer) {
54
33
  pauseTimerHandler();
@@ -59,15 +38,17 @@ var BillingCount = function (_a) {
59
38
  }, [resetTimer]);
60
39
  useEffect(function () {
61
40
  if (isRunning && !isPaused) {
62
- startTimeRef.current = new Date();
63
41
  intervalRef.current = setInterval(function () {
64
- setTime(getCurrentElapsedTime());
42
+ setTime(function (prevTime) {
43
+ var newElapsedTime = prevTime + 1;
44
+ updateElapsedTime(newElapsedTime);
45
+ return newElapsedTime;
46
+ });
65
47
  }, 1000);
66
48
  }
67
- else {
68
- if (intervalRef.current) {
69
- clearInterval(intervalRef.current);
70
- }
49
+ else if (intervalRef.current) {
50
+ clearInterval(intervalRef.current);
51
+ intervalRef.current = null;
71
52
  }
72
53
  return function () {
73
54
  if (intervalRef.current)
@@ -87,27 +68,44 @@ var BillingCount = function (_a) {
87
68
  pauseTimerHandler();
88
69
  }
89
70
  }, [pauseTimer, resetTimer]);
71
+ // Gestion de reprise de chrono en cas de refresh de page
90
72
  useEffect(function () {
91
- if (isRunning && !isPaused) {
92
- intervalRef.current = setInterval(function () {
93
- var elapsed = getCurrentElapsedTime();
94
- setTime(elapsed);
95
- updateElapsedTime(elapsed); // Mise à jour régulière du localStorage
96
- }, 1000);
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);
97
79
  }
98
80
  else {
99
- if (intervalRef.current) {
100
- clearInterval(intervalRef.current);
101
- }
81
+ setIsRunning(false);
82
+ setIsStarted && setIsStarted(false);
102
83
  }
103
- return function () {
104
- if (intervalRef.current)
105
- clearInterval(intervalRef.current);
106
- };
107
- }, [isRunning, isPaused]);
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();
102
+ }
103
+ return getSavedElapsedTime();
104
+ };
108
105
  var startTimerHandler = function () {
109
106
  if (!isRunning) {
110
107
  localStorage.setItem(LOCAL_STORAGE_KEYS.START_TIME, new Date().toISOString());
108
+ localStorage.setItem(LOCAL_STORAGE_KEYS.IS_RUNNING, "true");
111
109
  setTime(getSavedElapsedTime());
112
110
  setIsRunning(true);
113
111
  setIsStarted && setIsStarted(true);
@@ -117,6 +115,7 @@ var BillingCount = function (_a) {
117
115
  if (isRunning) {
118
116
  var elapsed = getCurrentElapsedTime();
119
117
  updateElapsedTime(elapsed);
118
+ localStorage.setItem(LOCAL_STORAGE_KEYS.IS_RUNNING, "false");
120
119
  setTime(elapsed);
121
120
  setIsRunning(false);
122
121
  setIsStarted && setIsStarted(false);
package/dist/components/molecules/stepper/ConfirmationModal.js CHANGED
@@ -6,9 +6,14 @@ import Heading from "../../atoms/typography/Heading";
6
6
  import Paragraph from "../../atoms/typography/Paragraph";
7
7
  var ConfirmationModal = function (_a) {
8
8
  var show = _a.show, title = _a.title, description = _a.description, confirmLabel = _a.confirmLabel, cancelLabel = _a.cancelLabel, onConfirm = _a.onConfirm, onCancel = _a.onCancel, _b = _a.isDanger, isDanger = _b === void 0 ? false : _b;
9
+ var handleOutsideClick = function (e) {
10
+ if (e.target === e.currentTarget) {
11
+ onCancel();
12
+ }
13
+ };
9
14
  if (!show)
10
15
  return null;
11
- return (React.createElement("div", { className: "confirmation-modal" },
16
+ return (React.createElement("div", { className: "confirmation-modal", onClick: handleOutsideClick },
12
17
  React.createElement("div", { className: "confirmation-modal-content" },
13
18
  React.createElement("div", { className: "confirmation-modal-heading-wrapper" },
14
19
  React.createElement(Heading, { text: title, variant: "h4", color: "noir", align: "left" })),
package/dist/components/molecules/stepper/Stepper.js CHANGED
@@ -101,9 +101,21 @@ var Stepper = function (_a) {
101
101
  }, [onClose]);
102
102
  var handleMouseDown = useCallback(function (e) {
103
103
  var selectList = document.querySelector('[class*="selectList"]');
104
+ var datepickerElements = document.querySelectorAll([
105
+ ".datepicker-portal",
106
+ ".react-datepicker",
107
+ ".react-datepicker__month-container",
108
+ ".react-datepicker__header",
109
+ ".react-datepicker__day",
110
+ ".react-datepicker__current-month",
111
+ ".react-datepicker__month-dropdown",
112
+ ".react-datepicker__year-dropdown",
113
+ ].join(","));
114
+ var isClickOnDatepicker = Array.from(datepickerElements).some(function (element) { return element === null || element === void 0 ? void 0 : element.contains(e.target); });
104
115
  if (stepperContainerRef.current &&
105
116
  !stepperContainerRef.current.contains(e.target) &&
106
- !(selectList === null || selectList === void 0 ? void 0 : selectList.contains(e.target))) {
117
+ !(selectList === null || selectList === void 0 ? void 0 : selectList.contains(e.target)) &&
118
+ !isClickOnDatepicker) {
107
119
  handleClose();
108
120
  }
109
121
  }, [handleClose]);
package/dist/stories/Header.stories.d.ts CHANGED
@@ -7,9 +7,9 @@ declare const meta: {
7
7
  layout: string;
8
8
  };
9
9
  args: {
10
- onLogin: import("@vitest/spy").Mock<[], void>;
11
- onLogout: import("@vitest/spy").Mock<[], void>;
12
- onCreateAccount: import("@vitest/spy").Mock<[], void>;
10
+ onLogin: import("@vitest/spy").Mock<(...args: any[]) => any>;
11
+ onLogout: import("@vitest/spy").Mock<(...args: any[]) => any>;
12
+ onCreateAccount: import("@vitest/spy").Mock<(...args: any[]) => any>;
13
13
  };
14
14
  };
15
15
  export default meta;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "allaw-ui",
3
- "version": "2.0.5",
3
+ "version": "2.0.7",
4
4
  "description": "Composants UI pour l'application Allaw",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",