diff --git a/CHANGELOG.md b/CHANGELOG.md index ebedd8c305..d04cfe3661 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -19,6 +19,7 @@ - revert debian packagename from `deltachat` back to `deltachat-desktop` #4266 - style: fix VCard color being too bright in dark theme #4255 - remove unnecessary horizontal scrollbar in "View Group" dialog #4254 +- add missing cancel buttons to import-/export- and reveive-backup progress dialogs #4272 - change title and button label of EditAccountAndPasswordDialog to make it clearer that it is about email account #4271, #4279 - fix styling of progressbars in light theme #4274 - fix Delta Chat not launching on Debian sometimes due to missing package dependencies (`libasound2`) #4275 diff --git a/packages/frontend/src/components/Settings/Backup.tsx b/packages/frontend/src/components/Settings/Backup.tsx index d388b2fb86..8c8ceb3724 100644 --- a/packages/frontend/src/components/Settings/Backup.tsx +++ b/packages/frontend/src/components/Settings/Backup.tsx @@ -6,7 +6,14 @@ import { getLogger } from '../../../../shared/logger' import { BackendRemote } from '../../backend-com' import { selectedAccountId } from '../../ScreenController' import SettingsButton from './SettingsButton' -import Dialog, { DialogBody, DialogContent, DialogHeader } from '../Dialog' +import Dialog, { + DialogBody, + DialogContent, + DialogFooter, + DialogHeader, + FooterActionButton, + FooterActions, +} from '../Dialog' import useTranslationFunction from '../../hooks/useTranslationFunction' import useDialog from '../../hooks/dialog/useDialog' import useConfirmationDialog from '../../hooks/dialog/useConfirmationDialog' @@ -14,6 +21,7 @@ import useConfirmationDialog from '../../hooks/dialog/useConfirmationDialog' import type { DcEventType } from '@deltachat/jsonrpc-client' import { LastUsedSlot, rememberLastUsedPath } from '../../utils/lastUsedPaths' import { RuntimeOpenDialogOptions } from '@deltachat-desktop/shared/shared-types' +import { DialogProps } from '../../contexts/DialogContext' const log = getLogger('renderer/Settings/Backup') @@ -79,7 +87,7 @@ export default function Backup() { ) } -function ExportProgressDialog() { +function ExportProgressDialog({ onClose }: DialogProps) { const tx = useTranslationFunction() const [progress, setProgress] = useState(0.0) @@ -87,6 +95,11 @@ function ExportProgressDialog() { setProgress(progress) } const accountId = selectedAccountId() + + const cancel = () => { + BackendRemote.rpc.stopOngoingProcess(accountId).then(onClose) + } + useEffect(() => { const emitter = BackendRemote.getContextEvents(accountId) emitter.on('ImexProgress', onImexProgress) @@ -96,12 +109,19 @@ function ExportProgressDialog() { }, [accountId]) return ( - {}}> + {}} canOutsideClickClose={false}> + + + + {tx('cancel')} + + + ) diff --git a/packages/frontend/src/components/dialogs/SetupMultiDevice/ReceiveBackupProgressDialog.tsx b/packages/frontend/src/components/dialogs/SetupMultiDevice/ReceiveBackupProgressDialog.tsx index 775a8619ff..1290a598ad 100644 --- a/packages/frontend/src/components/dialogs/SetupMultiDevice/ReceiveBackupProgressDialog.tsx +++ b/packages/frontend/src/components/dialogs/SetupMultiDevice/ReceiveBackupProgressDialog.tsx @@ -5,7 +5,14 @@ import { getLogger } from '../../../../../shared/logger' import { BackendRemote } from '../../../backend-com' import { selectedAccountId } from '../../../ScreenController' import { DeltaProgressBar } from '../../Login-Styles' -import { DialogBody, DialogContent, DialogWithHeader } from '../../Dialog' +import { + DialogBody, + DialogContent, + DialogFooter, + DialogWithHeader, + FooterActionButton, + FooterActions, +} from '../../Dialog' import useTranslationFunction from '../../../hooks/useTranslationFunction' import type { DialogProps } from '../../../contexts/DialogContext' @@ -30,6 +37,10 @@ export function ReceiveBackupProgressDialog({ const accountId = selectedAccountId() + const cancel = () => { + BackendRemote.rpc.stopOngoingProcess(accountId).then(onClose) + } + useEffect(() => { ;(async () => { try { @@ -71,6 +82,13 @@ export function ReceiveBackupProgressDialog({ intent={error ? 'danger' : 'success'} /> + + + + {tx('cancel')} + + + ) diff --git a/packages/frontend/src/components/screens/WelcomeScreen/ImportBackupProgressDialog.tsx b/packages/frontend/src/components/screens/WelcomeScreen/ImportBackupProgressDialog.tsx index 316a2c4ac8..514cabd210 100644 --- a/packages/frontend/src/components/screens/WelcomeScreen/ImportBackupProgressDialog.tsx +++ b/packages/frontend/src/components/screens/WelcomeScreen/ImportBackupProgressDialog.tsx @@ -3,7 +3,14 @@ import React, { useEffect, useState } from 'react' import useTranslationFunction from '../../../hooks/useTranslationFunction' import { BackendRemote } from '../../../backend-com' import { DeltaProgressBar } from '../../Login-Styles' -import { DialogBody, DialogContent, DialogWithHeader } from '../../Dialog' +import { + DialogBody, + DialogContent, + DialogFooter, + DialogWithHeader, + FooterActionButton, + FooterActions, +} from '../../Dialog' import { getLogger } from '../../../../../shared/logger' import { selectedAccountId } from '../../../ScreenController' @@ -29,6 +36,10 @@ export default function ImportBackupProgressDialog({ const accountId = selectedAccountId() + const cancel = () => { + BackendRemote.rpc.stopOngoingProcess(accountId).then(onClose) + } + useEffect(() => { ;(async () => { try { @@ -71,6 +82,13 @@ export default function ImportBackupProgressDialog({ intent={error ? 'danger' : 'primary'} /> + + + + {tx('cancel')} + + + )