From 271af64d0760aa2990abcb212156a93c0c3f0e6d Mon Sep 17 00:00:00 2001 From: David Ralph Date: Sun, 30 Oct 2022 16:56:26 +0000 Subject: [PATCH] perf: use memo, fix quicklinks key err --- src/components/helpers/carousel/Carousel.jsx | 6 ++++-- src/components/helpers/notification/notification.jsx | 6 +++++- src/components/helpers/preview/Preview.jsx | 5 ++++- src/components/helpers/sharemodal/ShareModal.jsx | 5 ++++- src/components/helpers/tooltip/Tooltip.jsx | 6 ++++-- src/components/helpers/tooltip/infoTooltip.jsx | 6 ++++-- src/components/modals/main/Main.jsx | 5 ++++- src/components/modals/main/marketplace/Items.jsx | 6 ++++-- src/components/modals/main/marketplace/Lightbox.jsx | 5 ++++- .../modals/main/marketplace/SideloadFailedModal.jsx | 5 ++++- src/components/modals/main/settings/ResetModal.jsx | 5 ++++- src/components/modals/main/settings/SettingsItem.jsx | 6 +++++- .../modals/main/settings/sections/Appearance.jsx | 6 +++++- .../modals/main/settings/sections/Experimental.jsx | 6 ++++-- src/components/modals/main/settings/sections/Navbar.jsx | 6 ++++-- .../modals/main/settings/sections/QuickLinks.jsx | 2 +- .../main/settings/sections/background/CustomURLModal.jsx | 6 ++++-- .../main/settings/sections/overview_skeletons/Clock.jsx | 6 ++++-- .../main/settings/sections/overview_skeletons/Date.jsx | 6 +++++- .../main/settings/sections/overview_skeletons/Greeting.jsx | 6 +++++- .../main/settings/sections/overview_skeletons/Message.jsx | 6 +++++- .../settings/sections/overview_skeletons/QuickLinks.jsx | 5 ++++- .../main/settings/sections/overview_skeletons/Quote.jsx | 5 ++++- .../modals/main/settings/sections/quicklinks/AddModal.jsx | 6 ++++-- src/components/modals/main/tabs/Addons.jsx | 5 ++++- src/components/modals/main/tabs/Marketplace.jsx | 6 +++++- src/components/modals/main/tabs/Settings.jsx | 6 +++++- src/components/modals/welcome/ProgressBar.jsx | 6 +++++- src/components/widgets/background/PhotoInformation.jsx | 6 ++++-- src/components/widgets/navbar/Notes.jsx | 6 ++++-- src/components/widgets/navbar/Todo.jsx | 6 ++++-- src/components/widgets/weather/Expanded.jsx | 6 +++++- src/components/widgets/weather/WeatherIcon.jsx | 6 +++++- src/components/widgets/weather/WindDirectionIcon.jsx | 7 ++++++- 34 files changed, 146 insertions(+), 46 deletions(-) diff --git a/src/components/helpers/carousel/Carousel.jsx b/src/components/helpers/carousel/Carousel.jsx index b7ddc6f5..66b9b84a 100644 --- a/src/components/helpers/carousel/Carousel.jsx +++ b/src/components/helpers/carousel/Carousel.jsx @@ -1,11 +1,11 @@ -import React, { useState, useEffect, useCallback, useRef } from 'react'; +import React, { useState, useEffect, useCallback, useRef, memo } from 'react'; import { MdOutlineArrowForwardIos, MdOutlineArrowBackIos } from 'react-icons/md'; import useEmblaCarousel from 'embla-carousel-react'; import Autoplay from 'embla-carousel-autoplay'; import './carousel.scss'; -export default function EmblaCarousel({ data }) { +function EmblaCarousel({ data }) { const autoplay = useRef( Autoplay({ delay: 3000, stopOnInteraction: false }, (emblaRoot) => emblaRoot.parentElement), ); @@ -79,3 +79,5 @@ export default function EmblaCarousel({ data }) { ); } + +export default memo(EmblaCarousel); \ No newline at end of file diff --git a/src/components/helpers/notification/notification.jsx b/src/components/helpers/notification/notification.jsx index ae989507..1dd40ac3 100644 --- a/src/components/helpers/notification/notification.jsx +++ b/src/components/helpers/notification/notification.jsx @@ -1,7 +1,9 @@ +import { memo } from 'react'; + import variables from 'modules/variables'; import './preview.scss'; -export default function Notification(props) { +function Notification(props) { return (
{variables.getMessage('modals.main.settings.reminder.title')} @@ -12,3 +14,5 @@ export default function Notification(props) {
); } + +export default memo(Notification); \ No newline at end of file diff --git a/src/components/helpers/preview/Preview.jsx b/src/components/helpers/preview/Preview.jsx index 3572be43..64780bc0 100644 --- a/src/components/helpers/preview/Preview.jsx +++ b/src/components/helpers/preview/Preview.jsx @@ -1,7 +1,8 @@ +import { memo } from 'react'; import variables from 'modules/variables'; import './preview.scss'; -export default function Preview(props) { +function Preview(props) { return (
{variables.getMessage('modals.main.settings.reminder.title')} @@ -12,3 +13,5 @@ export default function Preview(props) {
); } + +export default memo(Preview); \ No newline at end of file diff --git a/src/components/helpers/sharemodal/ShareModal.jsx b/src/components/helpers/sharemodal/ShareModal.jsx index 398332ba..82ccbfed 100644 --- a/src/components/helpers/sharemodal/ShareModal.jsx +++ b/src/components/helpers/sharemodal/ShareModal.jsx @@ -1,3 +1,4 @@ +import { memo } from 'react'; import variables from 'modules/variables'; import { MdClose, MdEmail, MdContentCopy } from 'react-icons/md'; import { FaTwitter, FaFacebookF } from 'react-icons/fa'; @@ -8,7 +9,7 @@ import { toast } from 'react-toastify'; import './sharemodal.scss'; -export default function ShareModal({ modalClose, data }) { +function ShareModal({ modalClose, data }) { const url = variables.constants.MARKETPLACE_URL + '/share/' + (btoa(data.api_name) || ''); const copyLink = () => { @@ -111,3 +112,5 @@ export default function ShareModal({ modalClose, data }) { ); } + +export default memo(ShareModal); \ No newline at end of file diff --git a/src/components/helpers/tooltip/Tooltip.jsx b/src/components/helpers/tooltip/Tooltip.jsx index 55b6261e..8434e5fa 100644 --- a/src/components/helpers/tooltip/Tooltip.jsx +++ b/src/components/helpers/tooltip/Tooltip.jsx @@ -1,8 +1,8 @@ -import { useState } from 'react'; +import { useState, memo } from 'react'; import { useFloating, flip, offset, shift } from '@floating-ui/react-dom'; import './tooltip.scss'; -export default function Tooltip({ children, title, style, placement, subtitle }) { +function Tooltip({ children, title, style, placement, subtitle }) { const [showTooltip, setShowTooltip] = useState(false); const { x, y, reference, floating, strategy } = useFloating({ placement: placement || 'bottom', @@ -39,3 +39,5 @@ export default function Tooltip({ children, title, style, placement, subtitle }) ); } + +export default memo(Tooltip); \ No newline at end of file diff --git a/src/components/helpers/tooltip/infoTooltip.jsx b/src/components/helpers/tooltip/infoTooltip.jsx index 2bbdf689..e741be64 100644 --- a/src/components/helpers/tooltip/infoTooltip.jsx +++ b/src/components/helpers/tooltip/infoTooltip.jsx @@ -1,12 +1,12 @@ import variables from 'modules/variables'; -import { useState } from 'react'; +import { useState, memo } from 'react'; import { useFloating, flip, offset, shift } from '@floating-ui/react-dom'; import { MdClose, MdInfo, MdOpenInNew } from 'react-icons/md'; import Tooltip from './Tooltip'; import './tooltip.scss'; -export default function InfoTooltip({ title, style, placement, subtitle }) { +function InfoTooltip({ title, style, placement, subtitle }) { const [showTooltip, setShowTooltip] = useState(false); const { x, y, reference, floating, strategy } = useFloating({ placement: placement || 'top-start', @@ -43,3 +43,5 @@ export default function InfoTooltip({ title, style, placement, subtitle }) { ); } + +export default memo(InfoTooltip); \ No newline at end of file diff --git a/src/components/modals/main/Main.jsx b/src/components/modals/main/Main.jsx index f6f1c8e7..bad02eef 100644 --- a/src/components/modals/main/Main.jsx +++ b/src/components/modals/main/Main.jsx @@ -1,6 +1,7 @@ import variables from 'modules/variables'; import { Suspense, lazy, useState } from 'react'; +import { memo } from 'react'; import { MdClose } from 'react-icons/md'; import Tabs from './tabs/backend/Tabs'; @@ -29,7 +30,7 @@ const renderLoader = (current) => ( ); -export default function MainModal({ modalClose }) { +function MainModal({ modalClose }) { const [currentTab, setCurrentTab] = useState(0); const changeTab = (type) => { @@ -67,3 +68,5 @@ export default function MainModal({ modalClose }) { ); } + +export default memo(MainModal); \ No newline at end of file diff --git a/src/components/modals/main/marketplace/Items.jsx b/src/components/modals/main/marketplace/Items.jsx index d70bd755..e7671aa7 100644 --- a/src/components/modals/main/marketplace/Items.jsx +++ b/src/components/modals/main/marketplace/Items.jsx @@ -1,6 +1,6 @@ import variables from 'modules/variables'; import TextField from '@mui/material/TextField'; -import React, { useState } from 'react'; +import React, { useState, memo } from 'react'; import { MdAutoFixHigh, MdOutlineArrowForward, @@ -12,7 +12,7 @@ import { MdSearch, } from 'react-icons/md'; -export default function Items({ +function Items({ type, items, collection, @@ -154,3 +154,5 @@ export default function Items({ ); } + +export default memo(Items); \ No newline at end of file diff --git a/src/components/modals/main/marketplace/Lightbox.jsx b/src/components/modals/main/marketplace/Lightbox.jsx index a60f9f78..d8e41a17 100644 --- a/src/components/modals/main/marketplace/Lightbox.jsx +++ b/src/components/modals/main/marketplace/Lightbox.jsx @@ -1,6 +1,7 @@ +import { memo } from 'react'; import variables from 'modules/variables'; -export default function Lightbox({ modalClose, img }) { +function Lightbox({ modalClose, img }) { variables.stats.postEvent('modal', 'Opened lightbox'); return ( @@ -12,3 +13,5 @@ export default function Lightbox({ modalClose, img }) { ); } + +export default memo(Lightbox); \ No newline at end of file diff --git a/src/components/modals/main/marketplace/SideloadFailedModal.jsx b/src/components/modals/main/marketplace/SideloadFailedModal.jsx index 6fd76ce2..fd586ec0 100644 --- a/src/components/modals/main/marketplace/SideloadFailedModal.jsx +++ b/src/components/modals/main/marketplace/SideloadFailedModal.jsx @@ -1,8 +1,9 @@ +import { memo } from 'react'; import variables from 'modules/variables'; import { MdClose } from 'react-icons/md'; import Tooltip from '../../../helpers/tooltip/Tooltip'; -export default function SideloadFailedModal({ modalClose, reason }) { +function SideloadFailedModal({ modalClose, reason }) { return (
@@ -24,3 +25,5 @@ export default function SideloadFailedModal({ modalClose, reason }) {
); } + +export default memo(SideloadFailedModal); \ No newline at end of file diff --git a/src/components/modals/main/settings/ResetModal.jsx b/src/components/modals/main/settings/ResetModal.jsx index 25df3182..ebf0a705 100644 --- a/src/components/modals/main/settings/ResetModal.jsx +++ b/src/components/modals/main/settings/ResetModal.jsx @@ -1,9 +1,10 @@ +import { memo } from 'react'; import variables from 'modules/variables'; import { MdClose, MdRestartAlt } from 'react-icons/md'; import { setDefaultSettings } from 'modules/helpers/settings'; import Tooltip from '../../../helpers/tooltip/Tooltip'; -export default function ResetModal({ modalClose }) { +function ResetModal({ modalClose }) { const reset = () => { variables.stats.postEvent('setting', 'Reset'); setDefaultSettings('reset'); @@ -43,3 +44,5 @@ export default function ResetModal({ modalClose }) {
); } + +export default memo(ResetModal); \ No newline at end of file diff --git a/src/components/modals/main/settings/SettingsItem.jsx b/src/components/modals/main/settings/SettingsItem.jsx index ad2870ce..4aa9a2a8 100644 --- a/src/components/modals/main/settings/SettingsItem.jsx +++ b/src/components/modals/main/settings/SettingsItem.jsx @@ -1,4 +1,6 @@ -export default function SettingsItem(props) { +import { memo } from 'react'; + +function SettingsItem(props) { return (
@@ -9,3 +11,5 @@ export default function SettingsItem(props) {
); } + +export default memo(SettingsItem); \ No newline at end of file diff --git a/src/components/modals/main/settings/sections/Appearance.jsx b/src/components/modals/main/settings/sections/Appearance.jsx index 5b4d2e92..d9a80d9d 100644 --- a/src/components/modals/main/settings/sections/Appearance.jsx +++ b/src/components/modals/main/settings/sections/Appearance.jsx @@ -1,3 +1,5 @@ +import { memo } from 'react'; + import variables from 'modules/variables'; import Checkbox from '../Checkbox'; @@ -9,7 +11,7 @@ import SettingsItem from '../SettingsItem'; import { values } from 'modules/helpers/settings/modals'; -export default function AppearanceSettings() { +function AppearanceSettings() { return ( <> @@ -185,3 +187,5 @@ export default function AppearanceSettings() { ); } + +export default memo(AppearanceSettings); \ No newline at end of file diff --git a/src/components/modals/main/settings/sections/Experimental.jsx b/src/components/modals/main/settings/sections/Experimental.jsx index 139754d1..528533f7 100644 --- a/src/components/modals/main/settings/sections/Experimental.jsx +++ b/src/components/modals/main/settings/sections/Experimental.jsx @@ -1,5 +1,5 @@ import variables from 'modules/variables'; -import { useState } from 'react'; +import { useState, memo } from 'react'; import Checkbox from '../Checkbox'; import Slider from '../Slider'; import { TextField } from '@mui/material'; @@ -8,7 +8,7 @@ import EventBus from 'modules/helpers/eventbus'; import { values } from 'modules/helpers/settings/modals'; import SettingsItem from '../SettingsItem'; -export default function ExperimentalSettings() { +function ExperimentalSettings() { const [eventType, setEventType] = useState(); const [eventName, setEventName] = useState(); @@ -70,3 +70,5 @@ export default function ExperimentalSettings() { ); } + +export default memo(ExperimentalSettings); \ No newline at end of file diff --git a/src/components/modals/main/settings/sections/Navbar.jsx b/src/components/modals/main/settings/sections/Navbar.jsx index ded9cd50..e7d61f38 100644 --- a/src/components/modals/main/settings/sections/Navbar.jsx +++ b/src/components/modals/main/settings/sections/Navbar.jsx @@ -1,6 +1,6 @@ import variables from 'modules/variables'; -import { useState } from 'react'; +import { useState, memo } from 'react'; import Checkbox from '../Checkbox'; import Dropdown from '../Dropdown'; @@ -8,7 +8,7 @@ import Dropdown from '../Dropdown'; import SettingsItem from '../SettingsItem'; import Header from '../Header'; -export default function Navbar() { +function Navbar() { const [showRefreshOptions, setShowRefreshOptions] = useState( localStorage.getItem('refresh') === 'true', ); @@ -86,3 +86,5 @@ export default function Navbar() { ); } + +export default memo(Navbar); diff --git a/src/components/modals/main/settings/sections/QuickLinks.jsx b/src/components/modals/main/settings/sections/QuickLinks.jsx index 2739f452..0443fe43 100644 --- a/src/components/modals/main/settings/sections/QuickLinks.jsx +++ b/src/components/modals/main/settings/sections/QuickLinks.jsx @@ -161,7 +161,7 @@ export default class QuickLinks extends PureComponent { url + item.url.replace('https://', '').replace('http://', '') + (useProxy ? '.ico' : ''); const link = ( -
+
{item.name}
diff --git a/src/components/modals/main/settings/sections/background/CustomURLModal.jsx b/src/components/modals/main/settings/sections/background/CustomURLModal.jsx index 5aa1bf47..ab7d5e88 100644 --- a/src/components/modals/main/settings/sections/background/CustomURLModal.jsx +++ b/src/components/modals/main/settings/sections/background/CustomURLModal.jsx @@ -1,9 +1,9 @@ import variables from 'modules/variables'; -import { useState } from 'react'; +import { useState, memo } from 'react'; import { MdAdd, MdClose } from 'react-icons/md'; import Tooltip from '../../../../../helpers/tooltip/Tooltip'; -export default function CustomURLModal({ modalClose, modalCloseOnly }) { +function CustomURLModal({ modalClose, modalCloseOnly }) { const [url, setURL] = useState(); return ( @@ -39,3 +39,5 @@ export default function CustomURLModal({ modalClose, modalCloseOnly }) {
); } + +export default memo(CustomURLModal); \ No newline at end of file diff --git a/src/components/modals/main/settings/sections/overview_skeletons/Clock.jsx b/src/components/modals/main/settings/sections/overview_skeletons/Clock.jsx index 26ef7a14..97e15591 100644 --- a/src/components/modals/main/settings/sections/overview_skeletons/Clock.jsx +++ b/src/components/modals/main/settings/sections/overview_skeletons/Clock.jsx @@ -1,7 +1,7 @@ -import { Suspense, lazy } from 'react'; +import { Suspense, lazy, memo } from 'react'; const Analog = lazy(() => import('react-clock')); -export default function ClockSkeleton() { +function ClockSkeleton() { if (localStorage.getItem('timeType') === 'analogue') { return ( }> @@ -27,3 +27,5 @@ export default function ClockSkeleton() { return 10:24; } } + +export default memo(ClockSkeleton); \ No newline at end of file diff --git a/src/components/modals/main/settings/sections/overview_skeletons/Date.jsx b/src/components/modals/main/settings/sections/overview_skeletons/Date.jsx index bac49103..356102e0 100644 --- a/src/components/modals/main/settings/sections/overview_skeletons/Date.jsx +++ b/src/components/modals/main/settings/sections/overview_skeletons/Date.jsx @@ -1,7 +1,11 @@ -export default function DateSkeleton() { +import { memo } from 'react'; + +function DateSkeleton() { return ( Thursday January 1st ); } + +export default memo(DateSkeleton); \ No newline at end of file diff --git a/src/components/modals/main/settings/sections/overview_skeletons/Greeting.jsx b/src/components/modals/main/settings/sections/overview_skeletons/Greeting.jsx index 8cee1e1e..c55a95eb 100644 --- a/src/components/modals/main/settings/sections/overview_skeletons/Greeting.jsx +++ b/src/components/modals/main/settings/sections/overview_skeletons/Greeting.jsx @@ -1,3 +1,7 @@ -export default function GreetingSkeleton() { +import { memo } from 'react'; + +function GreetingSkeleton() { return Good Morning; } + +export default memo(GreetingSkeleton); \ No newline at end of file diff --git a/src/components/modals/main/settings/sections/overview_skeletons/Message.jsx b/src/components/modals/main/settings/sections/overview_skeletons/Message.jsx index 122468be..1b878ab9 100644 --- a/src/components/modals/main/settings/sections/overview_skeletons/Message.jsx +++ b/src/components/modals/main/settings/sections/overview_skeletons/Message.jsx @@ -1,4 +1,6 @@ -export default function MessageSkeleton() { +import { memo } from 'react'; + +function MessageSkeleton() { return (

@@ -8,3 +10,5 @@ export default function MessageSkeleton() {

); } + +export default memo(MessageSkeleton); \ No newline at end of file diff --git a/src/components/modals/main/settings/sections/overview_skeletons/QuickLinks.jsx b/src/components/modals/main/settings/sections/overview_skeletons/QuickLinks.jsx index 04072a53..cbcee43a 100644 --- a/src/components/modals/main/settings/sections/overview_skeletons/QuickLinks.jsx +++ b/src/components/modals/main/settings/sections/overview_skeletons/QuickLinks.jsx @@ -1,7 +1,8 @@ +import { memo } from 'react'; import { FaDiscord, FaTwitter } from 'react-icons/fa'; import { SiKofi, SiPatreon } from 'react-icons/si'; -export default function QuicklinksSkeleton() { +function QuicklinksSkeleton() { return (
@@ -21,3 +22,5 @@ export default function QuicklinksSkeleton() {
); } + +export default memo(QuicklinksSkeleton); \ No newline at end of file diff --git a/src/components/modals/main/settings/sections/overview_skeletons/Quote.jsx b/src/components/modals/main/settings/sections/overview_skeletons/Quote.jsx index 327737ac..c507dfc8 100644 --- a/src/components/modals/main/settings/sections/overview_skeletons/Quote.jsx +++ b/src/components/modals/main/settings/sections/overview_skeletons/Quote.jsx @@ -1,6 +1,7 @@ +import { memo } from 'react'; import { MdPerson } from 'react-icons/md'; -export default function QuoteSkeleton() { +function QuoteSkeleton() { return (
"Never gonna give you up" @@ -16,3 +17,5 @@ export default function QuoteSkeleton() {
); } + +export default memo(QuoteSkeleton); \ No newline at end of file diff --git a/src/components/modals/main/settings/sections/quicklinks/AddModal.jsx b/src/components/modals/main/settings/sections/quicklinks/AddModal.jsx index 41abbc17..5b200096 100644 --- a/src/components/modals/main/settings/sections/quicklinks/AddModal.jsx +++ b/src/components/modals/main/settings/sections/quicklinks/AddModal.jsx @@ -1,11 +1,11 @@ -import { useState } from 'react'; +import { useState, memo } from 'react'; import { TextareaAutosize } from '@mui/material'; import { MdAddLink, MdClose } from 'react-icons/md'; import Tooltip from 'components/helpers/tooltip/Tooltip'; import variables from 'modules/variables'; -export default function AddModal({ urlError, addLink, closeModal, edit, editData, editLink }) { +function AddModal({ urlError, addLink, closeModal, edit, editData, editLink }) { const [name, setName] = useState(edit ? editData.name : ''); const [url, setUrl] = useState(edit ? editData.url : ''); const [icon, setIcon] = useState(edit ? editData.url : ''); @@ -55,3 +55,5 @@ export default function AddModal({ urlError, addLink, closeModal, edit, editData
); } + +export default memo(AddModal); \ No newline at end of file diff --git a/src/components/modals/main/tabs/Addons.jsx b/src/components/modals/main/tabs/Addons.jsx index f9e7847d..9f548fda 100644 --- a/src/components/modals/main/tabs/Addons.jsx +++ b/src/components/modals/main/tabs/Addons.jsx @@ -1,10 +1,11 @@ import variables from 'modules/variables'; +import { memo } from 'react'; import Tabs from './backend/Tabs'; import Added from '../marketplace/sections/Added'; import Create from '../marketplace/sections/Create'; -export default function Addons(props) { +function Addons(props) { return ( props.changeTab(type)} current="addons">
@@ -16,3 +17,5 @@ export default function Addons(props) { ); } + +export default memo(Addons); diff --git a/src/components/modals/main/tabs/Marketplace.jsx b/src/components/modals/main/tabs/Marketplace.jsx index 50810c84..207d5c50 100644 --- a/src/components/modals/main/tabs/Marketplace.jsx +++ b/src/components/modals/main/tabs/Marketplace.jsx @@ -1,9 +1,11 @@ import variables from 'modules/variables'; +import { memo } from 'react'; + import Tabs from './backend/Tabs'; import MarketplaceTab from '../marketplace/sections/Marketplace'; -export default function Marketplace(props) { +function Marketplace(props) { return ( props.changeTab(type)} current="marketplace">
@@ -27,3 +29,5 @@ export default function Marketplace(props) { ); } + +export default memo(Marketplace); \ No newline at end of file diff --git a/src/components/modals/main/tabs/Settings.jsx b/src/components/modals/main/tabs/Settings.jsx index 82905937..822896a2 100644 --- a/src/components/modals/main/tabs/Settings.jsx +++ b/src/components/modals/main/tabs/Settings.jsx @@ -1,4 +1,6 @@ import variables from 'modules/variables'; +import { memo } from 'react'; + import Tabs from './backend/Tabs'; import Overview from '../settings/sections/Overview'; @@ -20,7 +22,7 @@ import Experimental from '../settings/sections/Experimental'; import Changelog from '../settings/sections/Changelog'; import About from '../settings/sections/About'; -export default function Settings(props) { +function Settings(props) { return ( props.changeTab(type)} current="settings">
@@ -113,3 +115,5 @@ export default function Settings(props) { ); } + +export default memo(Settings); \ No newline at end of file diff --git a/src/components/modals/welcome/ProgressBar.jsx b/src/components/modals/welcome/ProgressBar.jsx index 4a37579d..07926079 100644 --- a/src/components/modals/welcome/ProgressBar.jsx +++ b/src/components/modals/welcome/ProgressBar.jsx @@ -1,4 +1,6 @@ -export default function ProgressBar({ count, currentTab, switchTab }) { +import { memo } from 'react'; + +function ProgressBar({ count, currentTab, switchTab }) { return (
{count.map((num) => { @@ -14,3 +16,5 @@ export default function ProgressBar({ count, currentTab, switchTab }) {
); } + +export default memo(ProgressBar); \ No newline at end of file diff --git a/src/components/widgets/background/PhotoInformation.jsx b/src/components/widgets/background/PhotoInformation.jsx index 67758b02..50368961 100644 --- a/src/components/widgets/background/PhotoInformation.jsx +++ b/src/components/widgets/background/PhotoInformation.jsx @@ -1,5 +1,5 @@ import variables from 'modules/variables'; -import { useState } from 'react'; +import { useState, memo } from 'react'; import Favourite from './Favourite'; import { MdInfo, @@ -34,7 +34,7 @@ const downloadImage = async (info) => { variables.stats.postEvent('feature', 'Background download'); }; -export default function PhotoInformation({ info, url, api }) { +function PhotoInformation({ info, url, api }) { const [width, setWidth] = useState(0); const [height, setHeight] = useState(0); const [usePhotoMap, setPhotoMap] = useState(false); @@ -295,3 +295,5 @@ export default function PhotoInformation({ info, url, api }) {
); } + +export default memo(PhotoInformation); \ No newline at end of file diff --git a/src/components/widgets/navbar/Notes.jsx b/src/components/widgets/navbar/Notes.jsx index 8a267fcd..17218c3f 100644 --- a/src/components/widgets/navbar/Notes.jsx +++ b/src/components/widgets/navbar/Notes.jsx @@ -1,5 +1,5 @@ import variables from 'modules/variables'; -import { PureComponent } from 'react'; +import { PureComponent, memo } 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'; @@ -144,7 +144,7 @@ class Notes extends PureComponent { } } -export default function NotesWrapper() { +function NotesWrapper() { const { x, y, reference, floating, strategy } = useFloating({ placement: 'bottom', middleware: [shift()], @@ -160,3 +160,5 @@ export default function NotesWrapper() { /> ); } + +export default memo(NotesWrapper); \ No newline at end of file diff --git a/src/components/widgets/navbar/Todo.jsx b/src/components/widgets/navbar/Todo.jsx index 8245787b..841d3e31 100644 --- a/src/components/widgets/navbar/Todo.jsx +++ b/src/components/widgets/navbar/Todo.jsx @@ -1,5 +1,5 @@ import variables from 'modules/variables'; -import { PureComponent } from 'react'; +import { PureComponent, memo } from 'react'; import { MdChecklist, MdPushPin, @@ -211,7 +211,7 @@ class Todo extends PureComponent { } } -export default function TodoWrapper() { +function TodoWrapper() { const { x, y, reference, floating, strategy } = useFloating({ placement: 'bottom', middleware: [shift()], @@ -221,3 +221,5 @@ export default function TodoWrapper() { ); } + +export default memo(TodoWrapper); \ No newline at end of file diff --git a/src/components/widgets/weather/Expanded.jsx b/src/components/widgets/weather/Expanded.jsx index ba564e64..5b6b7604 100644 --- a/src/components/widgets/weather/Expanded.jsx +++ b/src/components/widgets/weather/Expanded.jsx @@ -1,3 +1,5 @@ +import { memo } from 'react'; + import { WiHumidity, WiWindy, WiBarometer, WiCloud } from 'react-icons/wi'; import { MdDisabledVisible } from 'react-icons/md'; @@ -6,7 +8,7 @@ import WindDirectionIcon from './WindDirectionIcon'; import Tooltip from '../../helpers/tooltip/Tooltip'; -export default function Expanded({ state, weatherType, variables }) { +function Expanded({ state, weatherType, variables }) { const enabled = (setting) => { return (localStorage.getItem(setting) === 'true' && weatherType >= 3) || weatherType === '3'; }; @@ -107,3 +109,5 @@ export default function Expanded({ state, weatherType, variables }) {
); } + +export default memo(Expanded); \ No newline at end of file diff --git a/src/components/widgets/weather/WeatherIcon.jsx b/src/components/widgets/weather/WeatherIcon.jsx index 0252cbcd..dca9db05 100644 --- a/src/components/widgets/weather/WeatherIcon.jsx +++ b/src/components/widgets/weather/WeatherIcon.jsx @@ -1,3 +1,5 @@ +import { memo } from 'react'; + import { WiDaySunny, WiNightClear, @@ -13,7 +15,7 @@ import { WiFog, } from 'react-icons/wi'; -export default function WeatherIcon({ name }) { +function WeatherIcon({ name }) { // name is the openweathermap icon name, see https://openweathermap.org/weather-conditions switch (name) { case '01d': @@ -50,3 +52,5 @@ export default function WeatherIcon({ name }) { return null; } } + +export default memo(WeatherIcon); \ No newline at end of file diff --git a/src/components/widgets/weather/WindDirectionIcon.jsx b/src/components/widgets/weather/WindDirectionIcon.jsx index 0002cd82..2a91dbc5 100644 --- a/src/components/widgets/weather/WindDirectionIcon.jsx +++ b/src/components/widgets/weather/WindDirectionIcon.jsx @@ -1,3 +1,6 @@ + +import { memo } from 'react'; + import { WiDirectionDownLeft, WiDirectionDownRight, @@ -10,7 +13,7 @@ import { } from 'react-icons/wi'; // degrees are imported because of a potential bug, IDK what causes it, but now it is fixed -export default function WindDirectionIcon({ degrees }) { +function WindDirectionIcon({ degrees }) { // convert the number OpenWeatherMap gives us to the closest direction or something const directions = [ 'North', @@ -46,3 +49,5 @@ export default function WindDirectionIcon({ degrees }) { return null; } } + +export default memo(WindDirectionIcon); \ No newline at end of file