Fix Lint Errors

browser/main/lib/ThemeManager.js

@@ -1,4 +1,4 @@
-const chooseTheme = (ui) => {
+const chooseTheme = ui => {
   if (!ui.enableScheduleTheme) {
     return
   }
@@ -11,9 +11,12 @@ const chooseTheme = (ui) => {
 
   const isEndAfterStart = end > start
   const isBetweenStartAndEnd = minutes >= start && minutes <= end
-  const isBetweenEndAndStart = (minutes >= start || minutes <= end)
+  const isBetweenEndAndStart = minutes >= start || minutes <= end
 
-  if ((isEndAfterStart && isBetweenStartAndEnd) || (!isEndAfterStart && isBetweenEndAndStart)) {
+  if (
+    (isEndAfterStart && isBetweenStartAndEnd) ||
+    (!isEndAfterStart && isBetweenEndAndStart)
+  ) {
     if (ui.theme !== ui.scheduledTheme) {
       ui.defaultTheme = ui.theme
       ui.theme = ui.scheduledTheme
@@ -27,8 +30,14 @@ const chooseTheme = (ui) => {
   }
 }
 
-const applyTheme = (theme) => {
+const applyTheme = theme => {
-  const supportedThemes = ['dark', 'white', 'solarized-dark', 'monokai', 'dracula']
+  const supportedThemes = [
+    'dark',
+    'white',
+    'solarized-dark',
+    'monokai',
+    'dracula'
+  ]
   if (supportedThemes.indexOf(theme) !== -1) {
     document.body.setAttribute('data-theme', theme)
   } else {

browser/main/modals/PreferencesModal/UiTab.js

@@ -242,8 +242,9 @@ class UiTab extends React.Component {
     const rangeBullet = document.getElementById(bulletID)
 
     if (rangeSlider && rangeBullet) {
-      const bulletPosition = (rangeSlider.value / rangeSlider.max)
+      const bulletPosition = rangeSlider.value / rangeSlider.max
-      rangeBullet.style.left = (bulletPosition * 574) + 6 * (1 - bulletPosition) + 'px'
+      rangeBullet.style.left =
+        bulletPosition * 574 + 6 * (1 - bulletPosition) + 'px'
     }
 
     if (e) {
@@ -274,8 +275,9 @@ class UiTab extends React.Component {
               {i18n.__('Interface Theme')}
             </div>
             <div styleName='group-section-control'>
-              <select value={config.ui.defaultTheme}
+              <select
-                onChange={(e) => this.handleUIChange(e)}
+                value={config.ui.defaultTheme}
+                onChange={e => this.handleUIChange(e)}
                 ref='uiTheme'
               >
                 <optgroup label='Light Themes'>
@@ -305,16 +307,16 @@ class UiTab extends React.Component {
               </select>
             </div>
           </div>
-          <div styleName='group-header2'>
+          <div styleName='group-header2'>{i18n.__('Theme Schedule')}</div>
-            {i18n.__('Theme Schedule')}
-          </div>
           <div styleName='group-checkBoxSection'>
             <label>
-              <input onChange={(e) => this.handleUIChange(e)}
+              <input
+                onChange={e => this.handleUIChange(e)}
                 checked={this.state.config.ui.enableScheduleTheme}
                 ref='enableScheduleTheme'
                 type='checkbox'
-              />&nbsp;
+              />
+              &nbsp;
               {i18n.__('Enable Scheduled Themes')}
             </label>
           </div>
@@ -323,8 +325,9 @@ class UiTab extends React.Component {
               {i18n.__('Scheduled Theme')}
             </div>
             <div styleName='group-section-control'>
-              <select value={config.ui.scheduledTheme}
+              <select
-                onChange={(e) => this.handleUIChange(e)}
+                value={config.ui.scheduledTheme}
+                onChange={e => this.handleUIChange(e)}
                 ref='uiScheduledTheme'
               >
                 <optgroup label='Light Themes'>
@@ -357,17 +360,42 @@ class UiTab extends React.Component {
           <div styleName='group-section'>
             <div styleName='container'>
               <div styleName='range-slider' id='firstRow'>
-                <span id='rs-bullet-1' styleName='rs-label'>{`End: ${this.formatTime(config.ui.scheduleEnd)}`}</span>
+                <span
-                <input id='rs-range-line-1' styleName='rs-range' type='range' value={config.ui.scheduleEnd} min='0' max='1440' step='5' ref='scheduleEnd'
+                  id='rs-bullet-1'
-                  onChange={(e) => this.handleSlider(e, 1)} />
+                  styleName='rs-label'
+                >{`End: ${this.formatTime(config.ui.scheduleEnd)}`}</span>
+                <input
+                  id='rs-range-line-1'
+                  styleName='rs-range'
+                  type='range'
+                  value={config.ui.scheduleEnd}
+                  min='0'
+                  max='1440'
+                  step='5'
+                  ref='scheduleEnd'
+                  onChange={e => this.handleSlider(e, 1)}
+                />
               </div>
               <div styleName='range-slider' id='secondRow'>
-                <span id='rs-bullet-2' styleName='rs-label'>{`Start: ${this.formatTime(config.ui.scheduleStart)}`}</span>
+                <span
-                <input id='rs-range-line-2' styleName='rs-range' type='range' value={config.ui.scheduleStart} min='0' max='1440' step='5' ref='scheduleStart'
+                  id='rs-bullet-2'
-                  onChange={(e) => this.handleSlider(e, 2)} />
+                  styleName='rs-label'
+                >{`Start: ${this.formatTime(config.ui.scheduleStart)}`}</span>
+                <input
+                  id='rs-range-line-2'
+                  styleName='rs-range'
+                  type='range'
+                  value={config.ui.scheduleStart}
+                  min='0'
+                  max='1440'
+                  step='5'
+                  ref='scheduleStart'
+                  onChange={e => this.handleSlider(e, 2)}
+                />
               </div>
               <div styleName='box-minmax'>
-                <span>00:00</span><span>24:00</span>
+                <span>00:00</span>
+                <span>24:00</span>
               </div>
             </div>
           </div>

tests/lib/themeManager-test.js

@@ -26,7 +26,7 @@ test.afterEach(t => {
   global.Date = originalDate
 })
 
-test('enableScheduleTheme is false, theme shouldn\'t change', t => {
+test("enableScheduleTheme is false, theme shouldn't change", t => {
   t.context.enableScheduleTheme = false
 
   const beforeTheme = t.context.theme
@@ -37,7 +37,7 @@ test('enableScheduleTheme is false, theme shouldn\'t change', t => {
 })
 
 // NOT IN SCHEDULE
-test('scheduleEnd is bigger than scheduleStart and not in schedule, theme shouldn\'t change', t => {
+test("scheduleEnd is bigger than scheduleStart and not in schedule, theme shouldn't change", t => {
   const beforeTheme = t.context.defaultTheme
   t.context.scheduleStart = 720 // 12:00
   t.context.scheduleEnd = 870 // 14:30
@@ -47,7 +47,7 @@ test('scheduleEnd is bigger than scheduleStart and not in schedule, theme should
   t.is(afterTheme, beforeTheme)
 })
 
-test('scheduleStart is bigger than scheduleEnd and not in schedule, theme shouldn\'t change', t => {
+test("scheduleStart is bigger than scheduleEnd and not in schedule, theme shouldn't change", t => {
   const beforeTheme = t.context.defaultTheme
   t.context.scheduleStart = 960 // 16:00
   t.context.scheduleEnd = 600 // 10:00
@@ -78,7 +78,7 @@ test('scheduleStart is bigger than scheduleEnd and in schedule, theme should cha
   t.is(afterTheme, beforeTheme)
 })
 
-test('theme to apply is not a supported theme, theme shouldn\'t change', t => {
+test("theme to apply is not a supported theme, theme shouldn't change", t => {
   applyTheme('notATheme')
   const afterTheme = document.body.dataset.theme