From 2e3765aa776bccb79a5d5d0d8fd31cf84737f035 Mon Sep 17 00:00:00 2001
From: Shailesh Pandit <shailesh.pandit@gmail.com>
Date: Mon, 24 Jan 2022 20:02:50 +0530
Subject: [PATCH] Add warning dialog before enabling ml search

---
 src/components/Sidebar.tsx             | 24 +++++++++++++++++++++---
 src/pages/_app.tsx                     |  1 +
 src/utils/strings/englishConstants.tsx |  7 +++++++
 3 files changed, 29 insertions(+), 3 deletions(-)

diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index 73e634254..674d61a9d 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -58,6 +58,12 @@ export default function Sidebar(props: Props) {
     const [fixLargeThumbsView, setFixLargeThumbsView] = useState(false);
     const galleryContext = useContext(GalleryContext);
     const appContext = useContext(AppContext);
+    const enableMlSearch = async () => {
+        await appContext.updateMlSearchEnabled(true);
+    };
+    const disableMlSearch = async () => {
+        await appContext.updateMlSearchEnabled(false);
+    };
     useEffect(() => {
         const main = async () => {
             if (!isOpen) {
@@ -302,9 +308,21 @@ export default function Sidebar(props: Props) {
                 <LinkButton
                     style={{ marginTop: '30px' }}
                     onClick={() => {
-                        appContext.updateMlSearchEnabled(
-                            !appContext.mlSearchEnabled
-                        );
+                        if (!appContext.mlSearchEnabled) {
+                            props.setDialogMessage({
+                                title: `${constants.CONFIRM} ${constants.ENABLE_ML_SEARCH}`,
+                                content: constants.ENABLE_ML_SEARCH_MESSAGE,
+                                staticBackdrop: true,
+                                proceed: {
+                                    text: constants.ENABLE_ML_SEARCH,
+                                    action: enableMlSearch,
+                                    variant: 'success',
+                                },
+                                close: { text: constants.CANCEL },
+                            });
+                        } else {
+                            disableMlSearch();
+                        }
                     }}>
                     {appContext.mlSearchEnabled
                         ? constants.DISABLE_ML_SEARCH
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
index 19a002207..70967c98e 100644
--- a/src/pages/_app.tsx
+++ b/src/pages/_app.tsx
@@ -501,6 +501,7 @@ export interface FlashMessage {
     message: string;
     type: FLASH_MESSAGE_TYPE;
 }
+// TODO: AppContext is not cleared after logout
 export const AppContext = createContext<AppContextType>(null);
 
 const redirectMap = {
diff --git a/src/utils/strings/englishConstants.tsx b/src/utils/strings/englishConstants.tsx
index cbc10cb19..8be91477c 100644
--- a/src/utils/strings/englishConstants.tsx
+++ b/src/utils/strings/englishConstants.tsx
@@ -206,6 +206,13 @@ const englishConstants = {
     REQUEST_FEATURE: 'request feature',
     ENABLE_ML_SEARCH: 'enable ML Search beta',
     DISABLE_ML_SEARCH: 'disable ML Search beta',
+    ENABLE_ML_SEARCH_MESSAGE:
+        'This will enable on-device machine learning and people search. ' +
+        'It will keep analyzing your uploaded photos locally and will store ' +
+        'all analysis data on local device. For the first run after login or ' +
+        'enabling this feature, it will download all original images on local ' +
+        'device to analyze them. So please only enable this if you are ok with ' +
+        'bandwidth and local processing of all images in your photo library.',
     ML_DEBUG: 'ML Debug',
     SUPPORT: 'support',
     CONFIRM: 'confirm',