support millisecond accuracy and minor enhancement

Author: amrlabib

src/useTimer.js

@@ -56,10 +56,25 @@ export default function useTimer(settings) {
     setExpiryTimestamp(newExpiryTimestamp);
   }
 
-  useEffect(() => {
-    if (Validate.expiryTimestamp(expiryTimestamp)) {
+  function handleExtraMilliSeconds(secondsValue, extraMilliSeconds) {
+    setSeconds(Math.floor(secondsValue) + 1);
+    intervalRef.current = setTimeout(() => {
+      intervalRef.current = undefined;
       setSeconds(Time.getSecondsFromExpiry(expiryTimestamp));
       start();
+    }, extraMilliSeconds);
+  }
+
+  useEffect(() => {
+    if (Validate.expiryTimestamp(expiryTimestamp)) {
+      const secondsValue = Time.getSecondsFromExpiry(expiryTimestamp);
+      const extraMilliSeconds = ((secondsValue - Math.floor(secondsValue)) * 1000).toFixed(2);
+      if (extraMilliSeconds > 0) {
+        handleExtraMilliSeconds(secondsValue, extraMilliSeconds);
+      } else {
+        setSeconds(secondsValue);
+        start();
+      }
     }
     return clearIntervalRef;
   }, [expiryTimestamp]);

src/utils/Time.js

@@ -16,8 +16,9 @@ export default class Time {
   static getSecondsFromExpiry(expiry) {
     const now = new Date().getTime();
     const milliSecondsDistance = expiry - now;
-    if (milliSecondsDistance > 0) {
-      return Math.floor(milliSecondsDistance / 1000);
+    const roundedValue = Math.ceil((milliSecondsDistance) / 100) * 100;
+    if (roundedValue > 0) {
+      return roundedValue / 1000;
     }
     return 0;
   }

webpack.dev.js

@@ -33,6 +33,7 @@ module.exports = {
     devServer: {
       contentBase: path.join(__dirname, 'dev-dist'),
       compress: true,
-      port: 9000
+      port: 9000,
+      disableHostCheck: true
     }
 }