diff --git a/resources/images/tuta-desktop-illustration.webp b/resources/images/tuta-desktop-illustration.webp new file mode 100644 index 000000000000..d0eb25725cc9 Binary files /dev/null and b/resources/images/tuta-desktop-illustration.webp differ diff --git a/src/common/misc/TranslationKey.ts b/src/common/misc/TranslationKey.ts index a487b20ddf4c..628ac6790c48 100644 --- a/src/common/misc/TranslationKey.ts +++ b/src/common/misc/TranslationKey.ts @@ -1878,3 +1878,6 @@ export type TranslationKeyType = | "assignAdminRightsToLocallyAdministratedUserError_msg" | "localAdminGroups_label" | "exportRunningElsewhere_label" + | "mailExport_label" + | "downloadDesktopClient_label" + | "mailExportOnlyOnDesktop_label" diff --git a/src/mail-app/settings/MailExportSettings.ts b/src/mail-app/settings/MailExportSettings.ts index 5003bcc945e5..ced005537612 100644 --- a/src/mail-app/settings/MailExportSettings.ts +++ b/src/mail-app/settings/MailExportSettings.ts @@ -1,18 +1,18 @@ import m, { Children, Component, Vnode } from "mithril" import { lang } from "../../common/misc/LanguageViewModel" -import { theme } from "../../common/gui/theme" -import { px } from "../../common/gui/size" -import { ProgressBar } from "../../common/gui/base/ProgressBar" import { DropDownSelector, type DropDownSelectorAttrs } from "../../common/gui/base/DropDownSelector" import { MailboxDetail } from "../../common/mailFunctionality/MailboxModel" import { getMailboxName } from "../../common/mailFunctionality/SharedMailUtils" import { mailLocator } from "../mailLocator" import { first } from "@tutao/tutanota-utils" import { LoginController } from "../../common/api/main/LoginController" -import { Button, ButtonType } from "../../common/gui/base/Button" import { MailExportController } from "../native/main/MailExportController.js" -import { formatDate } from "../../common/misc/Formatter" import Stream from "mithril/stream" +import { Button, ButtonType } from "../../common/gui/base/Button" +import { formatDate } from "../../common/misc/Formatter" +import { IconButton } from "../../common/gui/base/IconButton" +import { Icons } from "../../common/gui/base/icons/Icons" +import { ButtonSize } from "../../common/gui/base/ButtonSize" interface MailExportSettingsAttrs { mailboxDetails: MailboxDetail[] @@ -69,23 +69,14 @@ export class MailExportSettings implements Component { "{count}": state.exportedMails, }), ), - m( - ".rel.full-width.mt-s", - { - style: { - "background-color": theme.content_border, - height: px(2), - }, - }, - m(ProgressBar, { progress: state.progress }), - ), ]), - m(Button, { - label: "cancel_action", - type: ButtonType.Secondary, + m(IconButton, { + title: "cancel_action", + icon: Icons.Cancel, click: () => { controller.cancelExport() }, + size: ButtonSize.Normal, }), ]), ] diff --git a/src/mail-app/settings/MailExportViewer.ts b/src/mail-app/settings/MailExportViewer.ts new file mode 100644 index 000000000000..2974c982b0a8 --- /dev/null +++ b/src/mail-app/settings/MailExportViewer.ts @@ -0,0 +1,73 @@ +import m, { Children } from "mithril" +import { assertMainOrNode, isDesktop } from "../../common/api/common/Env" +import { InfoLink, lang } from "../../common/misc/LanguageViewModel" +import { UpdatableSettingsViewer } from "../../common/settings/Interfaces.js" +import { mailLocator } from "../mailLocator.js" +import { MailExportSettings } from "./MailExportSettings" +import { MailExportController } from "../native/main/MailExportController.js" +import { Button, ButtonType } from "../../common/gui/base/Button" + +assertMainOrNode() + +export class MailExportViewer implements UpdatableSettingsViewer { + private mailExportController: MailExportController | null = null + + constructor() { + this.view = this.view.bind(this) + + if (isDesktop()) { + // export is only available on desktop + mailLocator.mailExportController().then((controller) => { + this.mailExportController = controller + m.redraw() + }) + } + } + + view(): Children { + return [ + m( + ".fill-absolute.scroll.plr-l.pb-xl", + m(".h4.mt-l", lang.get("exportMailbox_label")), + this.mailExportController + ? m(MailExportSettings, { + mailboxDetails: mailLocator.mailboxModel.mailboxDetails(), + logins: mailLocator.logins, + mailExportController: this.mailExportController, + }) + : this.renderExportOnlyOnDesktopText(), + ), + ] + } + + private renderExportOnlyOnDesktopText() { + return [ + m( + ".flex-column.center.mt-m", + m("img.onboarding-logo.mt-m", { + src: `${window.tutao.appState.prefixWithoutFile}/images/tuta-desktop-illustration.webp`, + alt: "", + rel: "noreferrer", + loading: "lazy", + decoding: "async", + class: "onboarding-logo-large", + }), + m(".p.mt-m", lang.get("mailExportOnlyOnDesktop_label")), + m( + ".flex-center.mt-m", + m(Button, { + type: ButtonType.Primary, + label: "downloadDesktopClient_label", + click: () => { + open(InfoLink.Download) + }, + }), + ), + ), + ] + } + + async entityEventsReceived(): Promise { + return Promise.resolve() + } +} diff --git a/src/mail-app/settings/MailSettingsViewer.ts b/src/mail-app/settings/MailSettingsViewer.ts index a294006ab218..889a01ac121c 100644 --- a/src/mail-app/settings/MailSettingsViewer.ts +++ b/src/mail-app/settings/MailSettingsViewer.ts @@ -1,5 +1,5 @@ import m, { Children } from "mithril" -import { assertMainOrNode, isApp, isDesktop } from "../../common/api/common/Env" +import { assertMainOrNode, isApp } from "../../common/api/common/Env" import { lang } from "../../common/misc/LanguageViewModel" import type { MailboxGroupRoot, MailboxProperties, OutOfOfficeNotification, TutanotaProperties } from "../../common/api/entities/tutanota/TypeRefs.js" import { @@ -49,8 +49,6 @@ import { UpdatableSettingsViewer } from "../../common/settings/Interfaces.js" import { mailLocator } from "../mailLocator.js" import { getDefaultSenderFromUser, getFolderName } from "../mail/model/MailUtils.js" import { elementIdPart } from "../../common/api/common/utils/EntityUtils.js" -import { MailExportSettings } from "./MailExportSettings" -import { MailExportController } from "../native/main/MailExportController.js" assertMainOrNode() @@ -72,8 +70,6 @@ export class MailSettingsViewer implements UpdatableSettingsViewer { private customerInfo: CustomerInfo | null private mailAddressTableModel: MailAddressTableModel | null = null private mailAddressTableExpanded: boolean - private mailExportController: MailExportController | null = null - private offlineStorageSettings = new OfflineStorageSettingsModel(mailLocator.logins.getUserController(), deviceConfig) constructor() { @@ -90,13 +86,6 @@ export class MailSettingsViewer implements UpdatableSettingsViewer { this._inboxRulesTableLines = stream>([]) this._outOfOfficeStatus = stream(lang.get("deactivated_label")) this._indexStateWatch = null - if (isDesktop()) { - // export is only available on desktop - mailLocator.mailExportController().then((controller) => { - this.mailExportController = controller - m.redraw() - }) - } // normally we would maybe like to get it as an argument but these viewers are created in an odd way mailLocator.mailAddressTableModelForOwnMailbox().then((model) => { this.mailAddressTableModel = model @@ -392,14 +381,6 @@ export class MailSettingsViewer implements UpdatableSettingsViewer { }), ), ], - this.mailExportController && [ - m(".h4.mt-l", lang.get("exportMailbox_label")), - m(MailExportSettings, { - mailboxDetails: mailLocator.mailboxModel.mailboxDetails(), - logins: mailLocator.logins, - mailExportController: this.mailExportController, - }), - ], ], ), ] diff --git a/src/mail-app/settings/SettingsView.ts b/src/mail-app/settings/SettingsView.ts index 97e9b29a4686..da51a603ceb9 100644 --- a/src/mail-app/settings/SettingsView.ts +++ b/src/mail-app/settings/SettingsView.ts @@ -70,6 +70,7 @@ import { AffiliateKpisViewer } from "../../common/settings/AffiliateKpisViewer.j import { DesktopMailImportSettingsViewer } from "./DesktopMailImportSettingsViewer.js" import { mailLocator } from "../mailLocator" import { WebMailImportSettingsViewer } from "./WebMailImportSettingsViewer.js" +import { MailExportViewer } from "./MailExportViewer" assertMainOrNode() @@ -174,6 +175,16 @@ export class SettingsView extends BaseTopLevelView implements TopLevelView Icons.Export, + "mailExport", + () => new MailExportViewer(), + undefined, + ), + ) + this._adminFolders = [] this._templateFolders = [] diff --git a/src/mail-app/translations/de_sie.ts b/src/mail-app/translations/de_sie.ts index f7f249300e06..4d030a23944d 100644 --- a/src/mail-app/translations/de_sie.ts +++ b/src/mail-app/translations/de_sie.ts @@ -1892,11 +1892,11 @@ export default { "yourFolders_action": "Ihre ORDNER", "yourMessage_label": "Ihre Nachricht", "you_label": "Sie", + "exportRunningElsewhere_label": "Export may be running in another window.", "vitor_alt": "Black-and white high-contrast image of a man (Vitor) sipping from a cup, knowing he is secure.", // Put in temporarily, will be removed soon "localAdminGroup_label": "Local admin group", "assignAdminRightsToLocallyAdministratedUserError_msg": "You can't assign global admin rights to a locally administrated user.", "localAdminGroups_label": "Local admin groups", - "exportRunningElsewhere_label": "Export may be running in another window." } } diff --git a/src/mail-app/translations/en.ts b/src/mail-app/translations/en.ts index 4f17c895ffa0..ce22516e3495 100644 --- a/src/mail-app/translations/en.ts +++ b/src/mail-app/translations/en.ts @@ -1893,6 +1893,6 @@ export default { "localAdminGroup_label": "Local admin group", "assignAdminRightsToLocallyAdministratedUserError_msg": "You can't assign global admin rights to a locally administrated user.", "localAdminGroups_label": "Local admin groups", - "exportRunningElsewhere_label": "Export may be running in another window." + "exportRunningElsewhere_label": "Export may be running in another window.", } }