refactor: cleanup

src/components/widgets/Widgets.jsx

@@ -1,7 +1,5 @@
 import { PureComponent, Fragment, Suspense, lazy } from 'react';
 
-import EventBus from '../../modules/helpers/eventbus';
-
 import Clock from './time/Clock';
 import Greeting from './greeting/Greeting';
 import Quote from './quote/Quote';
@@ -9,6 +7,8 @@ import Search from './search/Search';
 import QuickLinks from './quicklinks/QuickLinks';
 import Date from './time/Date';
 
+import EventBus from '../../modules/helpers/eventbus';
+
 const Weather = lazy(() => import('./weather/Weather'));
 const renderLoader = () => <></>;
 

src/components/widgets/background/Background.jsx

@@ -1,11 +1,11 @@
 // todo: rewrite this mess
 import { PureComponent } from 'react';
 
+import PhotoInformation from './PhotoInformation';
+
 import EventBus from '../../../modules/helpers/eventbus';
 import Interval from '../../../modules/helpers/interval';
 
-import PhotoInformation from './PhotoInformation';
-
 import './scss/index.scss';
 
 export default class Background extends PureComponent {

src/components/widgets/background/Favourite.jsx

@@ -1,14 +1,12 @@
 import { PureComponent } from 'react';
+import { Star, StarBorder } from '@material-ui/icons';
 
 import Tooltip from '../../helpers/tooltip/Tooltip';
 
-import StarIcon from '@material-ui/icons/Star';
-import StarIcon2 from '@material-ui/icons/StarBorder';
-
 export default class Favourite extends PureComponent {
   buttons = {
-    favourited: <StarIcon onClick={() => this.favourite()} className='topicons' />,
-    unfavourited: <StarIcon2 onClick={() => this.favourite()} className='topicons' />
+    favourited: <Star onClick={() => this.favourite()} className='topicons' />,
+    unfavourited: <StarBorder onClick={() => this.favourite()} className='topicons' />
   }
 
   constructor() {

src/components/widgets/background/Maximise.jsx

@@ -1,9 +1,8 @@
 import { PureComponent } from 'react';
+import { Fullscreen } from '@material-ui/icons';
 
 import Tooltip from '../../helpers/tooltip/Tooltip';
 
-import FullscreenIcon from '@material-ui/icons/Fullscreen';
-
 export default class Maximise extends PureComponent {
   constructor() {
     super();
@@ -57,7 +56,7 @@ export default class Maximise extends PureComponent {
   render() {
     return (
       <Tooltip title={window.language.modals.main.settings.sections.background.buttons.view}>
-        <FullscreenIcon onClick={this.maximise} className='topicons' />
+        <Fullscreen onClick={this.maximise} className='topicons' />
       </Tooltip>
     );
   }

src/components/widgets/background/PhotoInformation.jsx

@@ -1,11 +1,5 @@
 import { useState } from 'react';
-
-import Info from '@material-ui/icons/Info';
-import Location from '@material-ui/icons/LocationOn';
-import Camera from '@material-ui/icons/PhotoCamera';
-import Resolution from '@material-ui/icons/Crop';
-import Photographer from '@material-ui/icons/Person';
-import Download from '@material-ui/icons/GetApp';
+import { Info, LocationOn, PhotoCamera, Crop as Resolution, Person as Photographer, GetApp as Download } from '@material-ui/icons';
 
 const toDataURL = async (url) => {
   const res = await fetch(url);
@@ -68,9 +62,9 @@ export default function PhotoInformation(props) {
           <Info className='infoIcon'/>
           <h1>{language.information}</h1>
           <hr/>
-          <Location/>
+          <LocationOn/>
           <span id='infoLocation'>{props.info.location || 'N/A'}</span>
-          <Camera/>
+          <PhotoCamera/>
           <span id='infoCamera'>{props.info.camera || 'N/A'}</span>
           <Resolution/>
           <span id='infoResolution'>{width}x{height}</span>

src/components/widgets/greeting/Greeting.jsx

@@ -1,9 +1,8 @@
 import { PureComponent } from 'react';
-
 import { utcToZonedTime } from 'date-fns-tz';
-import EventBus from '../../../modules/helpers/eventbus';
 
 import dtf from '../../../modules/helpers/date';
+import EventBus from '../../../modules/helpers/eventbus';
 
 import './greeting.scss';
 

src/components/widgets/navbar/Navbar.jsx

@@ -1,9 +1,5 @@
 import { PureComponent } from 'react';
-
-import RefreshIcon from '@material-ui/icons/RefreshRounded';
-import Gear from '@material-ui/icons/SettingsRounded';
-import NotesIcon from '@material-ui/icons/AssignmentRounded';
-import Report from '@material-ui/icons/SmsFailed';
+import { RefreshRounded, SettingsRounded, AssignmentRounded as NotesRounded, SmsFailed as Report } from '@material-ui/icons';
 
 import Notes from './Notes';
 import Maximise from '../background/Maximise';
@@ -33,7 +29,7 @@ export default class Navbar extends PureComponent {
     
         {(localStorage.getItem('notesEnabled') === 'true') ?
           <div className='notes'>
-            <NotesIcon className='topicons'/>
+            <NotesRounded className='topicons'/>
             <Notes/>
           </div>
         : null}
@@ -46,12 +42,12 @@ export default class Navbar extends PureComponent {
   
         {(localStorage.getItem('refresh') === 'true') ?
           <Tooltip title={window.language.widgets.navbar.tooltips.refresh}>
-            <RefreshIcon className='refreshicon topicons' onClick={() => window.location.reload()}/>
+            <RefreshRounded className='refreshicon topicons' onClick={() => window.location.reload()}/>
           </Tooltip>
         : null}
   
         <Tooltip title={window.language.modals.main.navbar.settings}>
-          <Gear className='settings-icon topicons' onClick={() => this.props.openModal('mainModal')}/>
+          <SettingsRounded className='settings-icon topicons' onClick={() => this.props.openModal('mainModal')}/>
         </Tooltip>
       </div>
     );

src/components/widgets/navbar/Notes.jsx

@@ -1,11 +1,6 @@
 import { PureComponent } from 'react';
-
+import { FileCopyRounded, AssignmentRounded as NotesRounded, PushPin }from '@material-ui/icons';
 import TextareaAutosize from '@material-ui/core/TextareaAutosize';
-
-import CopyIcon from '@material-ui/icons/FileCopyRounded';
-import NotesIcon from '@material-ui/icons/AssignmentRounded';
-import Pin from '@material-ui/icons/PushPin';
-
 import { toast } from 'react-toastify';
 
 export default class Notes extends PureComponent {
@@ -57,12 +52,12 @@ export default class Notes extends PureComponent {
     return (
       <span id='noteContainer' className='notescontainer' style={{ visibility: this.state.visibility }}>
         <div className='topbarnotes'>
-          <NotesIcon/>
+          <NotesRounded/>
           <h3>{this.language.title}</h3>
         </div>
         <TextareaAutosize rowsmax={50} placeholder={this.language.placeholder} value={this.state.notes} onChange={this.setNotes}/>
-        <button onClick={() => this.pin()} className='pinNote'><Pin/></button>
-        <button onClick={() => this.copy()} className='copyNote'><CopyIcon/></button>
+        <button onClick={() => this.pin()} className='pinNote'><PushPin/></button>
+        <button onClick={() => this.copy()} className='copyNote'><FileCopyRounded/></button>
       </span>
     );
   }

src/components/widgets/quicklinks/QuickLinks.jsx

@@ -1,10 +1,9 @@
 import { PureComponent } from 'react';
+import Tooltip from '../../helpers/tooltip/Tooltip';
+import { TextareaAutosize } from '@material-ui/core';
 
 import EventBus from '../../../modules/helpers/eventbus';
 
-import Tooltip from '../../helpers/tooltip/Tooltip';
-import TextareaAutosize from '@material-ui/core/TextareaAutosize';
-
 import './quicklinks.scss';
 
 export default class QuickLinks extends PureComponent {
@@ -88,15 +87,9 @@ export default class QuickLinks extends PureComponent {
   }
 
   toggleAdd = () => {
-    if (this.state.showAddLink === 'hidden') {
-      this.setState({
-        showAddLink: 'visible'
-      });
-    } else {
-      this.setState({
-        showAddLink: 'hidden'
-      });
-    }
+    this.setState({
+      showAddLink: (this.state.showAddLink === 'hidden') ? 'visible' : 'hidden'
+    });
   }
 
   // widget zoom
@@ -154,9 +147,9 @@ export default class QuickLinks extends PureComponent {
     }
 
     const tooltipEnabled = localStorage.getItem('quicklinkstooltip');
+    const useProxy = (localStorage.getItem('quicklinksddgProxy') !== 'false');
 
     const quickLink = (item) => {
-      const useProxy = (localStorage.getItem('quicklinksddgProxy') !== 'false');
       const url = useProxy ? 'https://icons.duckduckgo.com/ip2/' : 'https://www.google.com/s2/favicons?sz=32&domain=';
 
       const link = (
@@ -166,7 +159,7 @@ export default class QuickLinks extends PureComponent {
       );
 
       if (tooltipEnabled === 'true') {
-        return <Tooltip title={item.name} key={item.name} draggable={false}>{link}</Tooltip>;
+        return <Tooltip title={item.name}>{link}</Tooltip>;
       } else {
         return link;
       }

src/components/widgets/quote/Quote.jsx

@@ -1,23 +1,18 @@
 import { PureComponent } from 'react';
-
-import EventBus from '../../../modules/helpers/eventbus';
-import Interval from '../../../modules/helpers/interval';
-
-import FileCopy from '@material-ui/icons/FilterNone';
-import TwitterIcon from '@material-ui/icons/Twitter';
-import StarIcon from '@material-ui/icons/Star';
-import StarIcon2 from '@material-ui/icons/StarBorder';
-
+import { FilterNone as FileCopy, Twitter, Star, StarBorder } from '@material-ui/icons';
 import { toast } from 'react-toastify';
 
+import Interval from '../../../modules/helpers/interval';
+import EventBus from '../../../modules/helpers/eventbus';
+
 import './quote.scss';
 
 export default class Quote extends PureComponent {
   buttons = {
-    tweet: <TwitterIcon className='copyButton' onClick={() => this.tweetQuote()} />,
+    tweet: <Twitter className='copyButton' onClick={() => this.tweetQuote()} />,
     copy: <FileCopy className='copyButton' onClick={() => this.copyQuote()} />,
-    unfavourited: <StarIcon2 className='copyButton' onClick={() => this.favourite()} />,
-    favourited: <StarIcon className='copyButton' onClick={() => this.favourite()} />
+    unfavourited: <StarBorder className='copyButton' onClick={() => this.favourite()} />,
+    favourited: <Star className='copyButton' onClick={() => this.favourite()} />
   }
 
   constructor() {

src/components/widgets/search/Search.jsx

@@ -1,11 +1,9 @@
 import { PureComponent } from 'react';
-
-import EventBus from '../../../modules/helpers/eventbus';
+import { Search as SearchIcon, Mic } from '@material-ui/icons';
 
 import AutocompleteInput from '../../helpers/autocomplete/Autocomplete';
 
-import SearchIcon from '@material-ui/icons/Search';
-import MicIcon from '@material-ui/icons/Mic';
+import EventBus from '../../../modules/helpers/eventbus';
 
 import './search.scss';
 
@@ -101,7 +99,7 @@ export default class Search extends PureComponent {
     }
 
     if (localStorage.getItem('voiceSearch') === 'true') {
-      microphone = <MicIcon className='micIcon' onClick={this.startSpeechRecognition}/>;
+      microphone = <Mic className='micIcon' onClick={this.startSpeechRecognition}/>;
     }
 
     let autocompleteURL, autocompleteQuery, autocompleteCallback;

src/components/widgets/time/Clock.jsx

@@ -1,6 +1,6 @@
 import { PureComponent, Suspense, lazy } from 'react';
-
 import { utcToZonedTime } from 'date-fns-tz';
+
 import EventBus from '../../../modules/helpers/eventbus';
 
 import './clock.scss';

src/components/widgets/time/Date.jsx

@@ -1,9 +1,8 @@
 import { PureComponent } from 'react';
-
 import { utcToZonedTime } from 'date-fns-tz';
-import EventBus from '../../../modules/helpers/eventbus';
 
 import dtf from '../../../modules/helpers/date';
+import EventBus from '../../../modules/helpers/eventbus';
 
 import './date.scss';
 

src/components/widgets/weather/Weather.jsx

@@ -1,10 +1,10 @@
 import { PureComponent } from 'react';
-
-import EventBus from '../../../modules/helpers/eventbus';
+import { WiHumidity, WiWindy, WiBarometer, WiCloud } from 'weather-icons-react';
 
 import WeatherIcon from './WeatherIcon';
 import WindDirectionIcon from './WindDirectionIcon';
-import { WiHumidity, WiWindy, WiBarometer, WiCloud } from 'weather-icons-react';
+
+import EventBus from '../../../modules/helpers/eventbus';
 
 import './weather.scss';
 
@@ -133,10 +133,6 @@ export default class Weather extends PureComponent {
       return (localStorage.getItem(setting) === 'true');
     };
 
-    if (enabled('offlineMode')) {
-      return null;
-    }
-
     if (this.state.location === window.language.widgets.weather.not_found) {
       return (<div className='weather'>
         <span className='loc'>{this.state.location}</span>