moved authenticateUserModal to gallery

apps/photos/src/components/DeleteAccountModal.tsx

@@ -7,7 +7,6 @@ import {
     getAccountDeleteChallenge,
     logoutUser,
 } from 'services/userService';
-import AuthenticateUserModal from './AuthenticateUserModal';
 import { logError } from 'utils/sentry';
 import { decryptDeleteAccountChallenge } from 'utils/crypto';
 import { Trans } from 'react-i18next';
@@ -20,6 +19,7 @@ import DropdownInput, { DropdownOption } from './DropdownInput';
 import MultilineInput from './MultilineInput';
 import { CheckboxInput } from './CheckboxInput';
 import EnteButton from './EnteButton';
+import { GalleryContext } from 'pages/gallery';
 
 interface Iprops {
     onClose: () => void;
@@ -47,14 +47,10 @@ const getReasonOptions = (): DropdownOption<DELETE_REASON>[] => {
 
 const DeleteAccountModal = ({ open, onClose }: Iprops) => {
     const { setDialogBoxAttributesV2, isMobile } = useContext(AppContext);
+    const { authenticateUser } = useContext(GalleryContext);
     const [loading, setLoading] = useState(false);
-    const [authenticateUserModalView, setAuthenticateUserModalView] =
-        useState(false);
     const deleteAccountChallenge = useRef<string>();
 
-    const openAuthenticateUserModal = () => setAuthenticateUserModalView(true);
-    const closeAuthenticateUserModal = () =>
-        setAuthenticateUserModalView(false);
     const [acceptDataDeletion, setAcceptDataDeletion] = useState(false);
     const reasonAndFeedbackRef = useRef<{ reason: string; feedback: string }>();
 
@@ -94,7 +90,7 @@ const DeleteAccountModal = ({ open, onClose }: Iprops) => {
             deleteAccountChallenge.current =
                 deleteChallengeResponse.encryptedChallenge;
             if (deleteChallengeResponse.allowDelete) {
-                openAuthenticateUserModal();
+                authenticateUser(confirmAccountDeletion);
             } else {
                 askToMailForDeletion();
             }
@@ -244,11 +240,6 @@ const DeleteAccountModal = ({ open, onClose }: Iprops) => {
                     )}
                 </Formik>
             </DialogBoxV2>
-            <AuthenticateUserModal
-                open={authenticateUserModalView}
-                onClose={closeAuthenticateUserModal}
-                onAuthenticate={confirmAccountDeletion}
-            />
         </>
     );
 };

apps/photos/src/pages/gallery/index.tsx

@@ -112,6 +112,7 @@ import uploadManager from 'services/upload/uploadManager';
 import { getToken } from 'utils/common/key';
 import ExportModal from 'components/ExportModal';
 import GalleryEmptyState from 'components/GalleryEmptyState';
+import AuthenticateUserModal from 'components/AuthenticateUserModal';
 
 export const DeadCenter = styled('div')`
     flex: 1;
@@ -131,6 +132,7 @@ const defaultGalleryContext: GalleryContextType = {
     setBlockingLoad: () => null,
     photoListHeader: null,
     openExportModal: () => null,
+    authenticateUser: () => null,
 };
 
 export const GalleryContext = createContext<GalleryContextType>(
@@ -226,6 +228,18 @@ export default function Gallery() {
 
     const [exportModalView, setExportModalView] = useState(false);
 
+    const [authenticateUserModalView, setAuthenticateUserModalView] =
+        useState(false);
+
+    const onAuthenticateCallback = useRef<() => void>();
+
+    const authenticateUser = (callback: () => void) => {
+        onAuthenticateCallback.current = callback;
+        setAuthenticateUserModalView(true);
+    };
+    const closeAuthenticateUserModal = () =>
+        setAuthenticateUserModalView(false);
+
     const showSessionExpiredMessage = () =>
         setDialogMessage({
             title: t('SESSION_EXPIRED'),
@@ -627,6 +641,7 @@ export default function Gallery() {
                 setBlockingLoad,
                 photoListHeader,
                 openExportModal,
+                authenticateUser,
             }}>
             <FullScreenDropZone
                 getDragAndDropRootProps={getDragAndDropRootProps}>
@@ -818,6 +833,11 @@ export default function Gallery() {
                         />
                     )}
                 <ExportModal show={exportModalView} onHide={closeExportModal} />
+                <AuthenticateUserModal
+                    open={authenticateUserModalView}
+                    onClose={closeAuthenticateUserModal}
+                    onAuthenticate={onAuthenticateCallback.current}
+                />
             </FullScreenDropZone>
         </GalleryContext.Provider>
     );

apps/photos/src/types/gallery/index.ts

@@ -34,4 +34,5 @@ export type GalleryContextType = {
     setBlockingLoad: (value: boolean) => void;
     photoListHeader: TimeStampListItem;
     openExportModal: () => void;
+    authenticateUser: (callback: () => void) => void;
 };