Multiple Conversions

addons/account/__manifest__.py

@@ -123,7 +123,7 @@
             ('remove', 'account/static/tests/tours/**/*'),
         ],
         'web.assets_frontend': [
-            'account/static/src/js/account_portal_sidebar.js',
+            'account/static/src/interactions/**/*',
             'account/static/src/js/account_portal.js',
             'account/static/src/components/tests_shared_js_python/*',
             'account/static/src/helpers/*.js',

addons/account/static/src/interactions/account_portal_sidebar.js

@@ -0,0 +1,58 @@
+import { PortalSidebar } from "@portal/interactions/portal_sidebar";
+import { registry } from "@web/core/registry";
+
+import { scrollTo } from "@web/core/utils/scrolling";
+
+export class AccountPortalSidebar extends PortalSidebar {
+    static selector = ".o_portal_invoice_sidebar";
+    dynamicContent = {
+        _window: { "t-on-resize": this.updateIframeSize },
+        ".o_portal_invoice_print": { "t-on-click.prevent.withTarget": this.onClickPrint },
+    };
+
+    setup() {
+        super.setup();
+        this.invoiceHTMLEl = this.el.querySelector("iframe#invoice_html");
+    }
+
+    start() {
+        super.start();
+        const iframeDoc = this.invoiceHTMLEl.contentDocument || this.invoiceHTMLEl.contentWindow.document;
+        if (iframeDoc.readyState === 'complete') {
+            this.updateIframeSize();
+        } else {
+            this.addListener(this.invoiceHTMLEl, "load", this.updateIframeSize);
+        }
+    }
+
+    /**
+     * Called when the iframe is loaded or the window is resized on customer portal.
+     * The goal is to expand the iframe height to display the full report without scrollbar.
+     */
+    updateIframeSize() {
+        const wrapwrapEl = this.invoiceHTMLEl.contentDocument.querySelector("div#wrapwrap");
+        this.invoiceHTMLEl.style.height = 0;
+        this.invoiceHTMLEl.style.height = wrapwrapEl.scrollHeight;
+        // scroll to the right place after iframe resize
+        const isAnchor = /^#[\w-]+$/.test(window.location.hash)
+        if (!isAnchor) {
+            return;
+        }
+        const targetEl = document.querySelector(`#${window.location.hash}`);
+        if (!targetEl.length) {
+            return;
+        }
+        scrollTo(targetEl, { behavior: "instant" });
+    }
+
+    /**
+     * @param {MouseEvent} ev
+     */
+    onClickPrint(ev, currentTargetEl) {
+        this.printIframeContent(currentTargetEl.getAttribute("href"));
+    }
+}
+
+registry
+    .category("public.interactions")
+    .add("account.account_portal_sidebar", AccountPortalSidebar);

addons/account_payment/__manifest__.py

@@ -31,8 +31,7 @@
     'assets': {
         'web.assets_frontend': [
             'account_payment/static/src/js/payment_form.js',
-            'account_payment/static/src/js/portal_invoice_page_payment.js',
-            'account_payment/static/src/js/portal_my_invoices_payment.js',
+            'account_payment/static/src/interactions/*',
         ],
     },
     'post_init_hook': 'post_init_hook',

addons/account_payment/static/src/interactions/portal_invoice_page_payment.js

@@ -0,0 +1,17 @@
+import { Interaction } from "@web/public/interaction";
+import { registry } from "@web/core/registry";
+
+export class PortalInvoicePagePayment extends Interaction {
+    static selector = "#portal_pay";
+
+    setup() {
+        if (this.el.dataset.payment) {
+            (new Modal("#pay_with")).show();
+        }
+    }
+}
+
+registry
+    .category("public.interactions")
+    .add("account_payment.portal_invoice_page_payment", PortalInvoicePagePayment);
+

addons/account_payment/static/src/interactions/portal_my_invoices_payment.js

@@ -0,0 +1,33 @@
+import { Interaction } from "@web/public/interaction";
+import { registry } from "@web/core/registry";
+
+import { deserializeDateTime } from "@web/core/l10n/dates";
+import { _t } from "@web/core/l10n/translation";
+
+const { DateTime } = luxon;
+
+export class PortalMyInvoicesPaymentList extends Interaction {
+    static selector = ".o_portal_my_doc_table";
+
+    start() {
+        const today = DateTime.now().startOf("day");
+        const dueDateEls = this.el.querySelectorAll(".o_portal_invoice_due_date");
+        for (const dueDateEl of dueDateEls) {
+            const dateTime = deserializeDateTime(dueDateEl.getAttribute("datetime")).startOf('day');
+            const diff = dateTime.diff(today).as("days");
+
+            const dueDateLabel =
+                (diff === 0) ? _t("due today") :
+                    (diff > 0)
+                        ? _t("due in %s day(s)", Math.abs(diff).toFixed())
+                        : _t("%s day(s) overdue", Math.abs(diff).toFixed());
+
+            // We use `.createTextNode()` to escape possible HTML in translations (XSS)
+            dueDateEl.replaceChildren(document.createTextNode(dueDateLabel));
+        }
+    }
+}
+
+registry
+    .category("public.interactions")
+    .add("account_payment.portal_my_invoices_payment_list", PortalMyInvoicesPaymentList);

addons/account_peppol/__manifest__.py

@@ -39,6 +39,7 @@
             'account_peppol/static/src/components/**/*',
         ],
         'web.assets_frontend': [
+            'account_peppol/static/src/interactions/**/*',
             'account_peppol/static/src/js/*',
         ],
     }

addons/account_peppol/static/src/interactions/invoice_sending_method.js

@@ -0,0 +1,25 @@
+import { Interaction } from "@web/public/interaction";
+import { registry } from "@web/core/registry";
+
+export class InvoiceSendingMethod extends Interaction {
+    static selector = ".o_portal_details select[name='invoice_sending_method']";
+    dynamicContent = {
+        _root: { "t-on-change": this.showPeppolConfig },
+    };
+
+    start() {
+        this.showPeppolConfig();
+    }
+
+    showPeppolConfig() {
+        const method = this.el.value;
+        const peppolToggleEls = document.querySelectorAll(".portal_peppol_toggle");
+        for (const peppolToggleEl of peppolToggleEls) {
+            peppolToggleEl.classList.toggle("d-none", method !== "peppol");
+        }
+    }
+}
+
+registry
+    .category("public.interactions")
+    .add("account_peppol.invoice_sending_method", InvoiceSendingMethod);

addons/auth_passkey/__manifest__.py

@@ -26,7 +26,7 @@
         ],
         'web.assets_frontend': [
             'auth_passkey/static/lib/simplewebauthn.js',
-            'auth_passkey/static/src/login_passkeys.js',
+            'auth_passkey/static/src/interactions/*',
         ],
     },
     'license': 'LGPL-3',

addons/auth_passkey/static/src/interactions/passkey_login.js

@@ -0,0 +1,28 @@
+import { Interaction } from "@web/public/interaction";
+import { registry } from "@web/core/registry";
+
+import { rpc } from "@web/core/network/rpc";
+import { startAuthentication } from "../../lib/simplewebauthn.js";
+
+export class PasskeyLogin extends Interaction {
+    static selector = ".passkey_login_link";
+    dynamicContent = {
+        _root: { "t-on-click": this.onClick },
+    };
+
+    async onClick() {
+        const serverOptions = await this.waitFor(rpc("/auth/passkey/start-auth"));
+        const auth = await this.waitFor(startAuthentication(serverOptions).catch(e => console.error(e)));
+        if (!auth) {
+            return false;
+        }
+        const form = document.querySelector('form.oe_login_form');
+        form.querySelector('input[name="webauthn_response"]').value = JSON.stringify(auth);
+        form.querySelector('input[name="type"]').value = 'webauthn';
+        form.submit();
+    }
+}
+
+registry
+    .category("public.interactions")
+    .add("auth_passkey.passkey_login", PasskeyLogin);