From 86f0dbb6205bb45ca73cd091d00a562fc25c602e Mon Sep 17 00:00:00 2001 From: Manav Rathi Date: Thu, 10 Oct 2024 11:49:54 +0530 Subject: [PATCH] Rename --- .../accounts/src/pages/passkeys/index.tsx | 4 +- .../src/components/AuthenticateUserModal.tsx | 2 +- .../src/components/DeleteAccountModal.tsx | 6 +- .../photos/src/components/Sidebar/index.tsx | 2 +- web/apps/photos/src/pages/_app.tsx | 2 +- web/packages/accounts/pages/recover.tsx | 2 +- .../accounts/pages/two-factor/recover.tsx | 2 +- web/packages/base/components/MiniDialog.tsx | 71 +++++++++++-------- .../new/photos/components/MLSettings.tsx | 2 +- .../components/gallery/PeopleHeader.tsx | 2 +- .../shared/components/LoginComponents.tsx | 4 +- 11 files changed, 55 insertions(+), 44 deletions(-) diff --git a/web/apps/accounts/src/pages/passkeys/index.tsx b/web/apps/accounts/src/pages/passkeys/index.tsx index 56d09d0fbd..d365af0b6d 100644 --- a/web/apps/accounts/src/pages/passkeys/index.tsx +++ b/web/apps/accounts/src/pages/passkeys/index.tsx @@ -46,7 +46,7 @@ const Page: React.FC = () => { const showPasskeyFetchFailedErrorDialog = useCallback(() => { setDialogBoxAttributesV2({ title: t("error"), - content: t("passkey_fetch_failed"), + message: t("passkey_fetch_failed"), close: {}, }); }, [setDialogBoxAttributesV2]); @@ -282,7 +282,7 @@ const ManagePasskeyDrawer: React.FC = ({ setDialogBoxAttributesV2({ title: t("delete_passkey"), - content: t("delete_passkey_confirmation"), + message: t("delete_passkey_confirmation"), proceed: { text: t("delete"), action: handleDelete, diff --git a/web/apps/photos/src/components/AuthenticateUserModal.tsx b/web/apps/photos/src/components/AuthenticateUserModal.tsx index 9c230cc220..0b6a83b7f9 100644 --- a/web/apps/photos/src/components/AuthenticateUserModal.tsx +++ b/web/apps/photos/src/components/AuthenticateUserModal.tsx @@ -126,7 +126,7 @@ const passwordChangedElsewhereDialogAttributes = ( onLogin: () => void, ): MiniDialogAttributes => ({ title: t("password_changed_elsewhere"), - content: t("password_changed_elsewhere_message"), + message: t("password_changed_elsewhere_message"), proceed: { text: t("login"), action: onLogin, diff --git a/web/apps/photos/src/components/DeleteAccountModal.tsx b/web/apps/photos/src/components/DeleteAccountModal.tsx index 72494f9455..8b75b2a630 100644 --- a/web/apps/photos/src/components/DeleteAccountModal.tsx +++ b/web/apps/photos/src/components/DeleteAccountModal.tsx @@ -43,7 +43,7 @@ const DeleteAccountModal = ({ open, onClose }: Iprops) => { setDialogBoxAttributesV2({ title: t("error"), close: { variant: "critical" }, - content: t("generic_error_retry"), + message: t("generic_error_retry"), }); const initiateDelete = async ( @@ -86,7 +86,7 @@ const DeleteAccountModal = ({ open, onClose }: Iprops) => { const confirmAccountDeletion = () => { setDialogBoxAttributesV2({ title: t("delete_account"), - content: , + message: , proceed: { text: t("delete"), action: solveChallengeAndDeleteAccount, @@ -101,7 +101,7 @@ const DeleteAccountModal = ({ open, onClose }: Iprops) => { setDialogBoxAttributesV2({ title: t("delete_account"), - content: ( + message: ( }} diff --git a/web/apps/photos/src/components/Sidebar/index.tsx b/web/apps/photos/src/components/Sidebar/index.tsx index f1e2ba8b2b..0275a1f92a 100644 --- a/web/apps/photos/src/components/Sidebar/index.tsx +++ b/web/apps/photos/src/components/Sidebar/index.tsx @@ -681,7 +681,7 @@ const DebugSection: React.FC = () => { const confirmLogDownload = () => showMiniDialog({ title: t("DOWNLOAD_LOGS"), - content: , + message: , proceed: { text: t("download"), variant: "accent", diff --git a/web/apps/photos/src/pages/_app.tsx b/web/apps/photos/src/pages/_app.tsx index 5b68b6839b..9ecc2eb6b5 100644 --- a/web/apps/photos/src/pages/_app.tsx +++ b/web/apps/photos/src/pages/_app.tsx @@ -260,7 +260,7 @@ export default function App({ Component, pageProps }: AppProps) { setDialogBoxAttributesV2({ title: t("error"), icon: , - content: t("generic_error"), + message: t("generic_error"), close: { variant: "critical" }, }) ), diff --git a/web/packages/accounts/pages/recover.tsx b/web/packages/accounts/pages/recover.tsx index 531f37763f..c6e86cdafc 100644 --- a/web/packages/accounts/pages/recover.tsx +++ b/web/packages/accounts/pages/recover.tsx @@ -101,7 +101,7 @@ const Page: React.FC = ({ appContext }) => { setDialogBoxAttributesV2({ title: t("sorry"), close: {}, - content: t("NO_RECOVERY_KEY_MESSAGE"), + message: t("NO_RECOVERY_KEY_MESSAGE"), }); return ( diff --git a/web/packages/accounts/pages/two-factor/recover.tsx b/web/packages/accounts/pages/two-factor/recover.tsx index 820a0707e4..be2d2227fd 100644 --- a/web/packages/accounts/pages/two-factor/recover.tsx +++ b/web/packages/accounts/pages/two-factor/recover.tsx @@ -151,7 +151,7 @@ const Page: React.FC = ({ appContext, twoFactorType }) => { appContext.setDialogBoxAttributesV2({ title: t("contact_support"), close: dialogClose ?? {}, - content: ( + message: ( component. */ - content?: React.ReactNode; + message?: React.ReactNode; + /** + * If `true`, then clicks in the backdrop are ignored. The default behaviour + * is to close the dialog when the background is clicked. + */ + staticBackdrop?: boolean; + /** + * If `true`, then the dialog cannot be closed (e.g. with the ESC key, or + * clicking on the backdrop) except through one of the explicitly provided + * actions. + */ + nonClosable?: boolean; + /** + * Customize the primary action button offered by the dialog box. + * + * This is provided by boxes which serve as some sort of confirmation. For + * dialogs which are informational notifications, this is usually skipped, + * only the {@link close} action button is configured. + */ + proceed?: { + /** The string to use as the label for the primary action button. */ + text: string; + /** The color of the button. */ + variant?: ButtonProps["color"]; + /** + * The function to call when the user presses the primary action button. + * + * It is passed a {@link setLoading} function that can be used to show + * or hide loading indicator or the primary action button. + */ + action: + | (() => void | Promise) + | ((setLoading: (value: boolean) => void) => void | Promise); + }; /** * Customize the cancel (dismiss) action button offered by the dialog box. * - * Usually dialog boxes should have a cancel action, but this can be skipped - * to only show one of the other types of buttons. + * Usually all dialog boxes should have a cancel action. */ close?: { /** The string to use as the label for the cancel button. */ @@ -60,24 +90,7 @@ export interface MiniDialogAttributes { */ action?: () => void; }; - /** - * Customize the primary action button offered by the dialog box. - */ - proceed?: { - /** The string to use as the label for the primary action. */ - text: string; - /** - * The function to call when the user presses the primary action button. - * - * It is passed a {@link setLoading} function that can be used to show - * or hide loading indicator or the primary action button. - */ - action: - | (() => void | Promise) - | ((setLoading: (value: boolean) => void) => void | Promise); - variant?: ButtonProps["color"]; - disabled?: boolean; - }; + /** The direction in which the buttons are stacked. Default is "column". */ buttonDirection?: "row" | "column"; } @@ -145,11 +158,10 @@ export const AttributedMiniDialog: React.FC< {attributes.icon} )} - - {attributes.content && ( + {attributes.message && ( - {attributes.content} + {attributes.message} )} {children} @@ -160,7 +172,7 @@ export const AttributedMiniDialog: React.FC< gap: "12px", }} direction={ - attributes.buttonDirection === "row" + attributes.buttonDirection == "row" ? "row-reverse" : "column" } @@ -168,7 +180,7 @@ export const AttributedMiniDialog: React.FC< {attributes.proceed && ( { await attributes.proceed?.action( @@ -177,14 +189,13 @@ export const AttributedMiniDialog: React.FC< onClose(); }} - disabled={attributes.proceed.disabled} > {attributes.proceed.text} )} {attributes.close && ( { attributes.close?.action && diff --git a/web/packages/new/photos/components/MLSettings.tsx b/web/packages/new/photos/components/MLSettings.tsx index cf55625bf3..3b1db3002b 100644 --- a/web/packages/new/photos/components/MLSettings.tsx +++ b/web/packages/new/photos/components/MLSettings.tsx @@ -292,7 +292,7 @@ const ManageML: React.FC = ({ const confirmDisableML = () => { setDialogBoxAttributesV2({ title: t("ml_search_disable"), - content: t("ml_search_disable_confirm"), + message: t("ml_search_disable_confirm"), close: { text: t("cancel") }, proceed: { variant: "critical", diff --git a/web/packages/new/photos/components/gallery/PeopleHeader.tsx b/web/packages/new/photos/components/gallery/PeopleHeader.tsx index debe3cf9f6..aa0b05922e 100644 --- a/web/packages/new/photos/components/gallery/PeopleHeader.tsx +++ b/web/packages/new/photos/components/gallery/PeopleHeader.tsx @@ -105,7 +105,7 @@ const CGroupPersonOptions: React.FC = ({ const handleDeletePerson = () => setDialogBoxAttributesV2({ title: pt("Reset person?"), - content: pt( + message: pt( "The name, face groupings and suggestions for this person will be reset", ), close: { text: t("cancel") }, diff --git a/web/packages/shared/components/LoginComponents.tsx b/web/packages/shared/components/LoginComponents.tsx index 4f0366a834..7ba8e7ae80 100644 --- a/web/packages/shared/components/LoginComponents.tsx +++ b/web/packages/shared/components/LoginComponents.tsx @@ -207,7 +207,7 @@ export const sessionExpiredDialogAttributes = ( onLogin: () => void, ): MiniDialogAttributes => ({ title: t("SESSION_EXPIRED"), - content: t("SESSION_EXPIRED_MESSAGE"), + message: t("SESSION_EXPIRED_MESSAGE"), nonClosable: true, proceed: { text: t("login"), @@ -222,5 +222,5 @@ export const sessionExpiredDialogAttributes = ( const genericErrorAttributes = (): MiniDialogAttributes => ({ title: t("error"), close: { variant: "critical" }, - content: t("generic_error_retry"), + message: t("generic_error_retry"), });