diff --git a/web/apps/accounts/src/pages/_app.tsx b/web/apps/accounts/src/pages/_app.tsx index 02d27bd390..32cdeff553 100644 --- a/web/apps/accounts/src/pages/_app.tsx +++ b/web/apps/accounts/src/pages/_app.tsx @@ -16,7 +16,7 @@ import { CssBaseline } from "@mui/material"; import { ThemeProvider } from "@mui/material/styles"; import { t } from "i18next"; import type { AppProps } from "next/app"; -import React, { useEffect, useState } from "react"; +import React, { useCallback, useEffect, useState } from "react"; import { AppContext } from "../types/context"; import "styles/global.css"; @@ -24,10 +24,23 @@ import "styles/global.css"; const App: React.FC = ({ Component, pageProps }) => { const [isI18nReady, setIsI18nReady] = useState(false); const [showNavbar, setShowNavbar] = useState(false); - const [dialogBoxAttributeV2, setDialogBoxAttributesV2] = useState< + + // Mini Dialog scaffolding -- + + const [miniDialogAttributes, setMiniDialogAttributes] = useState< MiniDialogAttributes | undefined >(); - const [dialogBoxV2View, setDialogBoxV2View] = useState(false); + + const [openMiniDialog, setOpenMiniDialog] = useState(false); + + const showMiniDialog = useCallback((attributes: MiniDialogAttributes) => { + setMiniDialogAttributes(attributes); + setOpenMiniDialog(true); + }, []); + + const closeMiniDialog = useCallback(() => setOpenMiniDialog(false), []); + + // -- useEffect(() => { disableDiskLogs(); @@ -36,12 +49,6 @@ const App: React.FC = ({ Component, pageProps }) => { return () => logUnhandledErrorsAndRejections(false); }, []); - useEffect(() => { - setDialogBoxV2View(true); - }, [dialogBoxAttributeV2]); - - const closeDialogBoxV2 = () => setDialogBoxV2View(false); - const appContext = { showNavBar: setShowNavbar, setDialogBoxAttributesV2, diff --git a/web/apps/photos/src/components/Sidebar/index.tsx b/web/apps/photos/src/components/Sidebar/index.tsx index 0275a1f92a..6f54c88582 100644 --- a/web/apps/photos/src/components/Sidebar/index.tsx +++ b/web/apps/photos/src/components/Sidebar/index.tsx @@ -682,14 +682,10 @@ const DebugSection: React.FC = () => { showMiniDialog({ title: t("DOWNLOAD_LOGS"), message: , - proceed: { + continue: { text: t("download"), - variant: "accent", action: downloadLogs, }, - close: { - text: t("cancel"), - }, }); const downloadLogs = () => { diff --git a/web/packages/accounts/types/context.ts b/web/packages/accounts/types/context.ts index ae9fd7b9b6..d625db096c 100644 --- a/web/packages/accounts/types/context.ts +++ b/web/packages/accounts/types/context.ts @@ -5,9 +5,20 @@ import type { MiniDialogAttributes } from "@/base/components/MiniDialog"; * defer to the pages provided by the accounts package. */ export interface AccountsContextT { - /** Perform the (possibly app specific) logout sequence. */ + /** + * Perform the (possibly app specific) logout sequence. + */ logout: () => void; - /** Show or hide the app's navigation bar. */ + /** + * Show or hide the app's navigation bar. + */ showNavBar: (show: boolean) => void; - setDialogBoxAttributesV2: (attrs: MiniDialogAttributes) => void; + /** + * Show a "mini dialog" with the given attributes. + * + * Mini dialogs (see {@link AttributedMiniDialog}) are meant for simple + * confirmation or notications. Their appearance and functionality can be + * customized by providing appropriate {@link MiniDialogAttributes}. + */ + showMiniDialog: (attributes: MiniDialogAttributes) => void; } diff --git a/web/packages/new/photos/types/context.ts b/web/packages/new/photos/types/context.ts index 4c11a9bb01..993bab29e5 100644 --- a/web/packages/new/photos/types/context.ts +++ b/web/packages/new/photos/types/context.ts @@ -4,7 +4,6 @@ import type { SetDialogBoxAttributes } from "@ente/shared/components/DialogBox/t import { THEME_COLOR } from "@ente/shared/themes/constants"; import { createContext, useContext } from "react"; import type { SetNotificationAttributes } from "./notification"; -import type { MiniDialogAttributes } from "@/base/components/MiniDialog"; /** * The type of the React context available to all pages in the photos app. @@ -18,18 +17,10 @@ export type AppContextT = AccountsContextT & { * Hide the global activity indicator. */ finishLoading: () => void; - /** - * Show a "mini dialog" with the given attributes. - * - * Mini dialogs (see {@link AttributedMiniDialog}) are meant for simple - * confirmation or notication dialogs. Their appearance and functionality - * can be customized by providing relevant {@link MiniDialogAttributes}. - */ - showMiniDialog: (attributes: MiniDialogAttributes) => void; + onGenericError: (error: unknown) => void; somethingWentWrong: () => void; setDialogMessage: SetDialogBoxAttributes; setNotificationAttributes: SetNotificationAttributes; - onGenericError: (error: unknown) => void; closeMessageDialog: () => void; mapEnabled: boolean; updateMapEnabled: (enabled: boolean) => Promise;