Refactor

Author: hovancik

app/preferences-preload.mjs

@@ -1,8 +1,9 @@
-import { exposeElectronApi, exposeGlobal, exposeI18next, exposeProcess, exposeSettings, exposeStretchly } from './utils/context-bridge-exposers.js'
+import { exposeElectronApi, exposeGlobal, exposeI18next, exposeProcess, exposeSettings, exposeStretchly, exposeUtils } from './utils/context-bridge-exposers.js'
 
 exposeElectronApi()
 exposeGlobal()
 exposeI18next()
 exposeProcess()
 exposeSettings()
 exposeStretchly()
+exposeUtils()

app/preferences-renderer.js

@@ -81,7 +81,7 @@ window.onload = async (e) => {
       const output = range.closest('div').querySelector('output')
       range.value = settings[range.name] / divisor
       const unit = output.dataset.unit
-      output.innerHTML = await formatUnitAndValue(unit, range.value)
+      output.innerHTML = await window.utils.formatUnitAndValue(unit, range.value)
       document.querySelector('#longBreakEvery').closest('div').querySelector('output')
         .innerHTML = await window.i18next.t('utils.minutes', { count: parseInt(realBreakInterval()) })
     })
@@ -205,18 +205,18 @@ window.onload = async (e) => {
     const output = range.closest('div').querySelector('output')
     range.value = settings[range.name] / divisor
     const unit = output.dataset.unit
-    output.innerHTML = await formatUnitAndValue(unit, range.value)
+    output.innerHTML = await window.utils.formatUnitAndValue(unit, range.value)
     document.querySelector('#longBreakEvery').closest('div').querySelector('output')
       .innerHTML = await window.i18next.t('utils.minutes', { count: parseInt(realBreakInterval()) })
     if (!eventsAttached) {
       range.onchange = async event => {
-        output.innerHTML = await formatUnitAndValue(unit, range.value)
+        output.innerHTML = await window.utils.formatUnitAndValue(unit, range.value)
         document.querySelector('#longBreakEvery').closest('div').querySelector('output')
           .innerHTML = await window.i18next.t('utils.minutes', { count: parseInt(realBreakInterval()) })
         window.settings.saveSettings(range.name, range.value * divisor)
       }
       range.oninput = async event => {
-        output.innerHTML = await formatUnitAndValue(unit, range.value)
+        output.innerHTML = await window.utils.formatUnitAndValue(unit, range.value)
         document.querySelector('#longBreakEvery').closest('div').querySelector('output')
           .innerHTML = await window.i18next.t('utils.minutes', { count: parseInt(realBreakInterval()) })
       }
@@ -321,22 +321,4 @@ window.onload = async (e) => {
     const breakInterval = document.querySelector('#longBreakEvery').value * 1
     return microbreakInterval * (breakInterval + 1)
   }
-
-  // TODO take out and test
-  async function formatUnitAndValue (unit, value) {
-    if (unit === 'seconds') {
-      if (value < 60) {
-        return await window.i18next.t('utils.seconds', { count: parseInt(value) })
-      } else {
-        const val = parseFloat(value / 60).toFixed(1)
-        if (val % 1 === 0) {
-          return await window.i18next.t('utils.minutes', { count: parseInt(val) })
-        } else {
-          return await window.i18next.t('utils.minutes', { count: parseFloat(val) })
-        }
-      }
-    } else {
-      return await window.i18next.t(`utils.${unit}`, { count: parseInt(value) })
-    }
-  }
 }

app/utils/context-bridge-exposers.js

@@ -94,14 +94,17 @@ function exposeStretchly () {
 }
 
 function exposeUtils () {
+  const i18n = {
+    t: (key, options) => ipcRenderer.invoke('i18next-translate', key, options)
+  }
   contextBridge.exposeInMainWorld('utils', {
     formatKeyboardShortcut: utils.formatKeyboardShortcut,
     formatTimeRemaining: async (milliseconds, locale) => {
-      const i18n = {
-        t: (key, options) => ipcRenderer.invoke('i18next-translate', key, options)
-      }
       return utils.formatTimeRemaining(milliseconds, locale, i18n, humanizeDuration)
     },
+    formatUnitAndValue: (unit, value) => {
+      return utils.formatUnitAndValue(unit, value, i18n)
+    },
     shouldShowNotificationTitle: (platform, systemVersion) => {
       return utils.shouldShowNotificationTitle(platform, systemVersion, semver)
     },

app/utils/utils.js

@@ -20,6 +20,23 @@ function formatTimeIn (milliseconds, locale, i18next, humanizeDuration) {
   })
 }
 
+function formatUnitAndValue (unit, value, i18next) {
+  if (unit === 'seconds') {
+    if (value < 60) {
+      return i18next.t('utils.seconds', { count: parseInt(value) })
+    } else {
+      const val = parseFloat(value / 60).toFixed(1)
+      if (val % 1 === 0) {
+        return i18next.t('utils.minutes', { count: parseInt(val) })
+      } else {
+        return i18next.t('utils.minutes', { count: parseFloat(val) })
+      }
+    }
+  } else {
+    return i18next.t(`utils.${unit}`, { count: parseInt(value) })
+  }
+}
+
 // does not consider `postponesLimit`
 function canPostpone (postpone, passedPercent, postponePercent) {
   return postpone && passedPercent <= postponePercent
@@ -56,6 +73,7 @@ function insideFlatpak () {
 export {
   formatTimeRemaining,
   formatTimeIn,
+  formatUnitAndValue,
   canPostpone,
   canSkip,
   formatKeyboardShortcut,

test/utils.js

@@ -1,4 +1,4 @@
-import { formatTimeRemaining, formatTimeIn, canSkip, canPostpone, formatKeyboardShortcut, minutesRemaining, shouldShowNotificationTitle } from '../app/utils/utils'
+import { formatTimeRemaining, formatTimeIn, canSkip, canPostpone, formatKeyboardShortcut, minutesRemaining, shouldShowNotificationTitle, formatUnitAndValue } from '../app/utils/utils'
 import { beforeAll, afterAll, vi } from 'vitest'
 import 'chai/register-should'
 import i18next from 'i18next'
@@ -53,6 +53,19 @@ describe('Times formatters', function () {
     formatTimeIn(7200000, 'en', i18next, humanizeDuration).should.equal('in about 2 hours')
     formatTimeIn(7260000, 'en', i18next, humanizeDuration).should.equal('in about 2 hours 1 minute')
   })
+
+  it('formats unit and value correctly', function () {
+    formatUnitAndValue('seconds', 30, i18next).should.equal('30 seconds')
+    formatUnitAndValue('seconds', 1, i18next).should.equal('1 second')
+    formatUnitAndValue('seconds', 60, i18next).should.equal('1 minute')
+    formatUnitAndValue('seconds', 120, i18next).should.equal('2 minutes')
+    formatUnitAndValue('seconds', 90, i18next).should.equal('1.5 minutes')
+    formatUnitAndValue('seconds', 150, i18next).should.equal('2.5 minutes')
+    formatUnitAndValue('minutes', 5, i18next).should.equal('5 minutes')
+    formatUnitAndValue('minutes', 1, i18next).should.equal('1 minute')
+    formatUnitAndValue('hours', 2, i18next).should.equal('2 hours')
+    formatUnitAndValue('hours', 1, i18next).should.equal('1 hour')
+  })
 })
 
 describe('Others', () => {