From 651575ec6ebf07d27c4bb73e0c4b950b2d5b987b Mon Sep 17 00:00:00 2001
From: Manav Rathi <manav@mrmr.io>
Date: Fri, 11 Oct 2024 13:20:48 +0530
Subject: [PATCH] Update

---
 web/apps/photos/src/components/Sidebar/index.tsx | 14 +++++++-------
 web/packages/base/components/utils/modal.ts      |  5 +++--
 2 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/web/apps/photos/src/components/Sidebar/index.tsx b/web/apps/photos/src/components/Sidebar/index.tsx
index 9a84b65257..118af9780c 100644
--- a/web/apps/photos/src/components/Sidebar/index.tsx
+++ b/web/apps/photos/src/components/Sidebar/index.tsx
@@ -3,14 +3,14 @@ import { isDesktop } from "@/base/app";
 import { EnteDrawer } from "@/base/components/EnteDrawer";
 import { EnteLogo } from "@/base/components/EnteLogo";
 import { ActivityIndicator } from "@/base/components/mui/ActivityIndicator";
-import { useModalVisibilityProps } from "@/base/components/utils/modal";
+import { useModalVisibility } from "@/base/components/utils/modal";
 import log from "@/base/log";
 import { savedLogs } from "@/base/log-web";
 import { customAPIHost } from "@/base/origins";
 import { RecoveryKey } from "@/new/photos/components/RecoveryKey";
 import type { CollectionSummaries } from "@/new/photos/services/collection/ui";
 import { AppContext, useAppContext } from "@/new/photos/types/context";
-import { initiateEmail, openURL } from "@/new/photos/utils/web";
+import { downloadString, initiateEmail, openURL } from "@/new/photos/utils/web";
 import { SpaceBetweenFlex } from "@ente/shared/components/Container";
 import { EnteMenuItem } from "@ente/shared/components/Menu/EnteMenuItem";
 import ThemeSwitcher from "@ente/shared/components/ThemeSwitcher";
@@ -23,7 +23,6 @@ import {
     setLSUser,
 } from "@ente/shared/storage/localStorage";
 import { THEME_COLOR } from "@ente/shared/themes/constants";
-import { downloadAsFile } from "@ente/shared/utils";
 import ArchiveOutlined from "@mui/icons-material/ArchiveOutlined";
 import CategoryIcon from "@mui/icons-material/Category";
 import CloseIcon from "@mui/icons-material/Close";
@@ -436,7 +435,8 @@ const UtilitySection: React.FC<UtilitySectionProps> = ({ closeSidebar }) => {
         setThemeColor,
     } = appContext;
 
-    const recoveryKeyVisibility = useModalVisibilityProps();
+    const { show: showRecoveryKey, props: recoveryKeyVisibilityProps } =
+        useModalVisibility();
     const [twoFactorModalView, setTwoFactorModalView] = useState(false);
     const [preferencesView, setPreferencesView] = useState(false);
 
@@ -496,7 +496,7 @@ const UtilitySection: React.FC<UtilitySectionProps> = ({ closeSidebar }) => {
             )}
             <EnteMenuItem
                 variant="secondary"
-                onClick={openRecoveryKeyModal}
+                onClick={showRecoveryKey}
                 label={t("recovery_key")}
             />
             {isInternalUserViaEmailCheck() && (
@@ -547,7 +547,7 @@ const UtilitySection: React.FC<UtilitySectionProps> = ({ closeSidebar }) => {
                 onClick={openPreferencesOptions}
                 label={t("preferences")}
             />
-            <RecoveryKey {...recoveryKeyVisibility} />
+            <RecoveryKey {...recoveryKeyVisibilityProps} />
             <TwoFactorModal
                 show={twoFactorModalView}
                 onHide={closeTwoFactorModal}
@@ -678,7 +678,7 @@ const DebugSection: React.FC = () => {
     const downloadLogs = () => {
         log.info("Downloading logs");
         if (electron) electron.openLogDirectory();
-        else downloadAsFile(`debug_logs_${Date.now()}.txt`, savedLogs());
+        else downloadString(savedLogs(), `debug_logs_${Date.now()}.txt`);
     };
 
     return (
diff --git a/web/packages/base/components/utils/modal.ts b/web/packages/base/components/utils/modal.ts
index 6a7c0a97dc..0a2dd1588e 100644
--- a/web/packages/base/components/utils/modal.ts
+++ b/web/packages/base/components/utils/modal.ts
@@ -34,10 +34,11 @@ export type NestedDrawerVisibilityProps = ModalVisibilityProps & {
  * These props can be passed verbatim to our components that expect
  * {@link ModalVisibilityProps}.
  */
-export const useModalVisibilityProps = () => {
+export const useModalVisibility = () => {
     const [open, setOpen] = useState(false);
 
+    const show = useCallback(() => setOpen(true), []);
     const onClose = useCallback(() => setOpen(false), []);
 
-    return { open, onClose };
+    return { show, props: { open, onClose } };
 };