fix(timer): issue about incorrect timer when the app is hidden

The timer is pretty accurate when the app is visible. But when it is hidden, the timer goes wrong when you open it again for a while. Fixed issue #67
zidoro · May 21, 2020 · da913eb · da913eb
1 parent 06ec0a2
commit da913eb
Show file tree

Hide file tree

Showing 17 changed files with 226 additions and 201 deletions.
diff --git a/app/electron/electron.ts b/app/electron/electron.ts
@@ -38,6 +38,7 @@ function createMainWindow() {
     webPreferences: {
       contextIsolation: true,
       enableRemoteModule: false,
+      backgroundThrottling: false,
       preload: path.join(__dirname, "preload.js"),
     },
   });

diff --git a/app/package.json b/app/package.json
@@ -77,41 +77,41 @@
   },
   "dependencies": {
     "autosize": "^4.0.2",
-    "electron-log": "^4.1.2",
+    "electron-log": "^4.1.3",
     "electron-updater": "^4.3.1",
     "is-electron": "^2.2.0",
     "react": "^16.13.1",
     "react-beautiful-dnd": "^13.0.0",
     "react-dom": "^16.13.1",
     "react-markdown": "^4.3.1",
     "react-redux": "^7.2.0",
-    "react-router-dom": "^5.1.2",
+    "react-router-dom": "^5.2.0",
     "react-scripts": "^3.4.1",
     "redux": "^4.0.5",
     "redux-devtools-extension": "^2.13.8",
     "styled-components": "^5.1.0",
-    "uuid": "^8.0.0",
+    "uuid": "^8.1.0",
     "v8-compile-cache": "^2.1.0"
   },
   "devDependencies": {
     "@semantic-release/changelog": "^5.0.1",
     "@semantic-release/git": "^9.0.0",
     "@types/autosize": "^3.0.7",
-    "@types/jest": "^25.2.1",
-    "@types/node": "^13.13.4",
-    "@types/react": "^16.9.34",
+    "@types/jest": "^25.2.3",
+    "@types/node": "^14.0.4",
+    "@types/react": "^16.9.35",
     "@types/react-beautiful-dnd": "^12.1.2",
     "@types/react-dom": "^16.9.7",
     "@types/react-redux": "^7.1.7",
     "@types/react-router-dom": "^5.1.5",
     "@types/styled-components": "^5.1.0",
-    "@types/uuid": "^7.0.3",
-    "electron": "^8.2.5",
-    "electron-builder": "^22.6.0",
+    "@types/uuid": "^8.0.0",
+    "electron": "^9.0.0",
+    "electron-builder": "^22.6.1",
     "prettier": "^2.0.5",
     "say": "^0.16.0",
     "semantic-release": "^17.0.7",
-    "typescript": "^3.8.3"
+    "typescript": "^3.9.3"
   },
   "browserslist": {
     "production": [

diff --git a/app/public/electron.js b/app/public/electron.js
@@ -28,6 +28,7 @@ function createMainWindow() {
         webPreferences: {
             contextIsolation: true,
             enableRemoteModule: false,
+            backgroundThrottling: false,
             preload: path_1.default.join(__dirname, "preload.js"),
         },
     });

diff --git a/app/public/functions/autoUpdater.js b/app/public/functions/autoUpdater.js
@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.activateAutoUpdate = void 0;
 var electron_updater_1 = require("electron-updater");
 var electron_log_1 = __importDefault(require("electron-log"));
 function activateAutoUpdate(_a) {

diff --git a/app/public/functions/blockShortcutKeys.js b/app/public/functions/blockShortcutKeys.js
@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.blockShortcutKeys = void 0;
 var electron_1 = require("electron");
 function blockShortcutKeys(window, shortcutKeys) {
     window.on("focus", function () {

diff --git a/app/public/functions/createSystemTray.js b/app/public/functions/createSystemTray.js
@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.createSystemTray = void 0;
 var electron_1 = require("electron");
 var tray;
 function createSystemTray(_a) {

diff --git a/app/public/functions/globalShortcuts.js b/app/public/functions/globalShortcuts.js
@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.activateGlobalShortcuts = void 0;
 var electron_1 = require("electron");
 function activateGlobalShortcuts(shortcuts) {
     shortcuts.map(function (_a) {

diff --git a/app/public/functions/hostBlocker.js b/app/public/functions/hostBlocker.js
@@ -43,6 +43,7 @@ var __spreadArrays = (this && this.__spreadArrays) || function () {
     return r;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.unBlockWebsiteList = exports.blockWebsiteList = void 0;
 var helpers_1 = require("../helpers");
 // TODO: run ` ipconfig /flushdns` for Windows if doesn't work
 function blockWebsiteList(domains) {

diff --git a/app/public/functions/index.js b/app/public/functions/index.js
@@ -1,10 +1,17 @@
 "use strict";
-function __export(m) {
-    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
-}
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-__export(require("./blockShortcutKeys"));
-__export(require("./globalShortcuts"));
-__export(require("./createSystemTray"));
-__export(require("./autoUpdater"));
-__export(require("./hostBlocker"));
+__exportStar(require("./blockShortcutKeys"), exports);
+__exportStar(require("./globalShortcuts"), exports);
+__exportStar(require("./createSystemTray"), exports);
+__exportStar(require("./autoUpdater"), exports);
+__exportStar(require("./hostBlocker"), exports);
diff --git a/app/public/helpers/constants.js b/app/public/helpers/constants.js
@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.BLOCKER = exports.UPDATES = exports.ACTIONS = exports.CHANNELS = void 0;
 var CHANNELS;
 (function (CHANNELS) {
     CHANNELS["TO_MAIN"] = "TO_MAIN";

diff --git a/app/public/helpers/findBlockerIndexes.js b/app/public/helpers/findBlockerIndexes.js
@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.findBlockerIndexes = void 0;
 var constants_1 = require("./constants");
 function findBlockerIndexes(hosts) {
     var positions = { start: -1, end: -1 };

diff --git a/app/public/helpers/index.js b/app/public/helpers/index.js
@@ -1,10 +1,17 @@
 "use strict";
-function __export(m) {
-    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
-}
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-__export(require("./constants"));
-__export(require("./isWindow"));
-__export(require("./readHostsFile"));
-__export(require("./writeHostsFile"));
-__export(require("./findBlockerIndexes"));
+__exportStar(require("./constants"), exports);
+__exportStar(require("./isWindow"), exports);
+__exportStar(require("./readHostsFile"), exports);
+__exportStar(require("./writeHostsFile"), exports);
+__exportStar(require("./findBlockerIndexes"), exports);
diff --git a/app/public/helpers/isWindow.js b/app/public/helpers/isWindow.js
@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.HOSTS_FILE_PATH = exports.EndOfLine = exports.isWindow = void 0;
 exports.isWindow = function () { return process.platform === "win32"; };
 exports.EndOfLine = exports.isWindow() ? "\r\n" : "\n";
 exports.HOSTS_FILE_PATH = exports.isWindow()

diff --git a/app/public/helpers/readHostsFile.js b/app/public/helpers/readHostsFile.js
@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.readHostsFile = void 0;
 var fs_1 = __importDefault(require("fs"));
 var _1 = require(".");
 function readHostsFile() {

diff --git a/app/public/helpers/writeHostsFile.js b/app/public/helpers/writeHostsFile.js
@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.writeHostsFile = void 0;
 var fs_1 = __importDefault(require("fs"));
 var _1 = require(".");
 function writeHostsFile(content) {

diff --git a/app/src/contexts/CounterContext.tsx b/app/src/contexts/CounterContext.tsx
@@ -205,104 +205,94 @@ const CounterProvider: React.FC = ({ children }) => {
       interval = setInterval(() => {
         counter--;
         setCount(counter);
-        if (counter === 60) {
-          if (timerType === SHORT_BREAK) {
-            notification(
-              "60 Seconds Left for Short Break",
-              { body: "Please prepare yourself getting  back to work." },
-              sixtySecondsLeftShortBreak
-            );
-          } else if (timerType === LONG_BREAK) {
+      }, 1000);
+    }
+
+    return () => clearInterval(interval);
+  }, [count, playing]);
+
+  useEffect(() => {
+    if (count === 60) {
+      if (timerType === SHORT_BREAK) {
+        notification(
+          "60 Seconds Left for Short Break",
+          { body: "Please prepare yourself getting  back to work." },
+          sixtySecondsLeftShortBreak
+        );
+      } else if (timerType === LONG_BREAK) {
+        notification(
+          "60 Seconds Left for Long Break",
+          { body: "Please prepare yourself getting  back to work." },
+          sixtySecondsLeftLongBreak
+        );
+      } else if (timerType === SPECIAL_BREAK) {
+        notification(
+          "60 Seconds Left for Special Break",
+          { body: "Please prepare yourself getting  back to work." },
+          sixtySecondsLeftSpecialBreak
+        );
+      }
+    }
+
+    if (count === 30 && timerType === STAY_FOCUS) {
+      notification(
+        "30 Seconds Left to Work",
+        { body: "Please pause all media playing if there's one." },
+        thirtySecondsLeftToWork
+      );
+    }
+
+    if (count === 0) {
+      switch (timerType) {
+        case STAY_FOCUS:
+          if (round < sessionRounds) {
+            dispatch(setTimerType("SHORT_BREAK"));
             notification(
-              "60 Seconds Left for Long Break",
-              { body: "Please prepare yourself getting  back to work." },
-              sixtySecondsLeftLongBreak
+              "Work Time Finished",
+              { body: "It is time to take a short break." },
+              shortBreakStart
             );
-          } else if (timerType === SPECIAL_BREAK) {
+          } else {
+            dispatch(setTimerType("LONG_BREAK"));
             notification(
-              "60 Seconds Left for Special Break",
-              { body: "Please prepare yourself getting  back to work." },
-              sixtySecondsLeftSpecialBreak
+              "Session Rounds Completed",
+              { body: "It is time to take a long break." },
+              longBreakStart
             );
           }
-        }
+          break;
 
-        // Added 1 second due to notification delay
-        if (counter === 30 && timerType === STAY_FOCUS) {
+        case SHORT_BREAK:
+          dispatch(setTimerType("STAY_FOCUS"));
+          dispatch(setRound(round + 1));
           notification(
-            "30 Seconds Left to Work",
-            { body: "Please pause all media playing if there's one." },
-            thirtySecondsLeftToWork
+            "Short Break Finished",
+            { body: "It is time to focus and work again." },
+            shortBreakFinished
           );
-        }
-
-        if (counter === 0) {
-          switch (timerType) {
-            case STAY_FOCUS:
-              if (round < sessionRounds) {
-                dispatch(setTimerType("SHORT_BREAK"));
-                notification(
-                  "Work Time Finished",
-                  { body: "It is time to take a short break." },
-                  shortBreakStart
-                );
-              } else {
-                dispatch(setTimerType("LONG_BREAK"));
-                notification(
-                  "Session Rounds Completed",
-                  { body: "It is time to take a long break." },
-                  longBreakStart
-                );
-              }
-              break;
-
-            case SHORT_BREAK:
-              dispatch(setTimerType("STAY_FOCUS"));
-              dispatch(setRound(round + 1));
-              notification(
-                "Short Break Finished",
-                { body: "It is time to focus and work again." },
-                shortBreakFinished
-              );
-              break;
+          break;
 
-            case LONG_BREAK:
-              dispatch(setTimerType("STAY_FOCUS"));
-              dispatch(setRound(1));
-              notification(
-                "Long Break Finished",
-                { body: "It is time to focus and work again." },
-                longBreakFinished
-              );
-              break;
+        case LONG_BREAK:
+          dispatch(setTimerType("STAY_FOCUS"));
+          dispatch(setRound(1));
+          notification(
+            "Long Break Finished",
+            { body: "It is time to focus and work again." },
+            longBreakFinished
+          );
+          break;
 
-            case SPECIAL_BREAK:
-              dispatch(setTimerType("STAY_FOCUS"));
-              notification(
-                "Special Break Finished",
-                { body: "It is time to focus and work again." },
-                specialBreakFinished
-              );
-              break;
-          }
-          return clearInterval(interval);
-        }
-      }, 1000);
+        case SPECIAL_BREAK:
+          dispatch(setTimerType("STAY_FOCUS"));
+          notification(
+            "Special Break Finished",
+            { body: "It is time to focus and work again." },
+            specialBreakFinished
+          );
+          break;
+      }
     }
-
-    return () => clearInterval(interval);
-  }, [
-    playing,
-    count,
-    round,
-    sessionRounds,
-    shortBreak,
-    longBreak,
-    timerType,
-    dispatch,
-    duration,
-    notification,
-  ]);
+  }, [count, dispatch, notification, round, sessionRounds, timerType]);
 
   return (
     <CounterContext.Provider