From 0dbd8a0f8c9c1e5bbddce803bc3fb37db9f29359 Mon Sep 17 00:00:00 2001
From: Manav Rathi <manav@mrmr.io>
Date: Fri, 29 Nov 2024 14:50:33 +0530
Subject: [PATCH] Memo context to avoid unnecessary renders

---
 web/apps/photos/src/pages/_app.tsx | 37 +++++++++++++++---------------
 1 file changed, 19 insertions(+), 18 deletions(-)

diff --git a/web/apps/photos/src/pages/_app.tsx b/web/apps/photos/src/pages/_app.tsx
index ab1b816649..08354383ca 100644
--- a/web/apps/photos/src/pages/_app.tsx
+++ b/web/apps/photos/src/pages/_app.tsx
@@ -44,7 +44,7 @@ import { t } from "i18next";
 import type { AppProps } from "next/app";
 import { useRouter } from "next/router";
 import "photoswipe/dist/photoswipe.css";
-import { useCallback, useEffect, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import LoadingBar from "react-top-loading-bar";
 import { resumeExportsIfNeeded } from "services/export";
 import { photosLogout } from "services/logout";
@@ -156,8 +156,6 @@ export default function App({ Component, pageProps }: AppProps) {
         setNotificationView(true);
     }, [notificationAttributes]);
 
-    const showNavBar = (show: boolean) => setShowNavBar(show);
-
     const onGenericError = useCallback((e: unknown) => {
         log.error(e);
         // The generic error handler is sometimes called in the context of
@@ -172,21 +170,24 @@ export default function App({ Component, pageProps }: AppProps) {
 
     const logout = useCallback(() => void photosLogout(), []);
 
-    const appContext = {
-        showNavBar,
-        showLoadingBar,
-        hideLoadingBar,
-        watchFolderView,
-        setWatchFolderView,
-        watchFolderFiles,
-        setWatchFolderFiles,
-        setNotificationAttributes,
-        themeColor,
-        setThemeColor,
-        showMiniDialog,
-        onGenericError,
-        logout,
-    };
+    const appContext = useMemo(
+        () => ({
+            showNavBar: (show: boolean) => setShowNavBar(show),
+            showLoadingBar,
+            hideLoadingBar,
+            watchFolderView,
+            setWatchFolderView,
+            watchFolderFiles,
+            setWatchFolderFiles,
+            setNotificationAttributes,
+            themeColor,
+            setThemeColor,
+            showMiniDialog,
+            onGenericError,
+            logout,
+        }),
+        [showLoadingBar, hideLoadingBar, onGenericError, logout],
+    );
 
     const title = isI18nReady ? t("title_photos") : staticAppTitle;