feat: Improve mail display

.package.resolved

@@ -85,8 +85,8 @@
       "kind" : "remoteSourceControl",
       "location" : "https://github.com/Infomaniak/ios-notifications",
       "state" : {
-        "revision" : "0da8aa11e60766acaa62e34c84a8049eeb6e933f",
-        "version" : "2.0.1"
+        "revision" : "4609e33800a11f9f7acd38df66d1fbaaba0e60a8",
+        "version" : "2.1.0"
       }
     },
     {

Mail/Helpers/RichTextEditor.swift

@@ -148,25 +148,10 @@ class MailEditorView: SQTextEditorView {
             config.userContentController.add(self, name: jsMessageName.rawValue)
         }
 
-        // inject css to html
-        if customCss == nil,
-           let cssURL = Bundle(for: SQTextEditorView.self).url(forResource: "editor", withExtension: "css"),
-           let css = try? String(contentsOf: cssURL, encoding: .utf8) {
-            customCss = css
-        }
-
-        if let css = customCss {
-            let cssStyle = """
-                javascript:(function() {
-                var parent = document.getElementsByTagName('head').item(0);
-                var style = document.createElement('style');
-                style.type = 'text/css';
-                style.innerHTML = window.atob('\(encodeStringTo64(fromString: css))');
-                parent.appendChild(style)})()
-            """
-            let cssScript = WKUserScript(source: cssStyle, injectionTime: .atDocumentEnd, forMainFrameOnly: false)
-            config.userContentController.addUserScript(cssScript)
-        }
+        let css = customCss ?? MessageWebViewUtils.generateCSS(for: .editor)
+        let cssStyle = "(() => { document.head.innerHTML += `\(css)`; })()"
+        let cssScript = WKUserScript(source: cssStyle, injectionTime: .atDocumentEnd, forMainFrameOnly: false)
+        config.userContentController.addUserScript(cssScript)
 
         let _webView = WKWebView(frame: .zero, configuration: config)
         _webView.translatesAutoresizingMaskIntoConstraints = false

Mail/Views/Thread/MessageBodyView.swift

@@ -22,14 +22,11 @@ import RealmSwift
 import SwiftUI
 
 struct MessageBodyView: View {
-    @Binding var presentableBody: PresentableBody
+    @StateObject private var model = WebViewModel()
 
-    @State var model = WebViewModel()
-    @State private var webViewShortHeight: CGFloat = .zero
-    @State private var webViewCompleteHeight: CGFloat = .zero
+    @Binding var presentableBody: PresentableBody
 
-    @State private var showBlockQuote = false
-    @State private var contentLoading = true
+    let messageUid: String
 
     var body: some View {
         ZStack {
@@ -40,33 +37,27 @@ struct MessageBodyView: View {
                             .padding(.horizontal, 16)
                             .onAppear {
                                 withAnimation {
-                                    contentLoading = false
+                                    model.contentLoading = false
                                 }
                             }
                     } else {
-                        WebView(
-                            model: $model,
-                            shortHeight: $webViewShortHeight,
-                            completeHeight: $webViewCompleteHeight,
-                            loading: $contentLoading,
-                            withQuote: $showBlockQuote
-                        )
-                        .frame(minHeight: showBlockQuote ? webViewCompleteHeight : webViewShortHeight)
-                        .onAppear {
-                            loadBody()
-                        }
-                        .onChange(of: presentableBody) { _ in
-                            loadBody()
-                        }
-                        .onChange(of: showBlockQuote) { _ in
-                            loadBody()
-                        }
+                        WebView(model: model, messageUid: messageUid)
+                            .frame(height: model.webViewHeight)
+                            .onAppear {
+                                loadBody()
+                            }
+                            .onChange(of: presentableBody) { _ in
+                                loadBody()
+                            }
+                            .onChange(of: model.showBlockQuote) { _ in
+                                loadBody()
+                            }
 
                         if presentableBody.quote != nil {
-                            MailButton(label: showBlockQuote
+                            MailButton(label: model.showBlockQuote
                                 ? MailResourcesStrings.Localizable.messageHideQuotedText
                                 : MailResourcesStrings.Localizable.messageShowQuotedText) {
-                                    showBlockQuote.toggle()
+                                    model.showBlockQuote.toggle()
                                 }
                                 .mailButtonStyle(.smallLink)
                                 .frame(maxWidth: .infinity, alignment: .leading)
@@ -75,20 +66,21 @@ struct MessageBodyView: View {
                     }
                 }
             }
-            .opacity(contentLoading ? 0 : 1)
-            if contentLoading {
+            .opacity(model.contentLoading ? 0 : 1)
+
+            if model.contentLoading {
                 ShimmerView()
             }
         }
     }
 
     private func loadBody() {
-        model.loadHTMLString(value: showBlockQuote ? presentableBody.body?.value : presentableBody.compactBody)
+        model.loadHTMLString(value: model.showBlockQuote ? presentableBody.body?.value : presentableBody.compactBody)
     }
 }
 
 struct MessageBodyView_Previews: PreviewProvider {
     static var previews: some View {
-        MessageBodyView(presentableBody: .constant(PreviewHelper.samplePresentableBody))
+        MessageBodyView(presentableBody: .constant(PreviewHelper.samplePresentableBody), messageUid: "message_uid")
     }
 }

Mail/Views/Thread/MessageView.swift

@@ -51,11 +51,11 @@ struct MessageView: View {
                 .padding(.horizontal, 16)
 
                 if isMessageExpanded {
-                    if !message.attachments.filter { $0.disposition == .attachment || $0.contentId == nil }.isEmpty {
+                    if !message.attachments.filter({ $0.disposition == .attachment || $0.contentId == nil }).isEmpty {
                         AttachmentsView(message: message)
                             .padding(.top, 24)
                     }
-                    MessageBodyView(presentableBody: $presentableBody)
+                    MessageBodyView(presentableBody: $presentableBody, messageUid: message.uid)
                         .padding(.top, 16)
                 }
             }

Mail/Views/Thread/WebView.swift

@@ -0,0 +1,90 @@
+/*
+ Infomaniak Mail - iOS App
+ Copyright (C) 2022 Infomaniak Network SA
+
+ This program is free software: you can redistribute it and/or modify
+ it under the terms of the GNU General Public License as published by
+ the Free Software Foundation, either version 3 of the License, or
+ (at your option) any later version.
+
+ This program is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License
+ along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import SwiftUI
+import WebKit
+
+struct WebView: UIViewRepresentable {
+    @ObservedObject var model: WebViewModel
+
+    let messageUid: String
+
+    private var webView: WKWebView {
+        return model.webView
+    }
+
+    class Coordinator: NSObject, WKNavigationDelegate {
+        var parent: WebView
+
+        init(_ parent: WebView) {
+            self.parent = parent
+        }
+
+        func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
+            Task { @MainActor in
+                try await webView.evaluateJavaScript("listenToSizeChanges()")
+
+                // Fix CSS properties and adapt the mail to the screen size
+                let readyState = try await webView.evaluateJavaScript("document.readyState") as? String
+                guard readyState == "complete" else { return }
+
+                _ = try await webView.evaluateJavaScript("removeAllProperties()")
+                _ = try await webView.evaluateJavaScript("normalizeMessageWidth(\(webView.frame.width), '\(parent.messageUid)')")
+            }
+        }
+
+        func webView(
+            _ webView: WKWebView,
+            decidePolicyFor navigationAction: WKNavigationAction,
+            decisionHandler: @escaping (WKNavigationActionPolicy) -> Void
+        ) {
+            if navigationAction.navigationType == .linkActivated {
+                if let url = navigationAction.request.url {
+                    decisionHandler(.cancel)
+                    UIApplication.shared.open(url)
+                }
+            } else {
+                decisionHandler(.allow)
+            }
+        }
+    }
+
+    func makeCoordinator() -> Coordinator {
+        Coordinator(self)
+    }
+
+    func makeUIView(context: Context) -> WKWebView {
+        webView.navigationDelegate = context.coordinator
+        webView.scrollView.bounces = false
+        webView.scrollView.bouncesZoom = false
+        webView.scrollView.showsVerticalScrollIndicator = false
+        webView.scrollView.showsHorizontalScrollIndicator = true
+        webView.scrollView.alwaysBounceVertical = false
+        webView.scrollView.alwaysBounceHorizontal = false
+        #if DEBUG
+        if #available(iOS 16.4, *) {
+            webView.isInspectable = true
+        }
+        #endif
+        return webView
+    }
+
+    func updateUIView(_ uiView: WKWebView, context: Context) {
+        // needed for UIViewRepresentable
+    }
+}