diff --git a/web/apps/photos/src/components/Sidebar/AdvancedSettings.tsx b/web/apps/photos/src/components/Sidebar/AdvancedSettings.tsx
index 5810834636..5dfd95b30c 100644
--- a/web/apps/photos/src/components/Sidebar/AdvancedSettings.tsx
+++ b/web/apps/photos/src/components/Sidebar/AdvancedSettings.tsx
@@ -1,15 +1,27 @@
+import { MLSettingsBeta } from "@/new/photos/components/MLSettingsBeta";
+import { canEnableML } from "@/new/photos/services/ml";
import { EnteDrawer } from "@/new/shared/components/EnteDrawer";
import { MenuItemGroup, MenuSectionTitle } from "@/new/shared/components/Menu";
import { Titlebar } from "@/new/shared/components/Titlebar";
+import { isDesktop } from "@/next/app";
+import { pt } from "@/next/i18n";
import { EnteMenuItem } from "@ente/shared/components/Menu/EnteMenuItem";
+import ChevronRight from "@mui/icons-material/ChevronRight";
+import ScienceIcon from "@mui/icons-material/Science";
import { Box, DialogProps, Stack } from "@mui/material";
import { t } from "i18next";
import { AppContext } from "pages/_app";
-import { useContext } from "react";
+import { useContext, useEffect, useState } from "react";
export default function AdvancedSettings({ open, onClose, onRootClose }) {
const appContext = useContext(AppContext);
+ const [showMLSettings, setShowMLSettings] = useState(false);
+ const [openMLSettings, setOpenMLSettings] = useState(false);
+
+ useEffect(() => {
+ if (isDesktop) void canEnableML().then(setShowMLSettings);
+ }, []);
const handleRootClose = () => {
onClose();
onRootClose();
@@ -59,8 +71,30 @@ export default function AdvancedSettings({ open, onClose, onRootClose }) {
/>
+
+ {showMLSettings && (
+
+ }
+ />
+
+ }
+ onClick={() => setOpenMLSettings(true)}
+ label={pt("ML search")}
+ />
+
+
+ )}
+
+ setOpenMLSettings(false)}
+ onRootClose={handleRootClose}
+ />
);
}
diff --git a/web/packages/new/photos/components/MLSettingsBeta.tsx b/web/packages/new/photos/components/MLSettingsBeta.tsx
new file mode 100644
index 0000000000..8e50a6119a
--- /dev/null
+++ b/web/packages/new/photos/components/MLSettingsBeta.tsx
@@ -0,0 +1,60 @@
+import { EnteDrawer } from "@/new/shared/components/EnteDrawer";
+import { Titlebar } from "@/new/shared/components/Titlebar";
+import { pt, ut } from "@/next/i18n";
+import { Box, Stack, Typography, type DialogProps } from "@mui/material";
+import React from "react";
+
+interface MLSettingsBetaProps {
+ /** If `true`, then this drawer page is shown. */
+ open: boolean;
+ /** Called when the user wants to go back from this drawer page. */
+ onClose: () => void;
+ /** Called when the user wants to close the entire stack of drawers. */
+ onRootClose: () => void;
+}
+
+export const MLSettingsBeta: React.FC = ({
+ open,
+ onClose,
+ onRootClose,
+}) => {
+ const handleRootClose = () => {
+ onClose();
+ onRootClose();
+ };
+
+ const handleDrawerClose: DialogProps["onClose"] = (_, reason) => {
+ if (reason == "backdropClick") handleRootClose();
+ else onClose();
+ };
+
+ return (
+
+
+
+
+
+
+
+ {ut(
+ "We're putting finishing touches, coming back soon!",
+ )}
+
+
+
+
+
+ );
+};
diff --git a/web/packages/new/photos/services/ml/index.ts b/web/packages/new/photos/services/ml/index.ts
index 54eaac31ae..64571f1de0 100644
--- a/web/packages/new/photos/services/ml/index.ts
+++ b/web/packages/new/photos/services/ml/index.ts
@@ -10,6 +10,7 @@ import { ensureElectron } from "@/next/electron";
import log from "@/next/log";
import { ComlinkWorker } from "@/next/worker/comlink-worker";
import { proxy } from "comlink";
+import { isBetaUser, isInternalUser } from "../feature-flags";
import { getRemoteFlag, updateRemoteFlag } from "../remote-store";
import type { UploadItem } from "../upload/types";
import { regenerateFaceCrops } from "./crop";
@@ -103,7 +104,17 @@ export const terminateMLWorker = () => {
*
* ML currently only works when we're running in our desktop app.
*/
-export const isMLSupported = isDesktop;
+// TODO-ML:
+export const isMLSupported =
+ isDesktop && process.env.NEXT_PUBLIC_ENTE_ENABLE_WIP_ML;
+
+/**
+ * Was this someone who might've enabled the beta ML? If so, show them the
+ * coming back soon banner while we finalize it.
+ * TODO-ML:
+ */
+export const canEnableML = async () =>
+ (await isInternalUser()) || (await isBetaUser());
/**
* Initialize the ML subsystem if the user has enabled it in preferences.