refactor(structure): New components system

.env

@@ -1,11 +1,11 @@
-// API URLs
+# API URLs
 API_URL=https://api.muetab.com/v2
 SPONSORS_URL=https://sponsors.muetab.com
 GITHUB_URL=https://api.github.com
 DDG_IMAGE_PROXY=https://external-content.duckduckgo.com/iu/?u=
 OPENSTREETMAP_URL=https://www.openstreetmap.org
 
-// Mue URLs
+# Mue URLs
 WEBSITE_URL=https://muetab.com
 PRIVACY_URL=https://muetab.com/privacy
 BLOG_POST=https://blog.muetab.com/posts/version-7-0
@@ -17,7 +17,7 @@ DONATE_LINK=https://muetab.com/donate
 SENTRY_DSN =https://430352fd4b174d688ebd82fc85c22c58@o1217438.ingest.sentry.io/6359480
 KNOWLEDGEBASE=https://support.muetab.com
 
-// Mue Info
+# Mue Info
 ORG_NAME=mue
 REPO_NAME=mue
 EMAIL=hello@muetab.com

scripts/updatetranslations.js

@@ -20,20 +20,20 @@ const compareAndRemoveKeys = (json1, json2) => {
   }
 };
 
-fs.readdirSync('../src/translations').forEach((file) => {
+fs.readdirSync('../src/i18n/locales').forEach((file) => {
   if (file === 'en_GB.json') {
     return;
   }
 
-  const en = require('../src/translations/en_GB.json');
-  const newdata = merge(en, require('../src/translations/' + file));
+  const en = require('../src/i18n/locales/en_GB.json');
+  const newdata = merge(en, require('../src/i18n/locales/' + file));
 
   // remove strings not in english file
   compareAndRemoveKeys(newdata, en);
 
   // write new file
-  fs.writeFileSync('../src/translations/' + file, JSON.stringify(newdata, null, 2));
+  fs.writeFileSync('../src/i18n/locales/' + file, JSON.stringify(newdata, null, 2));
 
   // add new line
-  fs.appendFileSync('../src/translations/' + file, '\n');
+  fs.appendFileSync('../src/i18n/locales/' + file, '\n');
 });

src/App.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { ToastContainer } from 'react-toastify';
 

src/components/Elements/Button/Button.jsx

@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
-import Tooltip from '../../../helpers/tooltip/Tooltip';
+import Tooltip from 'components/Elements/Tooltip/Tooltip';
 
 const Button = forwardRef(
   (
@@ -50,4 +50,4 @@ const Button = forwardRef(
   },
 );
 
-export default Button;
+export { Button as default, Button };

src/components/Elements/Button/index.jsx

@@ -0,0 +1 @@
+export * from './Button';

src/components/Elements/ShareModal/ShareModal.jsx

@@ -1,10 +1,10 @@
 import { memo } from 'react';
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { MdClose, MdEmail, MdContentCopy } from 'react-icons/md';
 import { FaTwitter, FaFacebookF } from 'react-icons/fa';
 import { AiFillWechat } from 'react-icons/ai';
 import { SiTencentqq } from 'react-icons/si';
-import Tooltip from '../tooltip/Tooltip';
+import Tooltip from '../Tooltip/Tooltip';
 import { toast } from 'react-toastify';
 
 import './sharemodal.scss';
@@ -123,4 +123,6 @@ function ShareModal({ modalClose, data }) {
   );
 }
 
-export default memo(ShareModal);
+const MemoizedSharemodal = memo(ShareModal);
+
+export { MemoizedSharemodal as default, MemoizedSharemodal as ShareModal };

src/components/Elements/ShareModal/index.jsx

@@ -0,0 +1 @@
+export * from './ShareModal';

src/components/Elements/Tooltip/Tooltip.jsx

@@ -47,4 +47,6 @@ function Tooltip({ children, title, style, placement, subtitle }) {
   );
 }
 
-export default memo(Tooltip);
+const MemoizedTooltip = memo(Tooltip);
+
+export { MemoizedTooltip as default, MemoizedTooltip as Tooltip };

src/components/Elements/Tooltip/index.jsx

@@ -0,0 +1 @@
+export * from './Tooltip';

src/components/Elements/index.jsx

@@ -0,0 +1,3 @@
+export * from './Button';
+export * from './Tooltip';
+export * from './ShareModal';

src/config/.env

@@ -0,0 +1,28 @@
+# API URLs
+API_URL=https://api.muetab.com/v2
+SPONSORS_URL=https://sponsors.muetab.com
+GITHUB_URL=https://api.github.com
+DDG_IMAGE_PROXY=https://external-content.duckduckgo.com/iu/?u=
+OPENSTREETMAP_URL=https://www.openstreetmap.org
+
+# Mue URLs
+WEBSITE_URL=https://muetab.com
+PRIVACY_URL=https://muetab.com/privacy
+BLOG_POST=https://blog.muetab.com/posts/version-7-0
+TRANSLATIONS_URL=https://docs.muetab.com/translations/
+WEBLATE_URL=https://hosted.weblate.org/projects/mue/mue-tab/
+REPORT_ITEM=https://github.com/mue/marketplace/issues/new?assignees=&labels=item+report&template=item-report.md&title=%5BItem+Report%5D+
+BUG_REPORT=https://github.com/mue/mue/issues/new?assignees=&labels=issue+report&template=bug-report.md&title=%5BBug%5D+
+DONATE_LINK=https://muetab.com/donate
+SENTRY_DSN=https://430352fd4b174d688ebd82fc85c22c58@o1217438.ingest.sentry.io/6359480
+KNOWLEDGEBASE=https://support.muetab.com
+
+# Mue Info
+ORG_NAME=mue
+REPO_NAME=mue
+EMAIL=hello@muetab.com
+TWITTER_HANDLE=getmue
+DISCORD_SERVER=zv8C9F8
+OPENCOLLECTIVE_USERNAME=mue
+
+VERSION=7.0.1

src/config/variables.js

@@ -1,4 +1,4 @@
-import * as constants from 'modules/constants';
+import * as constants from 'config/constants';
 import Stats from 'modules/helpers/stats';
 
 const variables = {

src/features/helpers/carousel/Carousel.jsx

@@ -3,7 +3,7 @@ import { MdOutlineArrowForwardIos, MdOutlineArrowBackIos } from 'react-icons/md'
 import useEmblaCarousel from 'embla-carousel-react';
 import Autoplay from 'embla-carousel-autoplay';
 
-import variables from 'modules/variables';
+import variables from 'config/variables';
 
 import './carousel.scss';
 

src/features/helpers/preview/Preview.jsx

@@ -1,5 +1,5 @@
 import { memo } from 'react';
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import './preview.scss';
 
 function Preview(props) {

src/features/modals/ErrorBoundary.jsx

@@ -1,10 +1,10 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 
 import { MdErrorOutline, MdRefresh } from 'react-icons/md';
 import { captureException } from '@sentry/react';
 
-import Button from './main/settings/Button';
+import { Button } from 'components/Elements';
 
 class ErrorBoundary extends PureComponent {
   constructor(props) {

src/features/modals/Modals.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import Modal from 'react-modal';
 

src/features/modals/main/Main.jsx

@@ -1,10 +1,9 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { Suspense, lazy, useState, memo } from 'react';
 import { MdClose } from 'react-icons/md';
 
 import './scss/index.scss';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
-
+import { Tooltip } from 'components/Elements';
 const Settings = lazy(() => import('./tabs/Settings'));
 const Addons = lazy(() => import('./tabs/Addons'));
 const Marketplace = lazy(() => import('./tabs/Marketplace'));

src/features/modals/main/marketplace/Item.jsx

@@ -1,6 +1,6 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, Fragment } from 'react';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
+import { Tooltip } from 'components/Elements';
 import ImageCarousel from 'features/helpers/carousel/Carousel';
 import { toast } from 'react-toastify';
 import {
@@ -18,11 +18,11 @@ import {
 import Modal from 'react-modal';
 
 import Header from '../settings/Header';
-import Button from '../settings/Button';
+import { Button } from 'components/Elements';
 
 import { install, uninstall } from 'modules/helpers/marketplace';
 
-import ShareModal from 'features/helpers/sharemodal/ShareModal';
+import { ShareModal } from 'components/Elements';
 
 class Item extends PureComponent {
   constructor(props) {

src/features/modals/main/marketplace/Items.jsx

@@ -1,8 +1,8 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import React, { memo } from 'react';
 import { MdAutoFixHigh, MdOutlineArrowForward, MdOutlineOpenInNew } from 'react-icons/md';
 
-import Button from '../settings/Button';
+import { Button } from 'components/Elements';
 
 function Items({
   type,

src/features/modals/main/marketplace/Lightbox.jsx

@@ -1,5 +1,5 @@
 import { memo } from 'react';
-import variables from 'modules/variables';
+import variables from 'config/variables';
 
 function Lightbox({ modalClose, img }) {
   variables.stats.postEvent('modal', 'Opened lightbox');

src/features/modals/main/marketplace/SideloadFailedModal.jsx

@@ -1,8 +1,7 @@
 import { memo } from 'react';
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { MdClose } from 'react-icons/md';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
-
+import { Tooltip } from 'components/Elements';
 function SideloadFailedModal({ modalClose, reason }) {
   return (
     <div className="smallModal">

src/features/modals/main/marketplace/examples/photos.json

@@ -1,25 +0,0 @@
-{
-  "name": "Example Photos",
-  "description": "This is an example.",
-  "type": "photos",
-  "version": "1.0.0",
-  "author": "Mue",
-  "icon_url": "https://raw.githubusercontent.com/mue/branding/main/logo/logo_square.png",
-  "screenshot_url": "https://github.com/mue/mue/raw/main/assets/screenshot.webp",
-  "photos": [
-    {
-      "photographer": "Example photographer",
-      "location": "Example location",
-      "url": {
-        "default": "https://github.com/mue/mue/raw/main/assets/screenshot.webp"
-      }
-    },
-    {
-      "photographer": "Example photographer 2",
-      "location": "Example location 2",
-      "url": {
-        "default": "https://github.com/mue/mue/raw/main/assets/screenshot2.webp"
-      }
-    }
-  ]
-}

src/features/modals/main/marketplace/examples/quotes.json

@@ -1,20 +0,0 @@
-{
-  "name": "Example Quotes",
-  "description": "This is an example.",
-  "type": "quotes",
-  "version": "1.0.0",
-  "author": "Mue",
-  "icon_url": "https://raw.githubusercontent.com/mue/branding/main/logo/logo_square.png",
-  "screenshot_url": "https://github.com/mue/mue/raw/main/assets/screenshot.webp",
-  "language": "en",
-  "quotes": [
-    {
-      "quote": "This is an example quote.",
-      "author": "Example 1"
-    },
-    {
-      "quote": "This is another example quote.",
-      "author": "Example 2"
-    }
-  ]
-}

src/features/modals/main/marketplace/examples/settings.json

@@ -1,13 +0,0 @@
-{
-  "name": "Example Settings",
-  "description": "This is an example.",
-  "type": "settings",
-  "version": "1.0.0",
-  "author": "Mue",
-  "icon_url": "https://raw.githubusercontent.com/mue/branding/main/logo/logo_square.png",
-  "screenshot_url": "https://github.com/mue/mue/raw/main/assets/screenshot.webp",
-  "settings": {
-    "searchBar": false,
-    "weather": true
-  }
-}

src/features/modals/main/marketplace/sections/Added.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { MdUpdate, MdOutlineExtensionOff, MdSendTimeExtension } from 'react-icons/md';
 import { toast } from 'react-toastify';
@@ -10,7 +10,7 @@ import Item from '../Item';
 import Items from '../Items';
 import Dropdown from '../../settings/Dropdown';
 import Header, { CustomActions } from '../../settings/Header';
-import Button from '../../settings/Button';
+import { Button } from 'components/Elements';
 
 import { install, uninstall, urlParser } from 'modules/helpers/marketplace';
 

src/features/modals/main/marketplace/sections/Create.jsx

@@ -1,5 +1,5 @@
 /* eslint-disable no-unused-vars */
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { MdOutlineExtensionOff } from 'react-icons/md';
 

src/features/modals/main/marketplace/sections/Marketplace.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { toast } from 'react-toastify';
 import {
@@ -14,7 +14,7 @@ import Item from '../Item';
 import Items from '../Items';
 import Dropdown from '../../settings/Dropdown';
 import Header from '../../settings/Header';
-import Button from '../../settings/Button';
+import { Button } from 'components/Elements';
 
 import { install, urlParser, uninstall } from 'modules/helpers/marketplace';
 

src/features/modals/main/settings/Checkbox.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { Checkbox as CheckboxUI, FormControlLabel } from '@mui/material';
 

src/features/modals/main/settings/Dropdown.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, createRef } from 'react';
 import { InputLabel, MenuItem, FormControl, Select } from '@mui/material';
 

src/features/modals/main/settings/FileUpload.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { toast } from 'react-toastify';
 import { compressAccurately, filetoDataURL } from 'image-conversion';

src/features/modals/main/settings/Header.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { useState, useEffect } from 'react';
 import {
   MdFlag,
@@ -7,7 +7,7 @@ import {
   MdOutlineKeyboardArrowRight,
 } from 'react-icons/md';
 import EventBus from 'modules/helpers/eventbus';
-import Button from './Button';
+import { Button } from 'components/Elements';
 
 export const CustomActions = ({ children }) => {
   return children;

src/features/modals/main/settings/PreferencesWrapper.jsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { Row, Content, Action } from './SettingsItem';
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import Slider from './Slider';
 
 import { values } from 'modules/helpers/settings/modals';

src/features/modals/main/settings/Radio.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import {
   Radio as RadioUI,

src/features/modals/main/settings/ResetModal.jsx

@@ -1,9 +1,8 @@
 import { memo } from 'react';
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { MdClose, MdRestartAlt } from 'react-icons/md';
 import { setDefaultSettings } from 'modules/helpers/settings';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
-
+import { Tooltip } from 'components/Elements';
 function ResetModal({ modalClose }) {
   const reset = () => {
     variables.stats.postEvent('setting', 'Reset');

src/features/modals/main/settings/Slider.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { toast } from 'react-toastify';
 import { Slider } from '@mui/material';

src/features/modals/main/settings/Switch.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { Switch as SwitchUI, FormControlLabel } from '@mui/material';
 

src/features/modals/main/settings/Text.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { toast } from 'react-toastify';
 import { TextField } from '@mui/material';

src/features/modals/main/settings/sections/About.jsx

@@ -1,12 +1,11 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { MdEmail, MdContactPage } from 'react-icons/md';
 import { FaDiscord, FaTwitter } from 'react-icons/fa';
 import { SiGithubsponsors, SiOpencollective } from 'react-icons/si';
 import { BiDonateHeart } from 'react-icons/bi';
 
-import Tooltip from 'features/helpers/tooltip/Tooltip';
-
+import { Tooltip } from 'components/Elements';
 import other_contributors from 'modules/other_contributors.json';
 
 export default class About extends PureComponent {

src/features/modals/main/settings/sections/Advanced.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { useState } from 'react';
 import Modal from 'react-modal';
 import {

src/features/modals/main/settings/sections/Appearance.jsx

@@ -1,6 +1,6 @@
 import { memo, useState } from 'react';
 
-import variables from 'modules/variables';
+import variables from 'config/variables';
 
 import Checkbox from '../Checkbox';
 import Dropdown from '../Dropdown';

src/features/modals/main/settings/sections/Changelog.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, createRef } from 'react';
 import { MdOutlineWifiOff } from 'react-icons/md';
 import Modal from 'react-modal';

src/features/modals/main/settings/sections/Date.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { useState } from 'react';
 
 import Header from '../Header';

src/features/modals/main/settings/sections/Experimental.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { useState, memo } from 'react';
 import Checkbox from '../Checkbox';
 import Slider from '../Slider';

src/features/modals/main/settings/sections/Greeting.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { useState } from 'react';
 
 import Header from '../Header';

src/features/modals/main/settings/sections/Language.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 
 import { MdOutlineOpenInNew } from 'react-icons/md';

src/features/modals/main/settings/sections/Message.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { MdCancel, MdAdd, MdOutlineTextsms } from 'react-icons/md';
 import { toast } from 'react-toastify';

src/features/modals/main/settings/sections/Navbar.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 
 import { useState, memo } from 'react';
 
@@ -9,7 +9,7 @@ import AddModal from './quicklinks/AddModal';
 
 import Checkbox from '../Checkbox';
 import Dropdown from '../Dropdown';
-import Button from '../Button';
+import { Button } from 'components/Elements';
 
 import { Row, Content, Action } from '../SettingsItem';
 import Header from '../Header';

src/features/modals/main/settings/sections/Overview.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { MdOutlineDragIndicator } from 'react-icons/md';
 import { sortableContainer, sortableElement } from '@muetab/react-sortable-hoc';

src/features/modals/main/settings/sections/QuickLinks.jsx

@@ -1,10 +1,10 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, createRef } from 'react';
 import { MdAddLink, MdLinkOff } from 'react-icons/md';
 import Header from '../Header';
 import Checkbox from '../Checkbox';
 import Dropdown from '../Dropdown';
-import Button from '../Button';
+import { Button } from 'components/Elements';
 import Modal from 'react-modal';
 
 import { Row, Content, Action } from '../SettingsItem';

src/features/modals/main/settings/sections/Quote.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import React, { PureComponent } from 'react';
 import { MdCancel, MdAdd, MdSource, MdOutlineFormatQuote } from 'react-icons/md';
 import TextareaAutosize from '@mui/material/TextareaAutosize';

src/features/modals/main/settings/sections/Search.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { toast } from 'react-toastify';
 import { MenuItem, TextField } from '@mui/material';

src/features/modals/main/settings/sections/Stats.jsx

@@ -1,11 +1,11 @@
 /* eslint-disable array-callback-return */
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { MdShowChart, MdRestartAlt, MdDownload } from 'react-icons/md';
 import { FaTrophy } from 'react-icons/fa';
 import { toast } from 'react-toastify';
 
-import Button from '../Button';
+import { Button } from 'components/Elements';
 import Header, { CustomActions } from '../Header';
 
 import { saveFile } from 'modules/helpers/settings/modals';

src/features/modals/main/settings/sections/Time.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import React, { useState } from 'react';
 
 import Header from '../Header';

src/features/modals/main/settings/sections/Weather.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 
 import { MdAutoAwesome } from 'react-icons/md';

src/features/modals/main/settings/sections/background/Background.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { MenuItem } from '@mui/material';
 import { MdSource, MdOutlineKeyboardArrowRight, MdOutlineAutoAwesome } from 'react-icons/md';

src/features/modals/main/settings/sections/background/Colour.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, Fragment } from 'react';
 import { ColorPicker } from '@muetab/react-color-gradient-picker';
 import { toast } from 'react-toastify';

src/features/modals/main/settings/sections/background/Custom.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, createRef } from 'react';
 import { toast } from 'react-toastify';
 import {
@@ -15,8 +15,7 @@ import { videoCheck } from 'modules/helpers/background/widget';
 
 import Checkbox from '../../Checkbox';
 import FileUpload from '../../FileUpload';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
-
+import { Tooltip } from 'components/Elements';
 import Modal from 'react-modal';
 
 import CustomURLModal from './CustomURLModal';

src/features/modals/main/settings/sections/background/CustomURLModal.jsx

@@ -1,8 +1,7 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { useState, memo } from 'react';
 import { MdClose, MdOutlineAddLink } from 'react-icons/md';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
-
+import { Tooltip } from 'components/Elements';
 function CustomURLModal({ modalClose, urlError, modalCloseOnly }) {
   const [url, setURL] = useState();
 

src/features/modals/main/settings/sections/quicklinks/AddModal.jsx

@@ -1,10 +1,9 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 
 import { useState, memo } from 'react';
 import { TextareaAutosize } from '@mui/material';
 import { MdAddLink, MdClose } from 'react-icons/md';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
-
+import { Tooltip } from 'components/Elements';
 function AddModal({ urlError, iconError, addLink, closeModal, edit, editData, editLink }) {
   const [name, setName] = useState(edit ? editData.name : '');
   const [url, setUrl] = useState(edit ? editData.url : '');

src/features/modals/main/settings/sections/quicklinks/QuickLink.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 
 import { MdEdit, MdCancel } from 'react-icons/md';
 

src/features/modals/main/tabs/Addons.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { memo } from 'react';
 import Tabs from './backend/Tabs';
 

src/features/modals/main/tabs/Marketplace.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { memo } from 'react';
 
 import Tabs from './backend/Tabs';

src/features/modals/main/tabs/Settings.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { memo } from 'react';
 
 import Tabs from './backend/Tabs';

src/features/modals/main/tabs/backend/Tab.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { memo, useState, useEffect } from 'react';
 import {
   MdSettings as Settings,

src/features/modals/main/tabs/backend/Tabs.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import {
   MdSettings,
@@ -8,7 +8,7 @@ import {
   MdClose,
 } from 'react-icons/md';
 import Tab from './Tab';
-import Button from '../../settings/Button';
+import { Button } from 'components/Elements';
 import ErrorBoundary from '../../../ErrorBoundary';
 
 class Tabs extends PureComponent {

src/features/modals/welcome/Welcome.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { MdArrowBackIosNew, MdArrowForwardIos, MdOutlinePreview } from 'react-icons/md';
 
@@ -6,7 +6,7 @@ import EventBus from 'modules/helpers/eventbus';
 
 import WelcomeSections from './WelcomeSections';
 import ProgressBar from './ProgressBar';
-import Button from '../main/settings/Button';
+import { Button } from 'components/Elements';
 
 import './welcome.scss';
 

src/features/modals/welcome/WelcomeSections.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 
 import {

src/features/widgets/background/Background.jsx

@@ -1,6 +1,6 @@
 /* eslint-disable no-unused-expressions */
 // todo: rewrite this mess
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 
 import PhotoInformation from './PhotoInformation';

src/features/widgets/background/ExcludeModal.jsx

@@ -1,7 +1,8 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { memo } from 'react';
 import EventBus from 'modules/helpers/eventbus';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
+import { Tooltip } from 'components/Elements';
+
 import { MdClose, MdDone } from 'react-icons/md';
 
 function ExcludeModal({ modalClose, info }) {

src/features/widgets/background/Favourite.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 import { MdStar, MdStarBorder } from 'react-icons/md';
 

src/features/widgets/background/Maximise.jsx

@@ -1,10 +1,9 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 
 import { MdCropFree } from 'react-icons/md';
 
-import Tooltip from 'features/helpers/tooltip/Tooltip';
-
+import { Tooltip } from 'components/Elements';
 class Maximise extends PureComponent {
   constructor() {
     super();

src/features/widgets/background/PhotoInformation.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { useState, memo } from 'react';
 import Favourite from './Favourite';
 import {
@@ -14,9 +14,10 @@ import {
   MdCategory as Category,
   MdVisibilityOff as VisibilityOff,
 } from 'react-icons/md';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
+import { Tooltip } from 'components/Elements';
+
 import Modal from 'react-modal';
-import ShareModal from 'features/helpers/sharemodal/ShareModal';
+import { ShareModal } from 'components/Elements';
 import ExcludeModal from './ExcludeModal';
 
 /**

src/features/widgets/greeting/Greeting.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, createRef } from 'react';
 
 import { nth, convertTimezone } from 'modules/helpers/date';

src/features/widgets/navbar/Apps.jsx

@@ -1,9 +1,10 @@
 // TODO: make it work with pins or on click or smth
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, memo, useState } from 'react';
 
 import { MdPlaylistRemove, MdOutlineApps } from 'react-icons/md';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
+import { Tooltip } from 'components/Elements';
+
 import { shift, useFloating } from '@floating-ui/react-dom';
 import EventBus from 'modules/helpers/eventbus';
 

src/features/widgets/navbar/Navbar.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, createRef } from 'react';
 
 import { MdRefresh, MdSettings } from 'react-icons/md';
@@ -7,8 +7,7 @@ import Notes from './Notes';
 import Todo from './Todo';
 import Apps from './Apps';
 import Maximise from '../background/Maximise';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
-
+import { Tooltip } from 'components/Elements';
 import EventBus from 'modules/helpers/eventbus';
 
 import './scss/index.scss';

src/features/widgets/navbar/Notes.jsx

@@ -1,11 +1,12 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, memo, useState } from 'react';
 
 import { MdContentCopy, MdAssignment, MdPushPin, MdDownload } from 'react-icons/md';
 import { useFloating, shift } from '@floating-ui/react-dom';
 import TextareaAutosize from '@mui/material/TextareaAutosize';
 import { toast } from 'react-toastify';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
+import { Tooltip } from 'components/Elements';
+
 import { saveFile } from 'modules/helpers/settings/modals';
 import EventBus from 'modules/helpers/eventbus';
 

src/features/widgets/navbar/Todo.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, memo, useState } from 'react';
 
 import {
@@ -10,7 +10,8 @@ import {
   MdPlaylistRemove,
 } from 'react-icons/md';
 import TextareaAutosize from '@mui/material/TextareaAutosize';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
+import { Tooltip } from 'components/Elements';
+
 import Checkbox from '@mui/material/Checkbox';
 import { shift, useFloating } from '@floating-ui/react-dom';
 import { sortableContainer, sortableElement, sortableHandle } from '@muetab/react-sortable-hoc';

src/features/widgets/quicklinks/QuickLinks.jsx

@@ -1,5 +1,6 @@
 import { PureComponent, createRef } from 'react';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
+import { Tooltip } from 'components/Elements';
+
 import EventBus from 'modules/helpers/eventbus';
 
 import './quicklinks.scss';

src/features/widgets/quote/Quote.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, createRef } from 'react';
 import {
   MdContentCopy,
@@ -11,9 +11,10 @@ import {
 
 import { toast } from 'react-toastify';
 
-import Tooltip from 'features/helpers/tooltip/Tooltip';
+import { Tooltip } from 'components/Elements';
+
 import Modal from 'react-modal';
-import ShareModal from 'features/helpers/sharemodal/ShareModal';
+import { ShareModal } from 'components/Elements';
 
 import offline_quotes from './offline_quotes.json';
 

src/features/widgets/search/Search.jsx

@@ -1,11 +1,10 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, createRef } from 'react';
 import { MdSearch, MdMic, MdScreenSearchDesktop } from 'react-icons/md';
 import { BsGoogle } from 'react-icons/bs';
 import { SiDuckduckgo, SiMicrosoftbing, SiYahoo, SiBaidu } from 'react-icons/si';
 import { FaYandex } from 'react-icons/fa';
-import Tooltip from 'features/helpers/tooltip/Tooltip';
-
+import { Tooltip } from 'components/Elements';
 import AutocompleteInput from 'features/helpers/autocomplete/Autocomplete';
 
 import EventBus from 'modules/helpers/eventbus';

src/features/widgets/time/Date.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent, createRef } from 'react';
 
 import { nth, convertTimezone } from '../../../modules/helpers/date';

src/features/widgets/weather/Expanded.jsx

@@ -6,8 +6,7 @@ import { MdDisabledVisible } from 'react-icons/md';
 import WeatherIcon from './WeatherIcon';
 import WindDirectionIcon from './WindDirectionIcon';
 
-import Tooltip from 'features/helpers/tooltip/Tooltip';
-
+import { Tooltip } from 'components/Elements';
 function Expanded({ state: { weather, icon }, weatherType, variables }) {
   /**
    * If the localStorage item is true and the weatherType is greater than or equal to 3, or if the

src/features/widgets/weather/Weather.jsx

@@ -1,4 +1,4 @@
-import variables from 'modules/variables';
+import variables from 'config/variables';
 import { PureComponent } from 'react';
 
 import WeatherIcon from './WeatherIcon';