From 5147efd123da14eac7a9bb3b1b8335b1e7a63cd4 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Sat, 9 Sep 2023 14:09:50 +0800
Subject: [PATCH] memo all the things

Somehow things got slower on local dev
---
 src/components/background-service.jsx      | 5 +++--
 src/components/keyboard-shortcuts-help.jsx | 5 +++--
 src/components/notification-service.jsx    | 5 +++--
 src/components/search-command.jsx          | 5 +++--
 4 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/src/components/background-service.jsx b/src/components/background-service.jsx
index bd21b3f7..ecaad095 100644
--- a/src/components/background-service.jsx
+++ b/src/components/background-service.jsx
@@ -1,3 +1,4 @@
+import { memo } from 'preact/compat';
 import { useEffect, useRef, useState } from 'preact/hooks';
 
 import { api } from '../utils/api';
@@ -5,7 +6,7 @@ import states, { saveStatus } from '../utils/states';
 import useInterval from '../utils/useInterval';
 import usePageVisibility from '../utils/usePageVisibility';
 
-export default function BackgroundService({ isLoggedIn }) {
+export default memo(function BackgroundService({ isLoggedIn }) {
   // Notifications service
   // - WebSocket to receive notifications when page is visible
   const [visible, setVisible] = useState(true);
@@ -89,4 +90,4 @@ export default function BackgroundService({ isLoggedIn }) {
   });
 
   return null;
-}
+});
diff --git a/src/components/keyboard-shortcuts-help.jsx b/src/components/keyboard-shortcuts-help.jsx
index a3739ce8..70ec7e5a 100644
--- a/src/components/keyboard-shortcuts-help.jsx
+++ b/src/components/keyboard-shortcuts-help.jsx
@@ -1,5 +1,6 @@
 import './keyboard-shortcuts-help.css';
 
+import { memo } from 'preact/compat';
 import { useHotkeys } from 'react-hotkeys-hook';
 import { useSnapshot } from 'valtio';
 
@@ -8,7 +9,7 @@ import states from '../utils/states';
 import Icon from './icon';
 import Modal from './modal';
 
-export default function KeyboardShortcutsHelp() {
+export default memo(function KeyboardShortcutsHelp() {
   const snapStates = useSnapshot(states);
 
   function onClose() {
@@ -161,4 +162,4 @@ export default function KeyboardShortcutsHelp() {
       </Modal>
     )
   );
-}
+});
diff --git a/src/components/notification-service.jsx b/src/components/notification-service.jsx
index 970fd9a8..f73a1449 100644
--- a/src/components/notification-service.jsx
+++ b/src/components/notification-service.jsx
@@ -1,3 +1,4 @@
+import { memo } from 'preact/compat';
 import { useLayoutEffect, useState } from 'preact/hooks';
 import { useSnapshot } from 'valtio';
 
@@ -14,7 +15,7 @@ import Link from './link';
 import Modal from './modal';
 import Notification from './notification';
 
-export default function NotificationService() {
+export default memo(function NotificationService() {
   if (!('serviceWorker' in navigator)) return null;
 
   const snapStates = useSnapshot(states);
@@ -179,4 +180,4 @@ export default function NotificationService() {
   }
 
   return null;
-}
+});
diff --git a/src/components/search-command.jsx b/src/components/search-command.jsx
index 591ab270..5b58efa7 100644
--- a/src/components/search-command.jsx
+++ b/src/components/search-command.jsx
@@ -1,11 +1,12 @@
 import './search-command.css';
 
+import { memo } from 'preact/compat';
 import { useRef, useState } from 'preact/hooks';
 import { useHotkeys } from 'react-hotkeys-hook';
 
 import SearchForm from './search-form';
 
-export default function SearchCommand({ onClose = () => {} }) {
+export default memo(function SearchCommand({ onClose = () => {} }) {
   const [showSearch, setShowSearch] = useState(false);
   const searchFormRef = useRef(null);
 
@@ -64,4 +65,4 @@ export default function SearchCommand({ onClose = () => {} }) {
       />
     </div>
   );
-}
+});