TerribleDev/ente
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix dialog state not getting reset on reopening

Browse Source 
...without going back from accounts page.
This commit is contained in:
Manav Rathi
2025-06-06 13:30:54 +05:30
parent 4152751d52
commit 7dee2c1526
1 changed files with 59 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
web/packages/new/photos/components/DeleteAccount.tsx
View File

@@ -40,8 +40,17 @@ type DeleteAccountProps = ModalVisibilityProps & {
export const DeleteAccount: React.FC<DeleteAccountProps> = ({
open,
onClose,
onAuthenticateUser,
}) => {
...rest
}) => (
<TitledMiniDialog open={open} onClose={onClose} title={t("delete_account")}>
<DeleteAccountDialogContents {...{ open, onClose }} {...rest} />
</TitledMiniDialog>
);
// See: [Note: MUI dialog state reset]
const DeleteAccountDialogContents: React.FC<
Omit<DeleteAccountProps, "open">
> = ({ onClose, onAuthenticateUser }) => {
const { logout, showMiniDialog, onGenericError } = useBaseContext();
const [acceptDataDeletion, setAcceptDataDeletion] = useState(false);
@@ -132,64 +141,56 @@ export const DeleteAccount: React.FC<DeleteAccountProps> = ({
};
return (
<TitledMiniDialog
open={open}
onClose={onClose}
title={t("delete_account")}
>
<form onSubmit={handleSubmit}>
<Stack sx={{ gap: "24px" }}>
<Stack sx={{ gap: "4px" }}>
<Typography>
{t("delete_account_reason_label")}
<form onSubmit={handleSubmit}>
<Stack sx={{ gap: "24px" }}>
<Stack sx={{ gap: "4px" }}>
<Typography>{t("delete_account_reason_label")}</Typography>
<DropdownInput
options={deleteReasonOptions()}
placeholder={t("delete_account_reason_placeholder")}
selected={values.reason}
onSelect={handleChange("reason")}
/>
{touched.reason && errors.reason && (
<Typography
variant="small"
sx={{ px: 1, color: "critical.main" }}
>
{errors.reason}
</Typography>
<DropdownInput
options={deleteReasonOptions()}
placeholder={t("delete_account_reason_placeholder")}
selected={values.reason}
onSelect={handleChange("reason")}
/>
{touched.reason && errors.reason && (
<Typography
variant="small"
sx={{ px: 1, color: "critical.main" }}
>
{errors.reason}
</Typography>
)}
</Stack>
<FeedbackInput
value={values.feedback}
onChange={handleChange("feedback")}
errorMessage={
touched.feedback ? errors.feedback : undefined
}
/>
<ConfirmationCheckboxInput
checked={acceptDataDeletion}
onChange={setAcceptDataDeletion}
/>
<Stack sx={{ gap: "8px" }}>
<LoadingButton
type="submit"
fullWidth
color="critical"
disabled={!acceptDataDeletion}
loading={loading}
>
{t("delete_account_confirm")}
</LoadingButton>
<FocusVisibleButton
fullWidth
color="secondary"
onClick={onClose}
>
{t("cancel")}
</FocusVisibleButton>
</Stack>
)}
</Stack>
</form>
</TitledMiniDialog>
<FeedbackInput
value={values.feedback}
onChange={handleChange("feedback")}
errorMessage={
touched.feedback ? errors.feedback : undefined
}
/>
<ConfirmationCheckboxInput
checked={acceptDataDeletion}
onChange={setAcceptDataDeletion}
/>
<Stack sx={{ gap: "8px" }}>
<LoadingButton
type="submit"
fullWidth
color="critical"
disabled={!acceptDataDeletion}
loading={loading}
>
{t("delete_account_confirm")}
</LoadingButton>
<FocusVisibleButton
fullWidth
color="secondary"
onClick={onClose}
>
{t("cancel")}
</FocusVisibleButton>
</Stack>
</Stack>
</form>
);
};