diff --git a/web/apps/photos/src/components/Sidebar/index.tsx b/web/apps/photos/src/components/Sidebar/index.tsx
index caa3f708e8..6e0c22f7c4 100644
--- a/web/apps/photos/src/components/Sidebar/index.tsx
+++ b/web/apps/photos/src/components/Sidebar/index.tsx
@@ -432,6 +432,7 @@ const UtilitySection: React.FC<UtilitySectionProps> = ({ closeSidebar }) => {
         setWatchFolderView,
         themeColor,
         setThemeColor,
+        showMiniDialog,
     } = appContext;
 
     const { show: showRecoveryKey, props: recoveryKeyVisibilityProps } =
@@ -527,7 +528,10 @@ const UtilitySection: React.FC<UtilitySectionProps> = ({ closeSidebar }) => {
                 label={t("preferences")}
             />
 
-            <RecoveryKey {...recoveryKeyVisibilityProps} />
+            <RecoveryKey
+                {...recoveryKeyVisibilityProps}
+                {...{ showMiniDialog }}
+            />
             <TwoFactorModal
                 {...twoFactorVisibilityProps}
                 closeSidebar={closeSidebar}
diff --git a/web/packages/accounts/pages/generate.tsx b/web/packages/accounts/pages/generate.tsx
index 17f1b836be..a1301e9833 100644
--- a/web/packages/accounts/pages/generate.tsx
+++ b/web/packages/accounts/pages/generate.tsx
@@ -32,7 +32,7 @@ import { appHomeRoute } from "../services/redirect";
 import type { PageProps } from "../types/page";
 
 const Page: React.FC<PageProps> = ({ appContext }) => {
-    const { logout } = appContext;
+    const { logout, showMiniDialog } = appContext;
 
     const [token, setToken] = useState<string>();
     const [user, setUser] = useState<User>();
@@ -107,6 +107,7 @@ const Page: React.FC<PageProps> = ({ appContext }) => {
                         setOpenRecoveryKey(false);
                         router.push(appHomeRoute);
                     }}
+                    showMiniDialog={showMiniDialog}
                 />
             ) : (
                 <VerticallyCentered>
diff --git a/web/packages/new/photos/components/RecoveryKey.tsx b/web/packages/new/photos/components/RecoveryKey.tsx
index 17a1980bd8..dfdd1f20fb 100644
--- a/web/packages/new/photos/components/RecoveryKey.tsx
+++ b/web/packages/new/photos/components/RecoveryKey.tsx
@@ -1,9 +1,9 @@
+import { type MiniDialogAttributes } from "@/base/components/MiniDialog";
 import { FocusVisibleButton } from "@/base/components/mui/FocusVisibleButton";
 import { errorDialogAttributes } from "@/base/components/utils/mini-dialog";
 import type { ModalVisibilityProps } from "@/base/components/utils/modal";
 import { useIsSmallWidth } from "@/base/hooks";
 import log from "@/base/log";
-import { useAppContext } from "@/new/photos/types/context";
 import { ensure } from "@/utils/ensure";
 import CodeBlock from "@ente/shared/components/CodeBlock";
 import DialogTitleWithCloseButton from "@ente/shared/components/DialogBox/TitleWithCloseButton";
@@ -24,12 +24,15 @@ import { downloadString } from "../utils/web";
 // mobile client library only supports english.
 bip39.setDefaultWordlist("english");
 
-export const RecoveryKey: React.FC<ModalVisibilityProps> = ({
+type RecoveryKeyProps = ModalVisibilityProps & {
+    showMiniDialog: (attributes: MiniDialogAttributes) => void;
+};
+
+export const RecoveryKey: React.FC<RecoveryKeyProps> = ({
     open,
     onClose,
+    showMiniDialog,
 }) => {
-    const { showMiniDialog } = useAppContext();
-
     const [recoveryKey, setRecoveryKey] = useState<string | undefined>();
     const fullScreen = useIsSmallWidth();