changes

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/ai_suggestion/ai_alternatives_panel.js

@@ -0,0 +1,34 @@
+/** @odoo-module **/
+
+import { Component } from "@odoo/owl";
+import { useService } from "@web/core/utils/hooks";
+
+export class AiAlternativesPanel extends Component {
+    static template = "fusion_accounting_bank_rec.AiAlternativesPanel";
+    static props = {
+        suggestions: { type: Array },
+        onClose: { type: Function, optional: true },
+    };
+
+    setup() {
+        this.bankRec = useService("fusion_bank_reconciliation");
+    }
+
+    bandFor(c) {
+        if (c >= 0.85) return "high";
+        if (c >= 0.6) return "medium";
+        if (c > 0) return "low";
+        return "none";
+    }
+
+    pctFor(c) {
+        return Math.round(c * 100);
+    }
+
+    async onAccept(suggestionId) {
+        await this.bankRec.acceptSuggestion(suggestionId);
+        if (this.props.onClose) {
+            this.props.onClose();
+        }
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/ai_suggestion/ai_alternatives_panel.xml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.AiAlternativesPanel">
+        <div class="o_fusion_alternatives_panel">
+            <h6>Other AI suggestions</h6>
+            <div t-foreach="props.suggestions" t-as="sug" t-key="sug.id"
+                 class="o_fusion_alternative">
+                <div>
+                    <span class="alt_confidence" t-att-class="'band-' + bandFor(sug.confidence)">
+                        <t t-esc="pctFor(sug.confidence)"/>%
+                    </span>
+                    <t t-esc="sug.reasoning"/>
+                </div>
+                <button class="btn_fusion" t-on-click="() => onAccept(sug.id)">
+                    Use this
+                </button>
+            </div>
+            <div t-if="props.onClose" class="text-end mt-2">
+                <button class="btn_fusion" t-on-click="props.onClose">Close</button>
+            </div>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/ai_suggestion/ai_reasoning_tooltip.js

@@ -0,0 +1,18 @@
+/** @odoo-module **/
+
+import { Component } from "@odoo/owl";
+
+export class AiReasoningTooltip extends Component {
+    static template = "fusion_accounting_bank_rec.AiReasoningTooltip";
+    static props = {
+        scores: { type: Object },
+        reasoning: { type: String, optional: true },
+    };
+
+    pctFor(value) {
+        if (value === undefined || value === null) {
+            return "0";
+        }
+        return (value * 100).toFixed(0);
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/ai_suggestion/ai_reasoning_tooltip.xml

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.AiReasoningTooltip">
+        <div class="o_fusion_reasoning_tooltip" style="font-size: 0.85em; padding: 0.5rem;">
+            <div t-if="props.reasoning" class="mb-2">
+                <em><t t-esc="props.reasoning"/></em>
+            </div>
+            <div class="text-muted">
+                <div>Amount match: <t t-esc="pctFor(props.scores.amount_match)"/>%</div>
+                <div>Partner pattern: <t t-esc="pctFor(props.scores.partner_pattern)"/>%</div>
+                <div>Precedent similarity: <t t-esc="pctFor(props.scores.precedent_similarity)"/>%</div>
+                <div t-if="props.scores.ai_rerank">
+                    AI re-rank: <t t-esc="pctFor(props.scores.ai_rerank)"/>%
+                </div>
+            </div>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/ai_suggestion/ai_suggestion_strip.js

@@ -0,0 +1,38 @@
+/** @odoo-module **/
+
+import { Component } from "@odoo/owl";
+import { useService } from "@web/core/utils/hooks";
+
+export class AiSuggestionStrip extends Component {
+    static template = "fusion_accounting_bank_rec.AiSuggestionStrip";
+    static props = {
+        suggestion: { type: Object },
+        showAlternatives: { type: Function, optional: true },
+    };
+
+    setup() {
+        this.bankRec = useService("fusion_bank_reconciliation");
+    }
+
+    get band() {
+        const c = this.props.suggestion.confidence;
+        if (c >= 0.85) return "high";
+        if (c >= 0.6) return "medium";
+        if (c > 0) return "low";
+        return "none";
+    }
+
+    get confidencePct() {
+        return Math.round(this.props.suggestion.confidence * 100);
+    }
+
+    async onAccept() {
+        await this.bankRec.acceptSuggestion(this.props.suggestion.id);
+    }
+
+    onShowAlternatives() {
+        if (this.props.showAlternatives) {
+            this.props.showAlternatives();
+        }
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/ai_suggestion/ai_suggestion_strip.xml

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.AiSuggestionStrip">
+        <div class="o_fusion_ai_suggestion" t-att-data-band="band">
+            <div class="o_fusion_confidence_badge">
+                <t t-esc="confidencePct"/>%
+            </div>
+            <div class="o_fusion_suggestion_text">
+                <div class="o_fusion_reasoning">
+                    <t t-esc="props.suggestion.reasoning || 'AI suggested match'"/>
+                </div>
+            </div>
+            <div class="o_fusion_suggestion_actions">
+                <button class="btn_fusion btn_fusion_primary" t-on-click="onAccept">
+                    Accept
+                </button>
+                <button t-if="props.showAlternatives" class="btn_fusion"
+                        t-on-click="onShowAlternatives">
+                    Other options
+                </button>
+            </div>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/apply_amount/apply_amount.js

@@ -0,0 +1,82 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from `account_accountant/.../apply_amount/apply_amount.js`.
+ * Phase 1 structural parity.
+ */
+
+import { Component } from "@odoo/owl";
+import { standardFieldProps } from "@web/views/fields/standard_field_props";
+import { registry } from "@web/core/registry";
+import { useService } from "@web/core/utils/hooks";
+
+class BankRecWidgetApplyAmountHtmlField extends Component {
+    static props = standardFieldProps;
+    static template = "fusion_accounting_bank_rec.BankRecWidgetApplyAmountHtmlField";
+
+    setup() {
+        this.action = useService("action");
+        this.orm = useService("orm");
+    }
+
+    get value() {
+        return this.props.record.data[this.props.name];
+    }
+
+    async switchApplyAmount(ev) {
+        const root = this.env.model.root;
+        const fetchReconciledLines = async (fields = []) => {
+            return await this.orm.searchRead(
+                "account.move.line",
+                [
+                    [
+                        "id",
+                        "in",
+                        ...root.data.reconciled_lines_excluding_exchange_diff_ids._currentIds,
+                    ],
+                ],
+                fields
+            );
+        };
+
+        const fetchStatementLines = async (fields = []) => {
+            return await this.orm.searchRead(
+                "account.move.line",
+                [["move_id", "=", root.data.move_id.id]],
+                fields
+            );
+        };
+
+        if (ev.target.attributes.name?.value === "action_redirect_to_move") {
+            const [line] = await fetchReconciledLines(["amount_currency", "balance", "move_id"]);
+            await this.openMove(line.move_id[0]);
+        } else if (ev.target.attributes.name?.value === "apply_full_amount") {
+            const [line] = await fetchReconciledLines(["amount_currency", "balance"]);
+            await root.update({
+                balance: -line.balance,
+                amount_currency: -line.amount_currency,
+            });
+        } else if (ev.target.attributes.name?.value === "apply_partial_amount") {
+            const lines = await fetchStatementLines(["amount_currency", "balance"]);
+            // We have all the lines of the entry, we want the suspense line.
+            await root.update({
+                balance: lines.at(-1).balance,
+                amount_currency: lines.at(-1).amount_currency,
+            });
+        }
+    }
+
+    openMove(moveId) {
+        this.action.doAction({
+            type: "ir.actions.act_window",
+            res_model: "account.move",
+            res_id: moveId,
+            views: [[false, "form"]],
+            target: "current",
+        });
+    }
+}
+
+const fusionBankRecWidgetApplyAmountHtmlField = { component: BankRecWidgetApplyAmountHtmlField };
+
+registry.category("fields").add("fusion_apply_amount_html", fusionBankRecWidgetApplyAmountHtmlField);

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/apply_amount/apply_amount.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.BankRecWidgetApplyAmountHtmlField">
+        <div t-out="value" t-on-click="switchApplyAmount"/>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/attachment_strip/attachment_strip.js

@@ -0,0 +1,27 @@
+/** @odoo-module **/
+
+import { Component } from "@odoo/owl";
+
+export class AttachmentStrip extends Component {
+    static template = "fusion_accounting_bank_rec.AttachmentStrip";
+    static props = {
+        attachments: { type: Array },
+    };
+
+    iconFor(mimetype) {
+        if (!mimetype) {
+            return "fa-file";
+        }
+        if (mimetype.startsWith("image/")) {
+            return "fa-file-image-o";
+        }
+        if (mimetype === "application/pdf") {
+            return "fa-file-pdf-o";
+        }
+        return "fa-file-o";
+    }
+
+    urlFor(att) {
+        return `/web/content/${att.id}?download=true`;
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/attachment_strip/attachment_strip.xml

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.AttachmentStrip">
+        <div class="o_fusion_attachment_strip d-flex flex-wrap"
+             style="gap: 0.5rem; padding: 0.5rem;">
+            <div t-if="props.attachments.length === 0" class="text-muted small">
+                No attachments
+            </div>
+            <a t-foreach="props.attachments" t-as="att" t-key="att.id"
+               t-att-href="urlFor(att)" target="_blank"
+               class="o_fusion_attachment_chip"
+               style="display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.25rem 0.5rem; background: #f3f4f6; border-radius: 0.25rem; text-decoration: none; color: inherit; font-size: 0.85em;">
+                <i class="fa" t-att-class="iconFor(att.mimetype)"/>
+                <span><t t-esc="att.name"/></span>
+            </a>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/bank_reconciliation_service.js

@@ -0,0 +1,14 @@
+/** @odoo-module **/
+
+/**
+ * Re-export shim so mirrored Enterprise components can use the relative
+ * import `../bank_reconciliation_service` unchanged. The real
+ * implementation lives in
+ * `@fusion_accounting_bank_rec/services/bank_reconciliation_service`.
+ */
+
+export {
+    BankReconciliationService,
+    bankReconciliationService,
+    useBankReconciliation,
+} from "@fusion_accounting_bank_rec/services/bank_reconciliation_service";

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/bankrec_form_dialog/bankrec_form_dialog.js

@@ -0,0 +1,48 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from
+ * `account_accountant/.../bankrec_form_dialog/bankrec_form_dialog.js`.
+ * Phase 1 structural parity.
+ */
+
+import { FormController } from "@web/views/form/form_controller";
+import { FormViewDialog } from "@web/views/view_dialogs/form_view_dialog";
+import { formView } from "@web/views/form/form_view";
+import { onWillStart } from "@odoo/owl";
+import { registry } from "@web/core/registry";
+import { user } from "@web/core/user";
+
+export class BankRecFormDialog extends FormViewDialog {
+    setup() {
+        super.setup();
+        Object.assign(this.viewProps, {
+            buttonTemplate: "fusion_accounting_bank_rec.BankRecFormDialog.buttons",
+        });
+    }
+}
+
+export class BankRecEditLineFormController extends FormController {
+    setup() {
+        super.setup();
+        this.isReviewed = this.props.context.is_reviewed;
+        onWillStart(async () => {
+            this.userCanReview = await user.hasGroup("account.group_account_user");
+        });
+    }
+
+    async toReviewButtonClicked(params = {}) {
+        await this.orm.call("account.move", "set_moves_checked", [
+            this.model.root.data.move_id.id,
+            false,
+        ]);
+        return this.saveButtonClicked(params);
+    }
+}
+
+export const bankRecEditLineFormController = {
+    ...formView,
+    Controller: BankRecEditLineFormController,
+};
+
+registry.category("views").add("fusion_bankrec_edit_line", bankRecEditLineFormController);

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/bankrec_form_dialog/bankrec_form_dialog.xml

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.BankRecFormDialog.buttons" t-inherit="web.FormViewDialog.ToOne.buttons" t-inherit-mode="primary">
+        <xpath expr="//button[hasclass('o_form_button_save')]" position="after">
+            <button
+                t-if="userCanReview and this.isReviewed"
+                class="btn btn-info"
+                t-on-click.stop="() => this.toReviewButtonClicked({closable: true})"
+                data-hotkey="q">
+                <span>To Review</span>
+            </button>
+        </xpath>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/batch_action_bar/batch_action_bar.js

@@ -0,0 +1,37 @@
+/** @odoo-module **/
+
+import { Component } from "@odoo/owl";
+import { useService } from "@web/core/utils/hooks";
+
+export class BatchActionBar extends Component {
+    static template = "fusion_accounting_bank_rec.BatchActionBar";
+    static props = {
+        selectedIds: { type: Array, optional: true },
+    };
+
+    setup() {
+        this.bankRec = useService("fusion_bank_reconciliation");
+    }
+
+    get hasSelection() {
+        return this.props.selectedIds && this.props.selectedIds.length > 0;
+    }
+
+    get selectionCount() {
+        return this.props.selectedIds ? this.props.selectedIds.length : 0;
+    }
+
+    async onAutoReconcile() {
+        if (!this.hasSelection) {
+            return;
+        }
+        await this.bankRec.bulkReconcile(this.props.selectedIds, "auto");
+    }
+
+    async onSuggestForSelected() {
+        if (!this.hasSelection) {
+            return;
+        }
+        await this.bankRec.suggestMatches(this.props.selectedIds, 3);
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/batch_action_bar/batch_action_bar.xml

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.BatchActionBar">
+        <div class="o_fusion_batch_action_bar d-flex"
+             style="gap: 0.5rem; padding: 0.75rem; background: #f3f4f6; border-radius: 0.375rem;">
+            <span class="text-muted">
+                <t t-esc="selectionCount"/> selected
+            </span>
+            <button class="btn_fusion" t-att-disabled="!hasSelection" t-on-click="onSuggestForSelected">
+                Suggest for selected
+            </button>
+            <button class="btn_fusion btn_fusion_primary" t-att-disabled="!hasSelection" t-on-click="onAutoReconcile">
+                Auto-reconcile selected
+            </button>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/button/button.js

@@ -0,0 +1,29 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from `account_accountant/.../button/button.js`.
+ * Phase 1 structural parity.
+ */
+
+import { Component } from "@odoo/owl";
+import { useService } from "@web/core/utils/hooks";
+
+export class BankRecButton extends Component {
+    static template = "fusion_accounting_bank_rec.BankRecButton";
+    static props = {
+        label: { type: String, optional: true },
+        action: { type: Function, optional: true },
+        count: { type: [Number, { value: null }], optional: true },
+        primary: { type: Boolean, optional: true },
+        toReview: { type: Boolean, optional: true },
+        classes: { type: String, optional: true },
+    };
+    static defaultProps = {
+        primary: false,
+        classes: "",
+    };
+
+    setup() {
+        this.ui = useService("ui");
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/button/button.xml

@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="utf-8"?>
+<templates>
+    <t t-name="fusion_accounting_bank_rec.BankRecButton">
+        <button
+            t-attf-class="d-flex gap-1 btn text-nowrap {{ props.classes }}"
+            t-att-class="{'btn-sm': !ui.isSmall, 'btn-primary': props.primary, 'btn-info': props.toReview, 'btn-secondary': !props.primary}"
+            t-on-click.stop="() => props?.action()"
+        >
+            <span t-esc="props?.label" class="m-auto text-truncate"/>
+            <span class="rounded-pill px-2 o_bg-black-10" t-if="props?.count">
+                <t t-esc="props.count"/>
+            </span>
+        </button>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/button_list/button_list.js

@@ -0,0 +1,603 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from `account_accountant/.../button_list/button_list.js`.
+ * Phase 1 structural parity. Behaviour delegates to the
+ * Enterprise-compat surface in our `fusion_bank_reconciliation` service.
+ */
+
+import { BankRecButton } from "@fusion_accounting_bank_rec/components/bank_reconciliation/button/button";
+import { BankRecFileUploader } from "@fusion_accounting_bank_rec/components/bank_reconciliation/file_uploader/file_uploader";
+import { Component } from "@odoo/owl";
+import { ConfirmationDialog } from "@web/core/confirmation_dialog/confirmation_dialog";
+import { Dropdown } from "@web/core/dropdown/dropdown";
+import { DropdownItem } from "@web/core/dropdown/dropdown_item";
+import { SelectCreateDialog } from "@web/views/view_dialogs/select_create_dialog";
+import { BankRecSelectCreateDialog } from "@fusion_accounting_bank_rec/components/bank_reconciliation/search_dialog/search_dialog";
+import { _t } from "@web/core/l10n/translation";
+import { getCurrency } from "@web/core/currency";
+import { useOwnedDialogs, useService } from "@web/core/utils/hooks";
+import { useBankReconciliation } from "@fusion_accounting_bank_rec/components/bank_reconciliation/bank_reconciliation_service";
+import { useHotkey } from "@web/core/hotkeys/hotkey_hook";
+
+export class BankRecButtonList extends Component {
+    static template = "fusion_accounting_bank_rec.BankRecButtonList";
+    static components = {
+        Dropdown,
+        DropdownItem,
+        BankRecButton,
+        BankRecFileUploader,
+    };
+    static props = {
+        statementLineRootRef: { type: Object },
+        statementLine: { type: Object },
+        suspenseAccountLine: { type: Object, optional: true },
+        reconcileLineCount: { type: [Number, { value: null }], optional: true },
+        reconcileModels: Array,
+        preSelectedReconciliationModel: { type: Object, optional: true },
+    };
+    static defaultProps = {
+        reconcileLineCount: 0,
+    };
+
+    setup() {
+        this.action = useService("action");
+        this.ui = useService("ui");
+        this.orm = useService("orm");
+
+        this.addDialog = useOwnedDialogs();
+        this.currencyDigits = getCurrency(this.statementLineData.currency_id.id)?.digits || 2;
+        this.bankReconciliation = useBankReconciliation();
+
+        this.registerHotkeys();
+    }
+
+    restoreFocus() {
+        if (this.isLineSelected) {
+            this.props.statementLineRootRef.el.focus();
+        }
+    }
+
+    /**
+     * Displays a search dialog (no create option) for selecting a `res.partner` record.
+     */
+    setPartnerOnReconcileLine() {
+        this.addDialog(
+            SelectCreateDialog,
+            {
+                title: _t("Search: Partner"),
+                noCreate: false,
+                multiSelect: false,
+                resModel: "res.partner",
+                context: { default_name: this.statementLineData.partner_name },
+                onSelected: async (partner) => {
+                    await this.orm.call(
+                        "account.bank.statement.line",
+                        "set_partner_bank_statement_line",
+                        [this.statementLineData.id, partner[0]]
+                    );
+                    const recordsToLoad = [];
+                    if (this.statementLineData.partner_name) {
+                        // Reload all impacted statement lines if we have a partner_name
+                        recordsToLoad.push(
+                            ...this.env.model.root.records.filter(
+                                (record) =>
+                                    record.data.partner_name === this.statementLineData.partner_name
+                            )
+                        );
+                    } else {
+                        recordsToLoad.push(this.props.statementLine);
+                    }
+                    await this.bankReconciliation.reloadRecords(recordsToLoad);
+                    await this.bankReconciliation.computeReconcileLineCountPerPartnerId(
+                        this.env.model.root.records
+                    );
+                    this.bankReconciliation.reloadChatter();
+                    this.restoreFocus();
+                },
+            },
+            {
+                onClose: () => {
+                    this.restoreFocus();
+                },
+            }
+        );
+    }
+
+    /**
+     * Opens a dialog to select an account and assigns it to the current reconcile line.
+     */
+    setAccountOnReconcileLine() {
+        const context = {
+            list_view_ref: "account_accountant.view_account_list_bank_rec_widget",
+            search_view_ref: "account_accountant.view_account_search_bank_rec_widget",
+            ...(this.statementLineData.amount > 0
+                ? { preferred_account_type: "income" }
+                : { preferred_account_type: "expense" }),
+        };
+
+        this.addDialog(
+            SelectCreateDialog,
+            {
+                title: _t("Search: Account"),
+                noCreate: true,
+                multiSelect: false,
+                domain: [
+                    [
+                        "id",
+                        "not in",
+                        [
+                            this.statementLineData.journal_id.suspense_account_id.id,
+                            this.statementLineData.journal_id.default_account_id.id,
+                        ],
+                    ],
+                ],
+                context: context,
+                resModel: "account.account",
+                onSelected: async (account) => {
+                    const linesToLoad = await this._setAccountOnReconcileLine(
+                        this.lastAccountMoveLine.data.id,
+                        account[0],
+                        { context: { account_default_taxes: true } }
+                    );
+                    const recordsToLoad = [
+                        ...this.env.model.root.records.filter((record) =>
+                            linesToLoad.includes(record.data.id)
+                        ),
+                        this.props.statementLine,
+                    ];
+                    await this.bankReconciliation.reloadRecords(recordsToLoad);
+                    this.bankReconciliation.reloadChatter();
+                    this.restoreFocus();
+                },
+            },
+            {
+                onClose: () => {
+                    this.restoreFocus();
+                },
+            }
+        );
+    }
+
+    async _setAccountOnReconcileLine(amlId, accountId, context = {}) {
+        return await this.orm.call(
+            "account.bank.statement.line",
+            "set_account_bank_statement_line",
+            [this.statementLineData.id, amlId, accountId],
+            context
+        );
+    }
+
+    async setAccountReceivableOnReconcileLine() {
+        let accountId;
+        if (this.statementLineData.partner_id.property_account_receivable_id.id) {
+            accountId = this.statementLineData.partner_id.property_account_receivable_id.id;
+        } else {
+            accountId = await this.orm.webSearchRead("account.account", [
+                ["account_type", "=", "asset_receivable"],
+            ]);
+        }
+        await this._setAccountOnReconcileLine(this.lastAccountMoveLine.data.id, accountId);
+        this.props.statementLine.load();
+        this.bankReconciliation.reloadChatter();
+    }
+
+    async setAccountPayableOnReconcileLine() {
+        let accountId;
+        if (this.statementLineData.partner_id.property_account_payable_id.id) {
+            accountId = this.statementLineData.partner_id.property_account_payable_id.id;
+        } else {
+            accountId = await this.orm.webSearchRead("account.account", [
+                ["account_type", "=", "liability_payable"],
+            ]);
+        }
+        await this._setAccountOnReconcileLine(this.lastAccountMoveLine.data.id, accountId);
+        this.props.statementLine.load();
+        this.bankReconciliation.reloadChatter();
+    }
+
+    /**
+     * Opens a dialog to search and select journal items to reconcile with the current bank statement line.
+     */
+    reconcileOnReconcileLine() {
+        const context = {
+            list_view_ref: "account_accountant.view_account_move_line_list_bank_rec_widget",
+            search_view_ref: "account_accountant.view_account_move_line_search_bank_rec_widget",
+            preferred_aml_value: -this.props.suspenseAccountLine.amount_currency,
+            preferred_aml_currency_id: this.props.suspenseAccountLine.currency_id.id,
+            ...(this.statementLineData.partner_id
+                ? { search_default_partner_id: this.statementLineData.partner_id.id }
+                : { search_default_posted: 1 }),
+        };
+
+        this.addDialog(
+            BankRecSelectCreateDialog,
+            {
+                title: _t("Search: Journal Items to Match"),
+                noCreate: true,
+                domain: this.getReconcileButtonDomain(),
+                resModel: "account.move.line",
+                size: "xl",
+                context: context,
+                onSelected: async (moveLines) => {
+                    await this.orm.call(
+                        "account.bank.statement.line",
+                        "set_line_bank_statement_line",
+                        [this.statementLineData.id, moveLines]
+                    );
+                    await this.bankReconciliation.computeReconcileLineCountPerPartnerId(
+                        this.env.model.root.records
+                    );
+                    this.props.statementLine.load();
+                    this.bankReconciliation.reloadChatter();
+                    this.restoreFocus();
+                },
+                suspenseAccountLine: this.props.suspenseAccountLine,
+                reference: this.statementLineData.payment_ref,
+                date: this.statementLineData.date,
+            },
+            {
+                onClose: () => {
+                    this.restoreFocus();
+                },
+            }
+        );
+    }
+
+    getReconcileButtonDomain() {
+        return [
+            ["parent_state", "in", ["draft", "posted"]],
+            ["company_id", "child_of", this.statementLineData.company_id.id],
+            ["search_account_id.reconcile", "=", true],
+            ["display_type", "not in", ["line_section", "line_note"]],
+            ["reconciled", "=", false],
+            "|",
+            ["search_account_id.account_type", "not in", ["asset_receivable", "liability_payable"]],
+            ["payment_id", "=", false],
+            ["statement_line_id", "!=", this.statementLineData.id],
+        ];
+    }
+
+    /**
+     * Deletes the current bank statement line.
+     */
+    async deleteTransaction() {
+        this.addDialog(ConfirmationDialog, {
+            body: _t("Are you sure you want to delete this statement line?"),
+            confirm: async () => {
+                await this.orm.unlink("account.bank.statement.line", [this.statementLineData.id]);
+                this.env.model.load();
+            },
+            cancel: () => {},
+        });
+    }
+
+    /**
+     * Set the move of the statement line as to check
+     */
+    async setStatementLineAsReviewed() {
+        await this.orm.call("account.move", "set_moves_checked", [
+            this.statementLineData.move_id.id,
+        ]);
+        this.props.statementLine.load();
+        this.bankReconciliation.reloadChatter();
+    }
+
+    // -----------------------------------------------------------------------------
+    // Reconciliation Model
+    // -----------------------------------------------------------------------------
+    async triggerReconciliationModel(reconciliationModelId) {
+        await this.orm.call("account.reconcile.model", "trigger_reconciliation_model", [
+            reconciliationModelId,
+            this.statementLineData.id,
+        ]);
+        await this.bankReconciliation.computeReconcileLineCountPerPartnerId(
+            this.env.model.root.records
+        );
+        this.props.statementLine.load();
+        this.bankReconciliation.reloadChatter();
+    }
+
+    getKeyAction(key) {
+        const keyActions = {
+            1: {
+                condition:
+                    this.props.statementLineRootRef.el.querySelector(".set-partner-btn") &&
+                    this.isLineSelected,
+                action: async () => this.setPartnerOnReconcileLine(),
+                buttonElement: this.props.statementLineRootRef.el.querySelector(".set-partner-btn"),
+            },
+            2: {
+                condition:
+                    this.props.statementLineRootRef.el.querySelector(".reconcile-btn") &&
+                    this.isLineSelected,
+                action: async () => this.reconcileOnReconcileLine(),
+                buttonElement: this.props.statementLineRootRef.el.querySelector(".reconcile-btn"),
+            },
+            3: {
+                condition:
+                    this.props.statementLineRootRef.el.querySelector(".set-account-btn") &&
+                    this.isLineSelected,
+                action: () => this.setAccountOnReconcileLine(),
+                buttonElement: this.props.statementLineRootRef.el.querySelector(".set-account-btn"),
+            },
+            4: {
+                condition:
+                    this.props.statementLineRootRef.el.querySelector(".set-payable-btn") &&
+                    this.isLineSelected,
+                action: () => this.setAccountPayableOnReconcileLine(),
+                buttonElement: this.props.statementLineRootRef.el.querySelector(".set-payable-btn"),
+            },
+            5: {
+                condition:
+                    this.props.statementLineRootRef.el.querySelector(".set-receivable-btn") &&
+                    this.isLineSelected,
+                action: () => this.setAccountReceivableOnReconcileLine(),
+                buttonElement:
+                    this.props.statementLineRootRef.el.querySelector(".set-receivable-btn"),
+            },
+            6: {
+                condition:
+                    this.props.statementLineRootRef.el.querySelector(
+                        ".reconciliation-model-btn-0"
+                    ) && this.isLineSelected,
+                action: () => {
+                    const buttonElement = this.props.statementLineRootRef.el.querySelector(
+                        ".reconciliation-model-btn-0"
+                    );
+                    if (buttonElement) {
+                        buttonElement.click();
+                    }
+                },
+                buttonElement: this.props.statementLineRootRef.el.querySelector(
+                    ".reconciliation-model-btn-0"
+                ),
+            },
+            7: {
+                condition:
+                    this.props.statementLineRootRef.el.querySelector(
+                        ".reconciliation-model-btn-1"
+                    ) && this.isLineSelected,
+                action: () => {
+                    const buttonElement = this.props.statementLineRootRef.el.querySelector(
+                        ".reconciliation-model-btn-1"
+                    );
+                    if (buttonElement) {
+                        buttonElement.click();
+                    }
+                },
+                buttonElement: this.props.statementLineRootRef.el.querySelector(
+                    ".reconciliation-model-btn-1"
+                ),
+            },
+            8: {
+                condition:
+                    this.props.statementLineRootRef.el.querySelector(
+                        ".reconciliation-model-btn-2"
+                    ) && this.isLineSelected,
+                action: () => {
+                    const buttonElement = this.props.statementLineRootRef.el.querySelector(
+                        ".reconciliation-model-btn-2"
+                    );
+                    if (buttonElement) {
+                        buttonElement.click();
+                    }
+                },
+                buttonElement: this.props.statementLineRootRef.el.querySelector(
+                    ".reconciliation-model-btn-2"
+                ),
+            },
+            Enter: {
+                condition:
+                    this.props.statementLineRootRef.el.querySelector(".btn-primary") &&
+                    this.isLineSelected,
+                action: () => {
+                    const primaryButtons =
+                        this.props.statementLineRootRef.el.querySelectorAll(".btn-primary");
+                    if (primaryButtons.length > 0) {
+                        primaryButtons[0].click();
+                    }
+                },
+                buttonElement: this.props.statementLineRootRef.el.querySelector(".btn-primary"),
+            },
+        };
+        return keyActions[key];
+    }
+
+    registerHotkeys() {
+        const hotkeyConfigs = [
+            { key: "1", trigger: "alt+shift+1" },
+            { key: "2", trigger: "alt+shift+2" },
+            { key: "3", trigger: "alt+shift+3" },
+            { key: "4", trigger: "alt+shift+4" },
+            { key: "5", trigger: "alt+shift+5" },
+            { key: "6", trigger: "alt+shift+6" },
+            { key: "7", trigger: "alt+shift+7" },
+            { key: "8", trigger: "alt+shift+8" },
+            { key: "Enter", trigger: "alt+shift+enter" },
+        ];
+        hotkeyConfigs.forEach(({ key, trigger }) => {
+            useHotkey(
+                trigger,
+                ({ target }) => {
+                    const { condition, action } = this.getKeyAction(key);
+                    if (condition) {
+                        action();
+                    }
+                },
+                {
+                    area: () => this.props.statementLineRootRef.el.parentElement,
+                    withOverlay: () => {
+                        const { buttonElement, condition } = this.getKeyAction(key);
+                        return condition ? buttonElement : null;
+                    },
+                    isAvailable: () => {
+                        const { condition } = this.getKeyAction(key);
+                        return condition;
+                    },
+                }
+            );
+        });
+    }
+
+    // -----------------------------------------------------------------------------
+    // File Uploader
+    // -----------------------------------------------------------------------------
+    get bankRecFileUploaderRecord() {
+        return {
+            statementLineId: this.statementLineData.id,
+        };
+    }
+
+    // -----------------------------------------------------------------------------
+    // ACTION
+    // -----------------------------------------------------------------------------
+    actionViewRecoModels() {
+        return this.action.doAction("account.action_account_reconcile_model");
+    }
+
+    // -----------------------------------------------------------------------------
+    // GETTER
+    // -----------------------------------------------------------------------------
+    get statementLineData() {
+        return this.props.statementLine.data;
+    }
+
+    get isLineSelected() {
+        return this.statementLineData.id === this.bankReconciliation.statementLine?.data.id;
+    }
+
+    get lastAccountMoveLine() {
+        return this.statementLineData.line_ids.records.at(-1);
+    }
+
+    get isCustomerRankHigher() {
+        return (
+            this.statementLineData.partner_id.customer_rank >
+            this.statementLineData.partner_id.supplier_rank
+        );
+    }
+
+    get isSetPartnerButtonShown() {
+        return !this.statementLineData.partner_id;
+    }
+
+    get isSetAccountButtonShown() {
+        return !this.statementLineData.account_id;
+    }
+
+    get isSetReceivableButtonShown() {
+        return (
+            !this.isSetPartnerButtonShown &&
+            ((this.statementLineData.partner_id.customer_rank && this.isCustomerRankHigher) ||
+                this.statementLineData.amount > 0)
+        );
+    }
+
+    get isSetPayableButtonShown() {
+        return (
+            !this.isSetPartnerButtonShown &&
+            ((this.statementLineData.partner_id.supplier_rank && !this.isCustomerRankHigher) ||
+                this.statementLineData.amount < 0)
+        );
+    }
+
+    get isReconcileButtonShown() {
+        return this.props.reconcileLineCount === null || this.props.reconcileLineCount;
+    }
+
+    get reconcileModelsInDropdown() {
+        if (this.ui.isSmall) {
+            return this.props.reconcileModels;
+        }
+        return this.props.reconcileModels.filter(
+            (model) => model.id !== this.props?.preSelectedReconciliationModel?.id
+        );
+    }
+
+    get buttons() {
+        const buttonsToDisplay = {};
+        if (this.isSetPartnerButtonShown) {
+            buttonsToDisplay.partner = {
+                label: _t("Set Partner"),
+                action: this.setPartnerOnReconcileLine.bind(this),
+                classes: "set-partner-btn",
+            };
+        } else {
+            buttonsToDisplay.receivable = {
+                label: _t("Receivable"),
+                action: this.setAccountReceivableOnReconcileLine.bind(this),
+                classes: "set-receivable-btn",
+            };
+            buttonsToDisplay.payable = {
+                label: _t("Payable"),
+                action: this.setAccountPayableOnReconcileLine.bind(this),
+                classes: "set-payable-btn",
+            };
+        }
+
+        if (this.isReconcileButtonShown) {
+            buttonsToDisplay.reconcile = {
+                label: _t("Reconcile"),
+                action: this.reconcileOnReconcileLine.bind(this),
+                count: this.props.reconcileLineCount,
+                classes: "reconcile-btn",
+            };
+        }
+
+        if (this.isSetAccountButtonShown) {
+            buttonsToDisplay.account = {
+                label: _t("Set Account"),
+                action: this.setAccountOnReconcileLine.bind(this),
+                classes: "set-account-btn",
+            };
+        }
+
+        if (this.statementLineData.is_reconciled && !this.statementLineData.checked) {
+            buttonsToDisplay.toReview = {
+                label: _t("Reviewed"),
+                action: this.setStatementLineAsReviewed.bind(this),
+                toReview: true,
+            };
+        }
+
+        return buttonsToDisplay;
+    }
+
+    get buttonsToDisplay() {
+        const buttons = this.buttons || {};
+
+        let primaryButtonKeys = [];
+        let secondaryButtonKeys = [];
+        if (buttons?.partner && buttons?.account) {
+            primaryButtonKeys = ["partner", "account"];
+        } else if (buttons?.reconcile && !!buttons.reconcile?.count) {
+            primaryButtonKeys = ["reconcile"];
+            if (this.isSetReceivableButtonShown) {
+                secondaryButtonKeys = ["receivable"];
+            } else {
+                secondaryButtonKeys = ["payable"];
+            }
+        } else if (this.isSetReceivableButtonShown) {
+            primaryButtonKeys = ["receivable"];
+        } else if (this.isSetPayableButtonShown) {
+            primaryButtonKeys = ["payable"];
+        }
+
+        return [
+            ...primaryButtonKeys.map((key) => ({ ...buttons[key], primary: true })),
+            ...secondaryButtonKeys.map((key) => ({ ...buttons[key] })),
+        ];
+    }
+
+    get buttonsInDropdown() {
+        const buttons = this.buttons || {};
+        if (this.props.preSelectedReconciliationModel) {
+            return Object.values(buttons);
+        }
+        const buttonToDisplayClasses = this.buttonsToDisplay.map((button) => button.classes) || [];
+        return Object.values(buttons).filter(
+            (button) => !buttonToDisplayClasses.includes(button.classes)
+        );
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/button_list/button_list.xml

@@ -0,0 +1,56 @@
+<?xml version="1.0" encoding="utf-8"?>
+<templates>
+    <t t-name="fusion_accounting_bank_rec.BankRecButtonList">
+        <div class="d-flex flex-wrap gap-1">
+            <t t-if="props.preSelectedReconciliationModel and !statementLineData.is_reconciled">
+                <BankRecButton
+                    label="props.preSelectedReconciliationModel.display_name"
+                    primary="true"
+                    action.bind="() => this.triggerReconciliationModel(props.preSelectedReconciliationModel.id)"
+                />
+            </t>
+            <t t-elif="buttons?.toReview">
+                <BankRecButton t-props="buttons.toReview"/>
+            </t>
+            <t t-else="">
+                <t t-foreach="buttonsToDisplay" t-as="button" t-key="button_index">
+                    <BankRecButton t-props="button"/>
+                </t>
+            </t>
+
+            <Dropdown t-if="!statementLineData.is_reconciled">
+                <button class="btn btn-secondary" t-att-class="{'btn-sm': !ui.isSmall}">
+                    <i class="oi oi-ellipsis-v"/>
+                </button>
+
+                <t t-set-slot="content">
+                    <t t-foreach="buttonsInDropdown" t-as="button" t-key="button_index">
+                        <DropdownItem class="'btn btn-link'" onSelected.bind="button.action">
+                            <t t-esc="button.label"/>
+                        </DropdownItem>
+                    </t>
+                    <BankRecFileUploader record="bankRecFileUploaderRecord">
+                        <t t-set-slot="toggler">
+                            <span class="dropdown-item dropdown-item o-navigable btn btn-link">
+                                Upload Bills
+                            </span>
+                        </t>
+                    </BankRecFileUploader>
+                    <div class="dropdown-divider"/>
+                    <t t-foreach="reconcileModelsInDropdown" t-as="model" t-key="model.id">
+                        <DropdownItem class="'btn btn-link'" onSelected.bind="() => this.triggerReconciliationModel(model.id)">
+                            <t t-esc="model.display_name"/>
+                        </DropdownItem>
+                    </t>
+                    <div t-if="reconcileModelsInDropdown.length" class="dropdown-divider"/>
+                    <DropdownItem class="'btn btn-link'" onSelected.bind="actionViewRecoModels">
+                        Manage Models
+                    </DropdownItem>
+                    <DropdownItem class="'btn btn-link'" onSelected.bind="deleteTransaction">
+                        Delete Transaction
+                    </DropdownItem>
+                </t>
+            </Dropdown>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/chatter/chatter.js

@@ -0,0 +1,16 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from `account_accountant/.../chatter/chatter.js`.
+ * Phase 1 structural parity.
+ */
+
+import { Chatter } from "@mail/chatter/web_portal/chatter";
+
+export class BankRecChatter extends Chatter {
+    static props = [...Chatter.props, "statementLine?"];
+
+    async reloadParentView() {
+        await this.props.statementLine?.load();
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/file_uploader/file_uploader.js

@@ -0,0 +1,29 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from
+ * `account_accountant/.../file_uploader/file_uploader.js`.
+ * Phase 1 structural parity.
+ */
+
+import { DocumentFileUploader } from "@account/components/document_file_uploader/document_file_uploader";
+
+export class BankRecFileUploader extends DocumentFileUploader {
+    /**
+     * Extends `DocumentFileUploader.getExtraContext` to add the
+     * `statement_line_id` to the context, used by
+     * `account.bank.statement.line.create_document_from_attachment` to link
+     * the uploaded bill back to the originating statement line.
+     */
+    getExtraContext() {
+        const extraContext = super.getExtraContext();
+        return {
+            ...extraContext,
+            statement_line_id: this.props.record.statementLineId,
+        };
+    }
+
+    getResModel() {
+        return "account.bank.statement.line";
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/line_info_pop_over/line_info_pop_over.js

@@ -0,0 +1,80 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from
+ * `account_accountant/.../line_info_pop_over/line_info_pop_over.js`.
+ * Phase 1 structural parity.
+ */
+
+import { Component } from "@odoo/owl";
+import { formatMonetary } from "@web/views/fields/formatters";
+import { useService } from "@web/core/utils/hooks";
+
+export class BankRecLineInfoPopOver extends Component {
+    static template = "fusion_accounting_bank_rec.BankRecLineInfoPopOver";
+    static props = {
+        lineData: { type: Object, optional: true },
+        statementLineData: { type: Object, optional: true },
+        exchangeMove: { type: Object, optional: true },
+        isPartiallyReconciled: { type: Boolean, optional: true },
+        close: { type: Function, optional: true },
+    };
+
+    setup() {
+        this.action = useService("action");
+    }
+
+    openExchangeMove() {
+        this.action.doAction({
+            type: "ir.actions.act_window",
+            res_model: "account.move",
+            res_id: this.props.exchangeMove.id,
+            views: [[false, "form"]],
+            target: "current",
+        });
+    }
+
+    openReconciledMove() {
+        this.action.doAction({
+            type: "ir.actions.act_window",
+            res_model: "account.move",
+            res_id: this.reconciledLineData.move_id.id,
+            views: [[false, "form"]],
+            target: "current",
+        });
+    }
+
+    get reconciledMoveName() {
+        return this.reconciledLineData.move_name;
+    }
+
+    get formattedReconciledMoveAmountCurrency() {
+        return formatMonetary(this.reconciledLineData.amount_currency, {
+            currencyId: this.reconciledLineData.currency_id.id,
+        });
+    }
+
+    get reconciledLineData() {
+        return this.props.lineData.reconciled_lines_ids.records[0].data;
+    }
+
+    get formattedLineDataAmountCurrency() {
+        return formatMonetary(this.props.lineData.amount_currency, {
+            currencyId: this.props.lineData.currency_id.id,
+        });
+    }
+
+    get exchangeDiffMoveName() {
+        return this.props.exchangeMove.display_name;
+    }
+
+    get exchangeMoveBalance() {
+        return this.props.exchangeMove.line_ids[0].balance;
+    }
+
+    get formattedExchangeMoveBalance() {
+        return formatMonetary(this.exchangeMoveBalance, {
+            currencyId: this.props.statementLineData.company_id.currency_id?.id,
+        });
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/line_info_pop_over/line_info_pop_over.xml

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<templates>
+    <t t-name="fusion_accounting_bank_rec.BankRecLineInfoPopOver">
+        <table class="table table-hover m-0">
+            <tbody>
+                <tr t-if="props.exchangeMove">
+                    <td t-on-click="openExchangeMove" class="cursor-pointer">
+                        <span class="btn btn-link p-0" t-esc="exchangeDiffMoveName"/>
+                    </td>
+                    <td class="align-middle text-end" t-esc="formattedExchangeMoveBalance"/>
+                </tr>
+                <tr t-if="props.isPartiallyReconciled">
+                    <td t-on-click="openReconciledMove" class="cursor-pointer">
+                        <span class="btn btn-link p-0" t-esc="reconciledMoveName"/>
+                    </td>
+                    <td class="align-middle">
+                        <span class="text-decoration-line-through me-2" t-esc="formattedReconciledMoveAmountCurrency"/>
+                        <span t-esc="formattedLineDataAmountCurrency"/>
+                    </td>
+                </tr>
+            </tbody>
+        </table>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/line_to_reconcile/line_to_reconcile.js

@@ -0,0 +1,204 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from
+ * `account_accountant/.../line_to_reconcile/line_to_reconcile.js`.
+ * Phase 1 structural parity.
+ */
+
+import { Component, useRef } from "@odoo/owl";
+import { _t } from "@web/core/l10n/translation";
+import { formatMonetary } from "@web/views/fields/formatters";
+import { useService } from "@web/core/utils/hooks";
+import { useBankReconciliation } from "@fusion_accounting_bank_rec/components/bank_reconciliation/bank_reconciliation_service";
+import { usePopover } from "@web/core/popover/popover_hook";
+import { BankRecFormDialog } from "@fusion_accounting_bank_rec/components/bank_reconciliation/bankrec_form_dialog/bankrec_form_dialog";
+import { BankRecLineInfoPopOver } from "@fusion_accounting_bank_rec/components/bank_reconciliation/line_info_pop_over/line_info_pop_over";
+import { x2ManyCommands } from "@web/core/orm_service";
+
+export class BankRecLineToReconcile extends Component {
+    static template = "fusion_accounting_bank_rec.BankRecLineToReconcile";
+
+    static props = {
+        line: Object,
+        statementLine: Object,
+    };
+
+    setup() {
+        this.action = useService("action");
+        this.orm = useService("orm");
+        this.dialogService = useService("dialog");
+        this.ui = useService("ui");
+        this.bankReconciliation = useBankReconciliation();
+
+        this.lineInfoRef = useRef("line-info-ref");
+        this.lineInfoPopOver = usePopover(BankRecLineInfoPopOver, {
+            position: "left",
+            closeOnClickAway: true,
+        });
+    }
+
+    onClickLine() {
+        if (this.ui.isSmall) {
+            this.toggleEditLine();
+        }
+    }
+
+    toggleEditLine() {
+        this.dialogService.add(BankRecFormDialog, {
+            title: _t("Edit Line"),
+            resModel: "account.move.line",
+            resId: this.lineData.id,
+            context: {
+                form_view_ref: "account_accountant.view_bank_rec_edit_line",
+                is_reviewed: this.lineData.move_id.checked,
+            },
+            onRecordSave: async (record) => {
+                await this.orm.call("account.bank.statement.line", "edit_reconcile_line", [
+                    this.statementLineData.id,
+                    this.lineData.id,
+                    await record.getChanges(),
+                ]);
+                this.props.statementLine.load();
+                this.bankReconciliation.reloadChatter();
+                return true;
+            },
+        });
+    }
+
+    async deleteLine() {
+        await this.orm.call("account.bank.statement.line", "delete_reconciled_line", [
+            this.statementLineData.id,
+            this.lineData.id,
+        ]);
+        if (this.lineData.reconciled_lines_ids.records.length) {
+            // Only update the line count per partner if we delete
+            // a line which is reconciled to another move line
+            this.bankReconciliation.computeReconcileLineCountPerPartnerId(
+                this.env.model.root.records
+            );
+        }
+        this.props.statementLine.load();
+        this.bankReconciliation.reloadChatter();
+    }
+
+    // -----------------------------------------------------------------------------
+    // ACTION
+    // -----------------------------------------------------------------------------
+    openMove() {
+        this.action.doAction({
+            type: "ir.actions.act_window",
+            res_model: "account.move",
+            res_id: this.moveData.id,
+            views: [[false, "form"]],
+            target: "current",
+        });
+    }
+
+    openPartner() {
+        this.action.doAction({
+            type: "ir.actions.act_window",
+            res_model: "res.partner",
+            res_id: this.lineData.partner_id.id,
+            views: [[false, "form"]],
+            target: "current",
+        });
+    }
+
+    openLineInfoPopOver() {
+        if (this.lineInfoPopOver.isOpen || !this.showLineInfo) {
+            this.lineInfoPopOver.close();
+        } else {
+            this.lineInfoPopOver.open(this.lineInfoRef.el, {
+                statementLineData: this.statementLineData,
+                lineData: this.lineData,
+                exchangeMove: this.exchangeMove,
+                isPartiallyReconciled: this.isPartiallyReconciled,
+            });
+        }
+    }
+
+    async deleteTax(taxIndex) {
+        const taxChanged = this.lineDataTaxIds[taxIndex];
+        await this.orm.call("account.bank.statement.line", "edit_reconcile_line", [
+            this.statementLineData.id,
+            this.lineData.id,
+            { tax_ids: [[x2ManyCommands.UNLINK, taxChanged.data.id]] },
+        ]);
+        this.props.statementLine.load();
+        this.bankReconciliation.reloadChatter();
+    }
+
+    // -----------------------------------------------------------------------------
+    // GETTER
+    // -----------------------------------------------------------------------------
+    get statementLineData() {
+        return this.props.statementLine.data;
+    }
+
+    get lineData() {
+        return this.props.line;
+    }
+
+    get reconciledLineId() {
+        return this.lineData.reconciled_lines_ids.records.length === 1
+            ? this.lineData.reconciled_lines_ids.records[0].data
+            : null;
+    }
+
+    get reconciledLineExcludingExchangeDiffId() {
+        return this.lineData.reconciled_lines_excluding_exchange_diff_ids.records.length === 1
+            ? this.lineData.reconciled_lines_excluding_exchange_diff_ids.records[0].data
+            : null;
+    }
+
+    get moveData() {
+        return (
+            this.reconciledLineId?.move_id ||
+            this.reconciledLineExcludingExchangeDiffId?.move_id ||
+            this.lineData.move_id
+        );
+    }
+
+    get isPartiallyReconciled() {
+        if (!this.reconciledLineId) {
+            return false;
+        }
+        return !this.reconciledLineId.full_reconcile_id?.id;
+    }
+
+    get hasDifferentCurrencies() {
+        return this.lineData.currency_id.id !== this.statementLineData.currency_id.id;
+    }
+
+    get formattedAmountCurrencyOfLine() {
+        return formatMonetary(this.lineData.amount_currency, {
+            currencyId: this.lineData.currency_id.id,
+        });
+    }
+
+    get formattedAmountCurrencyOfStatementLine() {
+        return formatMonetary(this.lineData.amount_currency, {
+            currencyId: this.statementLineData.currency_id.id,
+        });
+    }
+
+    get exchangeMove() {
+        return (
+            this.lineData.matched_debit_ids.records[0]?.data.exchange_move_id ||
+            this.lineData.matched_credit_ids.records[0]?.data.exchange_move_id
+        );
+    }
+
+    get showLineInfo() {
+        return this.isPartiallyReconciled || this.exchangeMove?.id;
+    }
+
+    get isTaxLine() {
+        return this.lineData.tax_line_id;
+    }
+
+    get lineDataTaxIds() {
+        return this.lineData.tax_ids.records;
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/line_to_reconcile/line_to_reconcile.xml

@@ -0,0 +1,49 @@
+<?xml version="1.0" encoding="utf-8"?>
+<templates>
+    <t t-name="fusion_accounting_bank_rec.BankRecLineToReconcile">
+        <div class="o_row" t-on-click.stop="onClickLine">
+            <div class="o_line_name d-flex align-items-center gap-1 text-truncate">
+                <a href="#" class="text-truncate fw-bold" t-esc="lineData.partner_id.display_name" t-on-click.stop="openPartner" role="button" t-att-title="lineData.partner_id.display_name" t-if="lineData.partner_id"/>
+                <span t-esc="lineData.account_id.display_name" class="text-truncate" t-att-class="lineData.partner_id ? 'ms-1' : undefined"/>
+                <div class="d-flex gap-2">
+                    <t t-foreach="lineDataTaxIds" t-as="tax_id" t-key="tax_id_index">
+                        <div class="o_tag d-inline-flex align-items-center badge rounded-pill o_tag_color_0 flex-shrink-0">
+                            <span class="o_tag_badge_text text-truncate" t-esc="tax_id.data.display_name"/>
+                            <i t-on-click.stop="() => this.deleteTax(tax_id_index)" class="ps-1 opacity-100-hover opacity-75 oi oi-close"/>
+                        </div>
+                    </t>
+                </div>
+            </div>
+            <span t-if="!!moveData.display_name and moveData.id !== statementLineData.move_id.id" class="d-none d-md-inline">
+                <a t-on-click.stop="openMove" href="#">
+                    <t t-esc="moveData.display_name"/>
+                </a>
+            </span>
+            <div class="o_line_amount d-flex align-items-center justify-content-between">
+                <span class="text-muted w-50 text-end" t-if="hasDifferentCurrencies">
+                    <span t-att-class="{'btn btn-link p-0' : showLineInfo}" t-ref="line-info-ref" t-on-click.stop="openLineInfoPopOver">
+                        <i t-if="showLineInfo" class="fa fa-info-circle me-2"/>
+                        <t t-out="formattedAmountCurrencyOfLine"/>
+                    </span>
+                </span>
+                <span class="text-end w-100" t-if="!hasDifferentCurrencies">
+                    <span t-att-class="{'btn btn-link p-0' : showLineInfo}" t-ref="line-info-ref" t-on-click.stop="openLineInfoPopOver">
+                        <i t-if="showLineInfo" class="fa fa-info-circle me-2"/>
+                        <t t-out="formattedAmountCurrencyOfStatementLine"/>
+                    </span>
+                </span>
+            </div>
+            <div class="o_line_to_reconcile_button d-none d-md-flex justify-content-end gap-2">
+                <button t-if="lineData.has_invalid_analytics" class="btn btn-link p-0 text-600" t-on-click.stop="toggleEditLine">
+                    <i class="fa fa-exclamation-triangle text-warning" data-tooltip="This line has invalid analytic distribution"/>
+                </button>
+                <button t-if="!lineData.has_invalid_analytics" class="btn btn-link p-0 text-600" t-on-click.stop="toggleEditLine">
+                    <i class="fa fa-pencil"/>
+                </button>
+                <button class="btn btn-link p-0 text-600" t-on-click.stop="deleteLine" t-if="!isTaxLine">
+                    <i class="fa fa-trash"/>
+                </button>
+            </div>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/list_view/list.js

@@ -0,0 +1,88 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from `account_accountant/.../list_view/list.js`.
+ * Phase 1 structural parity.
+ *
+ * NOTE: Enterprise extends `AttachmentPreviewListController` from
+ * `account_accountant/static/src/components/attachment_preview_list_view/...`.
+ * That helper isn't part of Phase 1 scope; we extend the base
+ * `ListController` directly and TODO-flag the methods that depend on
+ * the previewer state. Behaviour will be wired up in fusion-only
+ * Tasks 34-36 alongside the right-pane preview integration.
+ */
+
+import { ListController } from "@web/views/list/list_controller";
+import { ListRenderer } from "@web/views/list/list_renderer";
+import { registry } from "@web/core/registry";
+import { listView } from "@web/views/list/list_view";
+import { useChildSubEnv } from "@odoo/owl";
+import { makeActiveField } from "@web/model/relational_model/utils";
+
+export class BankRecListController extends ListController {
+    setup() {
+        super.setup(...arguments);
+
+        this.skipKanbanRestore = {};
+
+        useChildSubEnv({
+            skipKanbanRestoreNeeded: (stLineId) => this.skipKanbanRestore[stLineId],
+        });
+    }
+
+    /**
+     * Don't allow bank_rec_form to be restored with previous values since
+     * the statement line has changed.
+     */
+    async onRecordSaved(record) {
+        this.skipKanbanRestore[record.resId] = true;
+        return super.onRecordSaved(...arguments);
+    }
+
+    get previewerStorageKey() {
+        return "fusion.statement_line_pdf_previewer_hidden";
+    }
+
+    get modelParams() {
+        const params = super.modelParams;
+        params.config.activeFields.bank_statement_attachment_ids = makeActiveField();
+        params.config.activeFields.bank_statement_attachment_ids.related = {
+            fields: {
+                mimetype: { name: "mimetype", type: "char" },
+            },
+            activeFields: {
+                mimetype: makeActiveField(),
+            },
+        };
+        params.config.activeFields.attachment_ids = makeActiveField();
+        params.config.activeFields.attachment_ids.related = {
+            fields: {
+                mimetype: { name: "mimetype", type: "char" },
+            },
+            activeFields: {
+                mimetype: makeActiveField(),
+            },
+        };
+        return params;
+    }
+
+    /**
+     * TODO(fusion task 34-36): wire up attachment preview pane.
+     * Enterprise sets `this.attachmentPreviewState.selectedRecord` and
+     * calls `this.setThread(...)` on the AttachmentPreviewListController.
+     * Until that helper is mirrored, this is a no-op.
+     */
+    async setSelectedRecord(/* accountBankStatementLineData */) {
+        return;
+    }
+}
+
+export class BankRecListRenderer extends ListRenderer {}
+
+export const bankRecListView = {
+    ...listView,
+    Controller: BankRecListController,
+    Renderer: BankRecListRenderer,
+};
+
+registry.category("views").add("fusion_bank_rec_list", bankRecListView);

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/list_view/list_view_many2one_multi_edit.js

@@ -0,0 +1,30 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from
+ * `account_accountant/.../list_view/list_view_many2one_multi_edit.js`.
+ * Phase 1 structural parity.
+ */
+
+import { Component } from "@odoo/owl";
+import { registry } from "@web/core/registry";
+import { computeM2OProps, Many2One } from "@web/views/fields/many2one/many2one";
+import { buildM2OFieldDescription, Many2OneField } from "@web/views/fields/many2one/many2one_field";
+
+export class BankRecMany2OneMultiID extends Component {
+    static template = "fusion_accounting_bank_rec.BankRecMany2OneMultiID";
+    static components = { Many2One };
+    static props = { ...Many2OneField.props };
+
+    get m2oProps() {
+        const props = computeM2OProps(this.props);
+        if (this.props.record.selected && this.props.record.model.multiEdit) {
+            props.context.active_ids = this.env.model.root.selection.map((r) => r.resId);
+        }
+        return props;
+    }
+}
+
+registry.category("fields").add("fusion_bank_rec_list_many2one_multi_id", {
+    ...buildM2OFieldDescription(BankRecMany2OneMultiID),
+});

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/list_view/list_view_many2one_multi_edit.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates>
+    <t t-name="fusion_accounting_bank_rec.BankRecMany2OneMultiID">
+        <Many2One t-props="m2oProps"/>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/partner_history_panel/partner_history_panel.js

@@ -0,0 +1,34 @@
+/** @odoo-module **/
+
+import { Component, onWillStart, useState } from "@odoo/owl";
+import { useService } from "@web/core/utils/hooks";
+
+export class PartnerHistoryPanel extends Component {
+    static template = "fusion_accounting_bank_rec.PartnerHistoryPanel";
+    static props = {
+        partnerId: { type: Number },
+    };
+
+    setup() {
+        this.bankRec = useService("fusion_bank_reconciliation");
+        this.state = useState({ history: null, loading: true });
+
+        onWillStart(async () => {
+            try {
+                this.state.history = await this.bankRec.getPartnerHistory(
+                    this.props.partnerId,
+                    20,
+                );
+            } finally {
+                this.state.loading = false;
+            }
+        });
+    }
+
+    formatAmount(value) {
+        if (value === undefined || value === null) {
+            return "0.00";
+        }
+        return Number(value).toFixed(2);
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/partner_history_panel/partner_history_panel.xml

@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.PartnerHistoryPanel">
+        <div class="o_fusion_partner_history_panel" style="padding: 1rem; border-left: 1px solid #e5e7eb;">
+            <h5 t-if="state.history">
+                <t t-esc="state.history.partner.name"/> — History
+            </h5>
+            <div t-if="state.loading" class="text-muted">Loading…</div>
+            <div t-elif="state.history">
+                <div t-if="state.history.pattern" class="mb-3 p-2"
+                     style="background: #eff6ff; border-radius: 0.25rem; font-size: 0.85em;">
+                    <strong>Learned pattern:</strong>
+                    <div>Reconciles: <t t-esc="state.history.pattern.reconcile_count"/></div>
+                    <div t-if="state.history.pattern.pref_strategy">
+                        Preferred strategy: <t t-esc="state.history.pattern.pref_strategy"/>
+                    </div>
+                    <div t-if="state.history.pattern.typical_cadence_days">
+                        Typical cadence: ~<t t-esc="state.history.pattern.typical_cadence_days"/> days
+                    </div>
+                </div>
+                <h6>Recent reconciles</h6>
+                <div t-foreach="state.history.recent_reconciles" t-as="rec" t-key="rec.precedent_id"
+                     style="padding: 0.5rem 0; border-bottom: 1px solid #e5e7eb; font-size: 0.85em;">
+                    <div class="d-flex justify-content-between">
+                        <span><t t-esc="rec.date"/></span>
+                        <span><strong>$<t t-esc="formatAmount(rec.amount)"/></strong></span>
+                    </div>
+                    <div class="text-muted">
+                        <t t-if="rec.memo_tokens"><t t-esc="rec.memo_tokens"/></t>
+                        <span class="ms-2">(<t t-esc="rec.matched_count"/> line<t t-if="rec.matched_count !== 1">s</t>)</span>
+                    </div>
+                </div>
+                <div t-if="state.history.recent_reconciles.length === 0" class="text-muted">
+                    No history yet
+                </div>
+            </div>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/quick_create/quick_create.js

@@ -0,0 +1,41 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from `account_accountant/.../quick_create/quick_create.js`.
+ * Phase 1 structural parity.
+ */
+
+import {
+    KanbanRecordQuickCreate,
+    KanbanQuickCreateController,
+} from "@web/views/kanban/kanban_record_quick_create";
+
+export class BankRecQuickCreateController extends KanbanQuickCreateController {
+    static template = "fusion_accounting_bank_rec.BankRecQuickCreateController";
+}
+
+export class BankRecQuickCreate extends KanbanRecordQuickCreate {
+    static template = "fusion_accounting_bank_rec.BankRecQuickCreate";
+    static props = {
+        ...KanbanRecordQuickCreate.props,
+        resModel: { type: String },
+        context: { type: Object },
+        group: { type: Object, optional: true },
+    };
+    static components = { BankRecQuickCreateController };
+
+    /**
+     * Overridden — quick-create flow always works against a synthetic group
+     * built from the resModel + context props (rather than relying on a
+     * caller-provided group), matching Enterprise behaviour.
+     */
+    async getQuickCreateProps(props) {
+        await super.getQuickCreateProps({
+            ...props,
+            group: {
+                resModel: props.resModel,
+                context: props.context,
+            },
+        });
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/quick_create/quick_create.xml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates id="template" xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.BankRecQuickCreate">
+        <BankRecQuickCreateController t-if="state.isLoaded" t-props="quickCreateProps"/>
+    </t>
+
+    <t t-name="fusion_accounting_bank_rec.BankRecQuickCreateController">
+        <div class="o_fusion_bank_reconciliation_quick_create o_kanban_record" t-ref="root">
+            <t t-component="props.Renderer" record="model.root" Compiler="props.Compiler" archInfo="props.archInfo"/>
+            <div class="d-flex gap-1 button_group p-2">
+                <button class="btn btn-primary o_kanban_add" t-on-click="() => this.validate('add')" data-hotkey="s">
+                    Add &amp; New
+                </button>
+                <button class="btn btn-secondary o_kanban_edit" t-on-click="() => this.validate('add_close')" data-hotkey="shift+s">
+                    Add &amp; Close
+                </button>
+                <button class="btn btn-secondary o_kanban_cancel" t-on-click="() => this.cancel(true)" data-hotkey="d">
+                    Discard
+                </button>
+            </div>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/reconcile_model_picker/reconcile_model_picker.js

@@ -0,0 +1,39 @@
+/** @odoo-module **/
+
+import { Component, onWillStart, useState } from "@odoo/owl";
+import { useService } from "@web/core/utils/hooks";
+
+export class ReconcileModelPicker extends Component {
+    static template = "fusion_accounting_bank_rec.ReconcileModelPicker";
+    static props = {
+        statementLineId: { type: Number, optional: true },
+    };
+
+    setup() {
+        this.orm = useService("orm");
+        this.bankRec = useService("fusion_bank_reconciliation");
+        this.state = useState({ models: [], selected: null });
+
+        onWillStart(async () => {
+            const models = await this.orm.searchRead(
+                "account.reconcile.model",
+                [["rule_type", "=", "writeoff_button"]],
+                ["id", "name", "fusion_ai_confidence_threshold"],
+                { limit: 20 }
+            );
+            this.state.models = models;
+        });
+    }
+
+    onChange(ev) {
+        const value = parseInt(ev.target.value, 10);
+        if (Number.isFinite(value)) {
+            this.onApplyModel(value);
+        }
+    }
+
+    async onApplyModel(modelId) {
+        // Phase 1 placeholder: TODO route through dedicated endpoint when Task 38 lands
+        this.state.selected = modelId;
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/reconcile_model_picker/reconcile_model_picker.xml

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.ReconcileModelPicker">
+        <div class="o_fusion_reconcile_model_picker">
+            <select class="form-select" style="max-width: 240px;"
+                    t-on-change="onChange">
+                <option value="">— Apply reconcile model —</option>
+                <option t-foreach="state.models" t-as="m" t-key="m.id" t-att-value="m.id">
+                    <t t-esc="m.name"/>
+                </option>
+            </select>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/reconciled_line_name/reconciled_line_name.js

@@ -0,0 +1,40 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from
+ * `account_accountant/.../reconciled_line_name/reconciled_line_name.js`.
+ * Phase 1 structural parity.
+ */
+
+import { Component } from "@odoo/owl";
+import { useBankReconciliation } from "@fusion_accounting_bank_rec/components/bank_reconciliation/bank_reconciliation_service";
+import { useService } from "@web/core/utils/hooks";
+import { x2ManyCommands } from "@web/core/orm_service";
+
+export class BankRecReconciledLineName extends Component {
+    static template = "fusion_accounting_bank_rec.BankRecReconciledLineName";
+    static props = {
+        statementLine: { type: Object },
+        linesToReconcile: { type: Object },
+        moveLineId: { type: String },
+        valueToDisplay: { type: Object },
+    };
+
+    setup() {
+        this.orm = useService("orm");
+        this.bankReconciliation = useBankReconciliation();
+    }
+
+    async deleteTax(lineId, taxChanged) {
+        const lineData = this.props.linesToReconcile.filter((line) => {
+            return line.id === parseInt(lineId);
+        })[0];
+        await this.orm.call("account.bank.statement.line", "edit_reconcile_line", [
+            this.props.statementLine.data.id,
+            lineData.id,
+            { tax_ids: [[x2ManyCommands.UNLINK, taxChanged.data.id]] },
+        ]);
+        this.props.statementLine.load();
+        this.bankReconciliation.reloadChatter();
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/reconciled_line_name/reconciled_line_name.xml

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<templates>
+    <t t-name="fusion_accounting_bank_rec.BankRecReconciledLineName">
+        <div name="reconciled_line_name" class="text-start text-truncate text-muted">
+            <t t-if="props.valueToDisplay?.tax">
+                <t t-foreach="props.valueToDisplay.tax" t-as="tax_id" t-key="tax_id_index">
+                    <div class="o_tag d-inline-flex align-items-center badge rounded-pill o_tag_color_0 flex-shrink-0" t-att-class="!tax_id_last ? 'me-1': ''">
+                        <span class="o_tag_badge_text text-truncate" t-esc="tax_id.data.display_name"/>
+                        <i t-on-click.stop="() => this.deleteTax(props.moveLineId, tax_id)" class="ps-1 opacity-100-hover opacity-75 oi oi-close"/>
+                    </div>
+                </t>
+            </t>
+            <t t-else="" t-out="props.valueToDisplay.move or props.valueToDisplay.account"/>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/search_dialog/search_dialog.js

@@ -0,0 +1,90 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from
+ * `account_accountant/.../search_dialog/search_dialog.js`.
+ * Phase 1 structural parity.
+ */
+
+import { SelectCreateDialog } from "@web/views/view_dialogs/select_create_dialog";
+import { formatMonetary } from "@web/views/fields/formatters";
+import { useService } from "@web/core/utils/hooks";
+
+const { DateTime } = luxon;
+
+export class BankRecSelectCreateDialog extends SelectCreateDialog {
+    static template = "fusion_accounting_bank_rec.BankRecSelectCreateDialog";
+    static props = {
+        ...SelectCreateDialog.props,
+        suspenseAccountLine: Object,
+        reference: String,
+        date: DateTime,
+        size: { type: String, optional: true },
+    };
+
+    static defaultProps = {
+        ...SelectCreateDialog.defaultProps,
+        size: "lg",
+    };
+
+    setup() {
+        super.setup();
+        this.orm = useService("orm");
+        this.ui = useService("ui");
+        this.state.remainingAmount = this.suspenseAccountLine.amount_currency;
+        this.state.hideRemainingAmount = false;
+
+        this.baseViewProps.onSelectionChanged = (resIds, selectedLines) => {
+            this.state.resIds = resIds;
+            this.changeInSelectedMoveLine(selectedLines);
+        };
+    }
+
+    async changeInSelectedMoveLine(selectedLines) {
+        if (!selectedLines?.length) {
+            this.state.remainingAmount = this.suspenseAccountLine.amount_currency;
+            return;
+        }
+
+        let selectedLinesSum = 0;
+        this.state.hideRemainingAmount = false;
+        if (
+            this.suspenseAccountLine.currency_id.id !==
+            this.suspenseAccountLine.company_currency_id.id
+        ) {
+            const selectedLineCurrencies = selectedLines.map((line) => line.currency_id);
+
+            if (
+                selectedLineCurrencies.length !== 1 ||
+                (selectedLineCurrencies.length === 1 &&
+                    selectedLineCurrencies[0] !== this.suspenseAccountLine.currency_id.id)
+            ) {
+                this.state.hideRemainingAmount = true;
+                return;
+            } else {
+                selectedLinesSum = selectedLines.reduce((sum, line) => {
+                    return sum + line.amount_residual_currency;
+                }, 0);
+            }
+        } else {
+            selectedLinesSum = selectedLines.reduce((sum, line) => {
+                return sum + line.amount_residual;
+            }, 0);
+        }
+        this.state.remainingAmount = this.suspenseAccountLine.amount_currency + selectedLinesSum;
+    }
+
+    get suspenseAccountLine() {
+        return this.props?.suspenseAccountLine;
+    }
+
+    get remainingAmountFormatted() {
+        return formatMonetary(this.state.remainingAmount, {
+            currencyId: this.suspenseAccountLine.currency_id.id,
+        });
+    }
+
+    get formattedStatementLineDate() {
+        return this.props.date?.toLocaleString();
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/search_dialog/search_dialog.xml

@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.BankRecSelectCreateDialog" t-inherit="web.SelectCreateDialog" t-inherit-mode="primary">
+        <xpath expr="//Dialog" position="attributes">
+            <attribute name="size">props.size</attribute>
+        </xpath>
+
+        <xpath expr="//button[hasclass('o_form_button_cancel')]" position="after">
+            <div t-if="!this.ui.isSmall" class="d-flex align-items-center flex-grow-1 flex-shrink-1 flex-basis-0 gap-2 min-w-0 justify-content-between" name="bank_reconciliation_info">
+                <span t-esc="formattedStatementLineDate"/>
+                <div class="text-truncate" t-esc="props.reference"/>
+                <div class="text-nowrap text-end" name="remaining_amount">
+                    <span class="text-muted">Balance: </span>
+                    <t t-if="!this.state.hideRemainingAmount" t-esc="remainingAmountFormatted"/>
+                    <t t-else=""> / </t>
+                </div>
+            </div>
+        </xpath>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/search_dialog/search_dialog_list.js

@@ -0,0 +1,77 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from
+ * `account_accountant/.../search_dialog/search_dialog_list.js`.
+ * Phase 1 structural parity.
+ */
+
+import { ListController } from "@web/views/list/list_controller";
+import { ListRenderer } from "@web/views/list/list_renderer";
+import { listView } from "@web/views/list/list_view";
+import { registry } from "@web/core/registry";
+import { useService } from "@web/core/utils/hooks";
+
+export class BankRecReconcileDialogListController extends ListController {
+    setup() {
+        super.setup();
+        this.orm = useService("orm");
+    }
+
+    async onSelectionChanged() {
+        const resIds = await this.model.root.getResIds(true);
+        if (!resIds.length) {
+            this.props.onSelectionChanged(resIds, []);
+        }
+
+        let selectedLines;
+        // When being in the list view with more elements than the limit and
+        // doing a select all, the user can select more elements than the
+        // limit. In this case the isDomainSelected is True.
+        if (this.isDomainSelected) {
+            const { resModel, context } = this.model.root._config;
+            selectedLines = await this.orm.read(
+                resModel,
+                resIds,
+                ["amount_residual", "amount_residual_currency", "currency_id"],
+                { context }
+            );
+        } else {
+            selectedLines = Object.values(this.model.root.records)
+                .filter((record) => resIds.includes(record._config.resId))
+                .map((record) => {
+                    const data = record.data;
+                    return {
+                        amount_residual: data.amount_residual,
+                        amount_residual_currency: data.amount_residual_currency,
+                        currency_id: data.currency_id.id,
+                    };
+                });
+        }
+        this.props.onSelectionChanged(resIds, selectedLines);
+    }
+}
+
+export class BankRecReconcileDialogListRenderer extends ListRenderer {
+    static template = "fusion_accounting_bank_rec.BankRecReconcileDialogListRenderer";
+    static recordRowTemplate =
+        "fusion_accounting_bank_rec.BankRecReconcileDialogListRenderer.RecordRow";
+
+    async openMoveView(record) {
+        this.env.services.action.doAction({
+            type: "ir.actions.act_window",
+            res_model: "account.move",
+            res_id: record.data.move_id.id,
+            views: [[false, "form"]],
+            target: "current",
+        });
+    }
+}
+
+export const bankRecReconcileDialogListRenderer = {
+    ...listView,
+    Renderer: BankRecReconcileDialogListRenderer,
+    Controller: BankRecReconcileDialogListController,
+};
+
+registry.category("views").add("fusion_bank_rec_dialog_list", bankRecReconcileDialogListRenderer);

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/search_dialog/search_dialog_list.xml

@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+    <t t-name="fusion_accounting_bank_rec.BankRecReconcileDialogListRenderer" t-inherit="web.ListRenderer" t-inherit-mode="primary">
+        <xpath expr="//th[@t-if='hasOpenFormViewColumn']" position="replace">
+            <th class="o_list_open_form_view w-print-0 p-print-0"/>
+        </xpath>
+    </t>
+
+    <t t-name="fusion_accounting_bank_rec.BankRecReconcileDialogListRenderer.RecordRow" t-inherit="web.ListRenderer.RecordRow" t-inherit-mode="primary">
+        <xpath expr="//t[@t-if='hasOpenFormViewColumn']" position="replace">
+            <td class="o_list_record_open_form_view w-print-0 p-print-0 text-center"
+                t-custom-click.stop="() => this.openMoveView(record)"
+            >
+                <button class="btn btn-link align-top text-end"
+                        name="Open in form view"
+                        aria-label="Open in form view"
+                >View</button>
+            </td>
+        </xpath>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/statement_line/statement_line.js

@@ -0,0 +1,305 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from
+ * `account_accountant/static/src/components/bank_reconciliation/statement_line/statement_line.js`
+ *
+ * Phase 1 structural parity. Module IDs / template names / CSS classes
+ * rebranded to `fusion_accounting_bank_rec`. Behaviour delegates to the
+ * Enterprise-compat surface in our `fusion_bank_reconciliation` service.
+ */
+
+import { BankRecButtonList } from "@fusion_accounting_bank_rec/components/bank_reconciliation/button_list/button_list";
+import { BankRecLineToReconcile } from "@fusion_accounting_bank_rec/components/bank_reconciliation/line_to_reconcile/line_to_reconcile";
+import { BankRecReconciledLineName } from "@fusion_accounting_bank_rec/components/bank_reconciliation/reconciled_line_name/reconciled_line_name";
+import { DropdownItem } from "@web/core/dropdown/dropdown_item";
+import { formatMonetary } from "@web/views/fields/formatters";
+import { KanbanRecord } from "@web/views/kanban/kanban_record";
+import { user } from "@web/core/user";
+import { useService } from "@web/core/utils/hooks";
+import { onWillStart, useState, useRef } from "@odoo/owl";
+import { useBankReconciliation } from "@fusion_accounting_bank_rec/components/bank_reconciliation/bank_reconciliation_service";
+
+export class BankRecStatementLine extends KanbanRecord {
+    static template = "fusion_accounting_bank_rec.BankRecStatementLine";
+    static components = {
+        BankRecLineToReconcile,
+        BankRecButtonList,
+        DropdownItem,
+        BankRecReconciledLineName,
+    };
+    static props = [...KanbanRecord.props];
+
+    setup() {
+        super.setup();
+        this.orm = useService("orm");
+        this.ui = useService("ui");
+        this.bankReconciliation = useBankReconciliation();
+        this.state = useState({
+            isUnfolded: false,
+        });
+        this.statementLineRootRef = useRef("root");
+        if (this.env.model.config.context?.default_st_line_id === this.props.record.resId) {
+            this.state.isUnfolded = true;
+            this.bankReconciliation.selectStatementLine(this.props.record);
+        }
+        onWillStart(async () => {
+            this.userCanReview = await user.hasGroup("account.group_account_user");
+        });
+    }
+
+    getRecordClasses() {
+        let classes = super.getRecordClasses();
+        if (this.hasStatementLine === 1) {
+            classes += " mt-3";
+        }
+        return classes;
+    }
+
+    // -----------------------------------------------------------------------------
+    // ACTION
+    // -----------------------------------------------------------------------------
+
+    openStatementCreate() {
+        this.action.doAction("account_accountant.action_bank_statement_form_bank_rec_widget", {
+            additionalContext: {
+                split_line_id: this.recordData.id,
+                default_journal_id: this.recordData.journal_id.id,
+            },
+            onClose: async () => {
+                this.env.model.load();
+            },
+        });
+    }
+
+    openPartner() {
+        this.action.doAction({
+            type: "ir.actions.act_window",
+            res_model: "res.partner",
+            res_id: this.partner.id,
+            views: [[false, "form"]],
+            target: "current",
+        });
+    }
+
+    async removePartner() {
+        await this.orm.write("account.bank.statement.line", [this.recordData.id], {
+            partner_id: false,
+        });
+        this.record.load();
+    }
+
+    // -----------------------------------------------------------------------------
+    // HELPER
+    // -----------------------------------------------------------------------------
+    get reconciledLineName() {
+        const reconciledLine = {};
+        for (const line of this.linesToReconcile) {
+            if (
+                line.reconciled_lines_excluding_exchange_diff_ids.records.length === 1 &&
+                line.reconciled_lines_excluding_exchange_diff_ids.records[0].data.move_name
+            ) {
+                reconciledLine[line.id] = {
+                    move: line.reconciled_lines_excluding_exchange_diff_ids.records[0].data
+                        .move_name,
+                };
+            } else if (line.tax_ids.count) {
+                reconciledLine[line.id] = { tax: line.tax_ids.records };
+            } else {
+                reconciledLine[line.id] = { account: line.account_id.display_name };
+            }
+        }
+        return reconciledLine;
+    }
+
+    get record() {
+        return this.props.record;
+    }
+
+    get recordData() {
+        return this.props.record.data;
+    }
+
+    fold() {
+        if (this.state.isUnfolded) {
+            this.toggleUnfold();
+        }
+        this.selectStatementLine();
+    }
+
+    unfold() {
+        if (!this.state.isUnfolded) {
+            this.toggleUnfold();
+        }
+        this.selectStatementLine();
+    }
+
+    toggleUnfold() {
+        this.state.isUnfolded = !this.isUnfolded;
+        this.selectStatementLine();
+    }
+
+    selectStatementLine() {
+        // Update the chatter with the last selected element
+        this.bankReconciliation.selectStatementLine(this.record);
+    }
+
+    openChatter() {
+        this.selectStatementLine();
+        this.bankReconciliation.openChatter();
+    }
+
+    get hasInvalidAnalytics() {
+        return this.linesToReconcile.some((line) => line.has_invalid_analytics);
+    }
+
+    get isUnfolded() {
+        return this.state.isUnfolded;
+    }
+
+    get hasStatementLine() {
+        return this.env.model.root.count;
+    }
+
+    get formattedAmount() {
+        return formatMonetary(this.recordData.amount, {
+            currencyId: this.recordData.currency_id.id,
+        });
+    }
+
+    get formattedDate() {
+        return this.recordData.date.toLocaleString({
+            month: "short",
+            day: "2-digit",
+        });
+    }
+
+    get formattedFullDate() {
+        return this.recordData.date.toLocaleString({
+            month: "long",
+            day: "numeric",
+            year: "numeric",
+        });
+    }
+
+    get partner() {
+        return this.recordData.partner_id;
+    }
+
+    get linesToReconcile() {
+        return this.accountMoveLines.filter((line) => {
+            return (
+                line.account_id.id !== this.recordData.journal_id?.suspense_account_id.id &&
+                line.account_id.id !== this.recordData.journal_id?.default_account_id.id
+            );
+        });
+    }
+
+    get suspenseAccountLine() {
+        return this.accountMoveLines.filter((line) => {
+            return line.account_id.id === this.recordData.journal_id.suspense_account_id.id;
+        })?.[0];
+    }
+
+    get accountMoveLines() {
+        return [...this.recordData.line_ids.records.map((line) => line.data)];
+    }
+
+    get hasForeignCurrencyAndSameCurrencyForAllLines() {
+        return (
+            this.recordData.foreign_currency_id &&
+            this.linesToReconcile &&
+            this.linesToReconcile.filter((line) => {
+                return line.currency_id.id !== this.recordData.foreign_currency_id.id;
+            }).length === 0
+        );
+    }
+
+    get suspenseAccountLineFormattedAmount() {
+        return formatMonetary(this.suspenseAccountLine.amount_currency, {
+            currencyId: this.suspenseAccountLine?.currency_id.id,
+        });
+    }
+
+    get activityNumber() {
+        return this.recordData.activity_ids.count;
+    }
+
+    /**
+     * Checks if there is at least one attachment associated with the bank
+     * statement line or its related records. Aggregates attachment counts from
+     * the move, the related move lines, and the lines reconciled with them.
+     *
+     * @returns {number} Total attachments. > 0 indicates presence.
+     */
+    get hasAttachment() {
+        const statementAttachment = this.recordData.bank_statement_attachment_ids.records.map(
+            (attachment) => attachment.data.id
+        );
+
+        return (
+            this.recordData.attachment_ids.records.length +
+            this.linesToReconcile
+                .flatMap((line) => line.reconciled_lines_ids.records)
+                .filter((line) => line.data.move_attachment_ids?.count)
+                .reduce(
+                    (accumulator, line) =>
+                        parseInt(accumulator) + parseInt(line.data.move_attachment_ids.count),
+                    0
+                ) +
+            this.linesToReconcile
+                .filter(
+                    (line) =>
+                        line.move_attachment_ids?.count &&
+                        !line.move_attachment_ids.records
+                            .map((attachment) => attachment.data.id)
+                            .every((id) => statementAttachment.includes(id))
+                )
+                .reduce(
+                    (accumulator, line) =>
+                        parseInt(accumulator) + parseInt(line.move_attachment_ids.count),
+                    0
+                )
+        );
+    }
+
+    get amountClasses() {
+        const classes = this.recordData.foreign_currency_id ? "w-50" : "w-100";
+        if (this.recordData.amount > 0) {
+            return `${classes} fw-bold`;
+        }
+        if (this.recordData.amount < 0) {
+            return `${classes} text-danger fw-bold`;
+        }
+        return `${classes} text-secondary`;
+    }
+
+    get buttonListProps() {
+        return {
+            statementLineRootRef: this.statementLineRootRef,
+            statementLine: this.record,
+            reconcileLineCount:
+                this.bankReconciliation.reconcileCountPerPartnerId[this.recordData.partner_id.id] ??
+                null,
+            reconcileModels:
+                this.bankReconciliation.reconcileModelPerStatementLineId[this.recordData.id] ?? [],
+            preSelectedReconciliationModel: this.accountMoveLines
+                .filter((line) => line.reconcile_model_id.id)
+                .map((line) => line.reconcile_model_id)?.[0],
+        };
+    }
+
+    get formattedAmountCurrencyInForeign() {
+        return formatMonetary(this.recordData.amount_currency, {
+            currencyId: this.recordData.foreign_currency_id.id,
+        });
+    }
+
+    get isSelected() {
+        return this.recordData.move_id.id === this.bankReconciliation.statementLineMoveId;
+    }
+
+    get isChatterOpen() {
+        return this.bankReconciliation.chatterState.visible;
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/statement_line/statement_line.xml

@@ -0,0 +1,115 @@
+<?xml version="1.0" encoding="utf-8"?>
+<templates>
+    <t t-name="fusion_accounting_bank_rec.BankRecStatementLine" t-inherit="web.KanbanRecord" t-inherit-mode="primary">
+        <xpath expr="//article" position="replace">
+            <article
+                    t-att-class="getRecordClasses()"
+                    t-att-data-id="record.id"
+                    t-att-tabindex="record.model.useSampleModel ? -1 : 0"
+                    t-custom-click="onGlobalClick"
+                    t-on-touchstart="onTouchStart"
+                    t-on-touchmove="onTouchMoveOrCancel"
+                    t-on-touchcancel="onTouchMoveOrCancel"
+                    t-on-touchend="onTouchEnd"
+                    t-ref="root">
+                <div name="bank_statement_line" class="o_statement_line w-100 p-2" t-on-click="selectStatementLine" t-att-class="{'o_selected_statement_line': isSelected}">
+                    <button t-if="!recordData.statement_id" type="button" class="o_statement_btn d-none d-md-block position-absolute top-0 end-0 btn btn-sm btn-secondary" t-on-click.stop="openStatementCreate">
+                        Statement
+                    </button>
+                    <div class="o_grid_container">
+                        <div class="o_row">
+                            <div class="d-flex gap-3">
+                                <div t-att-data-tooltip="formattedFullDate">
+                                    <t t-esc="formattedDate"/>
+                                </div>
+                                <div t-on-click.stop="openChatter" t-if="!ui.isSmall" class="o_chatter_icon btn-link text-action" t-att-class="{'visible': activityNumber or hasAttachment}">
+                                    <div t-if="activityNumber" class="activity-container position-relative">
+                                        <i class="fa fa-lg fa-clock-o" role="img" aria-label="Activities"/>
+                                        <span class="activity-badge badge rounded-pill" t-esc="activityNumber"/>
+                                    </div>
+                                    <i t-elif="hasAttachment"
+                                       class="fa fa-lg fa-paperclip"
+                                       role="img"
+                                       aria-label="Attachment"
+                                    />
+                                    <i t-elif="!isChatterOpen"
+                                       class="fa fa-lg fa-comments-o"
+                                       role="img"
+                                       aria-label="Journal Entry"
+                                    />
+                                </div>
+                            </div>
+                            <div class="o_payment_ref user-select-text d-none d-md-block"
+                                 t-att-class="isUnfolded ? 'overflow-wrap' : 'text-truncate'">
+                                <span class="d-inline">
+                                    <t t-if="partner">
+                                        <a class="fw-bold" href="#" t-on-click.prevent.stop="openPartner">
+                                            <span t-esc="partner.display_name" name="statement_line_partner_name"/>
+                                        </a>
+                                        <button class="btn btn-link oi oi-close p-0 align-baseline" t-on-click.stop="removePartner" t-if="!linesToReconcile.length"/>
+                                    </t>
+                                    <t t-elif="recordData.partner_name">
+                                        <span class="fw-bold" t-esc="recordData.partner_name" name="statement_line_partner_name"/>
+                                    </t>
+                                    <span t-att-class="partner or recordData.partner_name ? 'ms-1' : undefined"
+                                          t-esc="recordData.payment_ref"
+                                    />
+                                </span>
+                            </div>
+                            <!-- Only available on large screen -->
+                            <div class="o_button_line d-none d-md-flex align-items-start text-truncate">
+                                <BankRecButtonList t-props="buttonListProps" suspenseAccountLine="suspenseAccountLine" t-if="!recordData.is_reconciled or (userCanReview and !recordData.checked)"/>
+                                <span class="badge rounded-pill py-1 ps-1" t-att-class="{ 'pe-1': !isUnfolded, 'text-success bg-success-subtle': !hasInvalidAnalytics, 'text-warning bg-warning-subtle': hasInvalidAnalytics}" t-if="recordData.is_reconciled">
+                                    <i t-if="hasInvalidAnalytics" class="fa fa-exclamation-triangle" data-tooltip="Some lines have invalid analytic distribution"/>
+                                    <i t-if="!hasInvalidAnalytics" class="fa fa-check"/>
+                                    <span t-if="isUnfolded" class="ms-1">
+                                        Reconciled
+                                    </span>
+                                </span>
+                                <t t-if="recordData.is_reconciled and !isUnfolded">
+                                    <t t-foreach="Object.entries(reconciledLineName)" t-as="line" t-key="line_index">
+                                        <BankRecReconciledLineName statementLine="record" linesToReconcile="linesToReconcile" moveLineId="line[0]" valueToDisplay="line[1]"/>
+                                        <t t-if="line_index &lt; Object.keys(reconciledLineName).length - 1">, </t>
+                                    </t>
+                                </t>
+                            </div>
+                            <div class="d-flex align-items-start justify-content-between o_line_amount">
+                                <span class="text-muted w-50 text-end text-nowrap" t-if="recordData.foreign_currency_id">
+                                    <t t-esc="formattedAmountCurrencyInForeign"/>
+                                </span>
+                                <span t-att-class="amountClasses" class="text-end text-nowrap" t-esc="formattedAmount"/>
+                            </div>
+                            <div class="d-none d-md-block text-end" t-on-click="toggleUnfold" t-if="recordData.is_reconciled">
+                                <i class="oi" t-att-class="{'oi-chevron-up': isUnfolded, 'oi-chevron-down': !isUnfolded}"/>
+                            </div>
+                            <div class="d-none d-md-block" t-else=""/> <!-- To keep empty space if no chevron -->
+                        </div>
+
+                        <!-- Only available on small screen -->
+                        <div class="o_row d-md-none">
+                            <span class="text-truncate o_payment_ref"
+                                  t-esc="recordData.payment_ref"
+                            />
+                        </div>
+                        <t t-if="isUnfolded or !recordData.is_reconciled">
+                            <t t-foreach="linesToReconcile" t-as="line" t-key="line_index">
+                                <BankRecLineToReconcile statementLine="record" line="line"/>
+                            </t>
+                            <div class="o_row" t-if="linesToReconcile.length">
+                                <div t-if="suspenseAccountLine" class="d-none d-md-flex fw-bold text-muted align-items-center justify-content-end o_line_amount" t-att-class="hasForeignCurrencyAndSameCurrencyForAllLines ? 'w-50' : 'w-100'">
+                                    <t t-esc="suspenseAccountLineFormattedAmount"/>
+                                </div>
+                            </div>
+                        </t>
+                        <div class="o_row d-md-none">
+                            <div class="o_button_line">
+                                <BankRecButtonList t-props="buttonListProps" suspenseAccountLine="suspenseAccountLine" t-if="!recordData.is_reconciled or (userCanReview and !recordData.checked)"/>
+                                <span t-if="recordData.is_reconciled and !isUnfolded" class="text-start text-muted" t-esc="reconciledLineName"/>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </article>
+        </xpath>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/statement_summary/statement_summary.js

@@ -0,0 +1,42 @@
+/** @odoo-module **/
+
+/**
+ * Mirrored from
+ * `account_accountant/.../statement_summary/statement_summary.js`.
+ * Phase 1 structural parity.
+ */
+
+import { Component } from "@odoo/owl";
+
+export class BankRecStatementSummary extends Component {
+    static template = "fusion_accounting_bank_rec.BankRecStatementSummary";
+
+    static props = {
+        label: { type: String },
+        amount: { type: String, optional: true },
+        action: { type: Function },
+        journalId: { type: Number, optional: true },
+        isValid: { type: Boolean, optional: true },
+        journalIsInvalid: { type: Boolean, optional: true },
+    };
+    static defaultProps = {
+        isValid: true,
+    };
+
+    actionApplyInvalidStatement() {
+        const facets = this.env.searchModel.facets;
+        const searchItems = this.env.searchModel.searchItems;
+        const invalidStatementFilter = Object.values(searchItems).find(
+            (i) => i.name == "invalid_statement"
+        );
+        const invalidStatementFacet = facets.filter(
+            (i) => i.groupId == invalidStatementFilter.groupId
+        );
+        if (
+            invalidStatementFacet.length == 0 ||
+            !invalidStatementFacet[0].values.includes(invalidStatementFilter.description)
+        ) {
+            this.env.searchModel.toggleSearchItem(invalidStatementFilter.id);
+        }
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/components/bank_reconciliation/statement_summary/statement_summary.xml

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<templates>
+    <t t-name="fusion_accounting_bank_rec.BankRecStatementSummary">
+        <div class="o_statement_summary d-flex justify-content-between align-items-center w-100 p-2">
+            <div name="label_statement_summary" class="d-flex gap-2 align-items-center">
+                <h4 t-esc="props.label"
+                    t-on-click="props.action"
+                    class="m-0"
+                    t-att-class="{'text-danger': !props.isValid}"/>
+            </div>
+            <div>
+                <h4 class="m-0"
+                    t-if="props.journalIsInvalid"
+                    t-on-click="actionApplyInvalidStatement">
+                    Invalid Statement(s)
+                </h4>
+            </div>
+            <div t-if="props.amount"
+                 class="btn btn-link p-0 fw-bold fs-4"
+                 t-on-click="props.action"
+                 t-esc="props.amount"/>
+        </div>
+    </t>
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/scss/_variables.scss

@@ -0,0 +1,43 @@
+// Fusion bank reconciliation design tokens.
+// COLOR uses BS5 CSS custom properties (--bs-*) declared inline in
+// bank_reconciliation.scss / ai_suggestion.scss so dark mode flips
+// automatically. SCSS vars below are for spacing/typography only.
+
+// Spacing scale (4px increments)
+$fusion-space-1:                   0.25rem;
+$fusion-space-2:                   0.5rem;
+$fusion-space-3:                   0.75rem;
+$fusion-space-4:                   1rem;
+$fusion-space-5:                   1.25rem;
+$fusion-space-6:                   1.5rem;
+$fusion-space-8:                   2rem;
+
+// Typography
+$fusion-font-family:               -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+$fusion-font-size-xs:              0.75rem;
+$fusion-font-size-sm:              0.875rem;
+$fusion-font-size-base:            1rem;
+$fusion-font-size-lg:              1.125rem;
+$fusion-font-size-xl:              1.25rem;
+
+$fusion-font-weight-normal:        400;
+$fusion-font-weight-medium:        500;
+$fusion-font-weight-semibold:      600;
+$fusion-font-weight-bold:          700;
+
+// Borders + radii
+$fusion-border-radius-sm:          0.25rem;
+$fusion-border-radius:             0.375rem;
+$fusion-border-radius-md:          0.5rem;
+$fusion-border-radius-lg:          0.75rem;
+
+// Shadows (alpha-based; works in light + dark)
+$fusion-shadow-sm:                 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+$fusion-shadow:                    0 1px 3px 0 rgba(0, 0, 0, 0.1);
+$fusion-shadow-md:                 0 4px 6px -1px rgba(0, 0, 0, 0.1);
+$fusion-shadow-lg:                 0 10px 15px -3px rgba(0, 0, 0, 0.1);
+
+// Animation
+$fusion-transition-fast:           150ms ease-in-out;
+$fusion-transition-base:           200ms ease-in-out;
+$fusion-transition-slow:           300ms ease-in-out;

fusion_accounting/fusion_accounting_bank_rec/static/src/scss/ai_suggestion.scss

@@ -0,0 +1,84 @@
+// AI Suggestion strip + alternatives panel.
+// Confidence colors are brand-meaningful (red/amber/green) and stay
+// consistent across themes; surfaces use BS5 vars for theme-tracking.
+
+.o_fusion_ai_suggestion {
+    margin-top: $fusion-space-3;
+    padding: $fusion-space-3;
+    border-radius: $fusion-border-radius;
+    border: 1px solid;
+    display: flex;
+    align-items: center;
+    gap: $fusion-space-3;
+    font-size: $fusion-font-size-sm;
+    color: var(--bs-body-color);
+    transition: all $fusion-transition-base;
+
+    &[data-band="high"] {
+        background: var(--fusion-confidence-high-bg);
+        border-color: var(--fusion-confidence-high);
+        .o_fusion_confidence_value { color: var(--fusion-confidence-high); }
+    }
+    &[data-band="medium"] {
+        background: var(--fusion-confidence-medium-bg);
+        border-color: var(--fusion-confidence-medium);
+        .o_fusion_confidence_value { color: var(--fusion-confidence-medium); }
+    }
+    &[data-band="low"] {
+        background: var(--fusion-confidence-low-bg);
+        border-color: var(--fusion-confidence-low);
+        .o_fusion_confidence_value { color: var(--fusion-confidence-low); }
+    }
+    &[data-band="none"] {
+        background: var(--fusion-confidence-none-bg);
+        border-color: var(--fusion-confidence-none);
+        opacity: 0.7;
+    }
+
+    .o_fusion_confidence_badge {
+        font-weight: $fusion-font-weight-bold;
+        font-size: $fusion-font-size-base;
+        white-space: nowrap;
+    }
+
+    .o_fusion_suggestion_text {
+        flex: 1;
+        color: var(--bs-body-color);
+
+        .o_fusion_reasoning {
+            color: var(--bs-secondary-color);
+            font-style: italic;
+            margin-top: $fusion-space-1;
+        }
+    }
+
+    .o_fusion_suggestion_actions {
+        display: flex;
+        gap: $fusion-space-2;
+    }
+}
+
+.o_fusion_alternatives_panel {
+    margin-top: $fusion-space-2;
+    padding: $fusion-space-3;
+    background: var(--bs-secondary-bg);
+    color: var(--bs-body-color);
+    border: 1px solid var(--bs-border-color);
+    border-radius: $fusion-border-radius;
+    font-size: $fusion-font-size-sm;
+
+    .o_fusion_alternative {
+        padding: $fusion-space-2 0;
+        border-bottom: 1px solid var(--bs-border-color);
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        &:last-child { border-bottom: none; }
+
+        .alt_confidence {
+            font-weight: $fusion-font-weight-medium;
+            margin-right: $fusion-space-2;
+        }
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/scss/bank_reconciliation.scss

@@ -0,0 +1,163 @@
+// Variables (spacing/typography) come from _variables.scss via manifest order.
+// COLOR uses BS5 CSS custom properties so dark mode flips automatically.
+
+// Brand-meaningful colors (semantic, identical in light + dark themes).
+:root {
+    --fusion-bank-accent:           #3b82f6;
+    --fusion-bank-accent-hover:     #2563eb;
+    --fusion-bank-accent-bg:        rgba(59, 130, 246, 0.10);
+
+    --fusion-confidence-high:       #10b981;
+    --fusion-confidence-high-bg:    rgba(16, 185, 129, 0.12);
+    --fusion-confidence-medium:     #f59e0b;
+    --fusion-confidence-medium-bg:  rgba(245, 158, 11, 0.12);
+    --fusion-confidence-low:        #ef4444;
+    --fusion-confidence-low-bg:     rgba(239, 68, 68, 0.12);
+    --fusion-confidence-none:       #9ca3af;
+    --fusion-confidence-none-bg:    rgba(156, 163, 175, 0.12);
+}
+
+.o_fusion_bank_rec {
+    background: var(--bs-body-bg);
+    min-height: 100vh;
+    font-family: $fusion-font-family;
+    color: var(--bs-body-color);
+
+    &_header {
+        background: var(--bs-body-bg);
+        color: var(--bs-emphasis-color);
+        border-bottom: 1px solid var(--bs-border-color);
+        padding: $fusion-space-4 $fusion-space-6;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        h1 {
+            font-size: $fusion-font-size-xl;
+            font-weight: $fusion-font-weight-semibold;
+            margin: 0;
+            color: inherit;
+        }
+
+        .o_fusion_stats {
+            display: flex;
+            gap: $fusion-space-6;
+            font-size: $fusion-font-size-sm;
+            color: var(--bs-secondary-color);
+
+            .stat-value {
+                font-weight: $fusion-font-weight-semibold;
+                color: var(--bs-emphasis-color);
+                margin-left: $fusion-space-1;
+            }
+        }
+    }
+
+    &_line {
+        background: var(--bs-body-bg);
+        color: var(--bs-body-color);
+        border: 1px solid var(--bs-border-color);
+        border-radius: $fusion-border-radius-md;
+        padding: $fusion-space-4;
+        margin-bottom: $fusion-space-3;
+        cursor: pointer;
+        transition: all $fusion-transition-base;
+        position: relative;
+
+        &:hover {
+            border-color: var(--fusion-bank-accent);
+            box-shadow: $fusion-shadow-md;
+        }
+
+        &.o_fusion_selected {
+            border-color: var(--fusion-bank-accent);
+            background: var(--fusion-bank-accent-bg);
+        }
+
+        &_header {
+            display: flex;
+            justify-content: space-between;
+            align-items: flex-start;
+            margin-bottom: $fusion-space-2;
+
+            .o_fusion_amount {
+                font-size: $fusion-font-size-lg;
+                font-weight: $fusion-font-weight-semibold;
+                color: var(--bs-emphasis-color);
+
+                &.negative { color: var(--fusion-confidence-low); }
+            }
+
+            .o_fusion_date {
+                font-size: $fusion-font-size-sm;
+                color: var(--bs-secondary-color);
+            }
+        }
+
+        &_body {
+            font-size: $fusion-font-size-sm;
+            color: var(--bs-secondary-color);
+
+            .o_fusion_partner {
+                font-weight: $fusion-font-weight-medium;
+                color: var(--bs-emphasis-color);
+                margin-right: $fusion-space-2;
+            }
+
+            .o_fusion_memo {
+                font-style: italic;
+                color: var(--bs-tertiary-color);
+            }
+        }
+
+        .o_fusion_attachments_badge {
+            position: absolute;
+            top: $fusion-space-2;
+            right: $fusion-space-2;
+            background: var(--bs-tertiary-bg);
+            border-radius: $fusion-border-radius;
+            padding: $fusion-space-1 $fusion-space-2;
+            font-size: $fusion-font-size-xs;
+            color: var(--bs-secondary-color);
+        }
+    }
+
+    &_detail {
+        background: var(--bs-body-bg);
+        color: var(--bs-body-color);
+        border-left: 1px solid var(--bs-border-color);
+        padding: $fusion-space-6;
+
+        h2 {
+            font-size: $fusion-font-size-lg;
+            font-weight: $fusion-font-weight-semibold;
+            margin: 0 0 $fusion-space-4;
+            color: var(--bs-emphasis-color);
+        }
+    }
+
+    .btn_fusion {
+        padding: $fusion-space-2 $fusion-space-4;
+        border-radius: $fusion-border-radius;
+        font-size: $fusion-font-size-sm;
+        font-weight: $fusion-font-weight-medium;
+        border: 1px solid var(--bs-border-color);
+        background: var(--bs-body-bg);
+        color: var(--bs-body-color);
+        cursor: pointer;
+        transition: all $fusion-transition-fast;
+
+        &:hover { background: var(--bs-tertiary-bg); }
+
+        &.btn_fusion_primary {
+            background: var(--fusion-bank-accent);
+            border-color: var(--fusion-bank-accent);
+            color: #ffffff;
+
+            &:hover {
+                background: var(--fusion-bank-accent-hover);
+                border-color: var(--fusion-bank-accent-hover);
+            }
+        }
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/services/bank_reconciliation_service.js

@@ -0,0 +1,422 @@
+/** @odoo-module **/
+
+/**
+ * Bank reconciliation service.
+ *
+ * Central data layer + reactive state for the OWL bank-rec widget.
+ * Components inject this service via useService("fusion_bank_reconciliation")
+ * and read/write state through its methods.
+ *
+ * Wraps the 10 JSON-RPC endpoints from controllers/bank_rec_controller.py.
+ */
+
+import { registry } from "@web/core/registry";
+import { reactive, useState, EventBus } from "@odoo/owl";
+import { useService } from "@web/core/utils/hooks";
+import { browser } from "@web/core/browser/browser";
+import { rpc } from "@web/core/network/rpc";
+
+const ENDPOINT_BASE = "/fusion/bank_rec";
+
+export class BankReconciliationService {
+    constructor(env, services) {
+        this.env = env;
+        // V19: rpc is no longer a service — imported as a standalone function above.
+        this.rpc = rpc;
+        this.notification = services.notification;
+        this.orm = services.orm;
+
+        // ============================================================
+        // Enterprise-compat surface (mirrored OWL components rely on this)
+        // ============================================================
+        // Mirrored components from account_accountant expect these
+        // attributes/methods on the service. Most are implemented as
+        // stubs that no-op or return sensible defaults; structural
+        // parity now, behaviour wired up in fusion-only Tasks 34-36.
+        this.bus = new EventBus();
+        this.chatterState = reactive({
+            visible: this._readChatterPref(),
+            statementLine: null,
+        });
+        this.reconcileCountPerPartnerId = reactive({});
+        this.reconcileModelPerStatementLineId = reactive({});
+
+        // Reactive state — components depend on it via useState/reactive
+        this.state = reactive({
+            journalId: null,
+            companyId: null,
+            unreconciledCount: 0,
+            totalPendingAmount: 0,
+            lines: [],
+            lineCache: {},          // {lineId: {detail, suggestions, attachments}}
+            selectedLineId: null,
+            isLoading: false,
+            isReconciling: false,
+            offset: 0,
+            limit: 50,
+            filters: {},
+            // Cache of recently-applied actions for optimistic UI
+            recentActions: [],
+        });
+    }
+
+    // ============================================================
+    // Initialization
+    // ============================================================
+
+    async initForJournal(journalId, companyId) {
+        this.state.journalId = journalId;
+        this.state.companyId = companyId;
+        this.state.isLoading = true;
+        try {
+            const stateInfo = await this.rpc(`${ENDPOINT_BASE}/get_state`, {
+                journal_id: journalId, company_id: companyId,
+            });
+            this.state.unreconciledCount = stateInfo.unreconciled_count;
+            this.state.totalPendingAmount = stateInfo.total_pending_amount;
+            await this.loadLines({ reset: true });
+        } finally {
+            this.state.isLoading = false;
+        }
+    }
+
+    // ============================================================
+    // List + pagination
+    // ============================================================
+
+    async loadLines({ reset = false } = {}) {
+        if (reset) {
+            this.state.offset = 0;
+            this.state.lines = [];
+        }
+        this.state.isLoading = true;
+        try {
+            const result = await this.rpc(`${ENDPOINT_BASE}/list_unreconciled`, {
+                journal_id: this.state.journalId,
+                company_id: this.state.companyId,
+                limit: this.state.limit,
+                offset: this.state.offset,
+                ...this.state.filters,
+            });
+            if (reset) {
+                this.state.lines = result.lines;
+            } else {
+                this.state.lines = [...this.state.lines, ...result.lines];
+            }
+            this.state.unreconciledCount = result.total;
+        } finally {
+            this.state.isLoading = false;
+        }
+    }
+
+    async loadMore() {
+        this.state.offset += this.state.limit;
+        await this.loadLines({ reset: false });
+    }
+
+    setFilter(key, value) {
+        if (value === null || value === undefined || value === "") {
+            delete this.state.filters[key];
+        } else {
+            this.state.filters[key] = value;
+        }
+        this.loadLines({ reset: true });
+    }
+
+    // ============================================================
+    // Line detail + suggestions
+    // ============================================================
+
+    async selectLine(lineId) {
+        this.state.selectedLineId = lineId;
+        if (!this.state.lineCache[lineId]) {
+            await this.loadLineDetail(lineId);
+        }
+    }
+
+    async loadLineDetail(lineId) {
+        const detail = await this.rpc(`${ENDPOINT_BASE}/get_line_detail`, {
+            statement_line_id: lineId,
+        });
+        this.state.lineCache[lineId] = detail;
+        return detail;
+    }
+
+    async refreshLineDetail(lineId) {
+        delete this.state.lineCache[lineId];
+        return await this.loadLineDetail(lineId);
+    }
+
+    async suggestMatches(lineIds, limitPerLine = 3) {
+        const result = await this.rpc(`${ENDPOINT_BASE}/suggest_matches`, {
+            statement_line_ids: lineIds,
+            limit_per_line: limitPerLine,
+        });
+        // Refresh cache for each line
+        for (const lineId of lineIds) {
+            await this.refreshLineDetail(lineId);
+        }
+        return result.suggestions;
+    }
+
+    // ============================================================
+    // Reconciliation actions
+    // ============================================================
+
+    async acceptSuggestion(suggestionId) {
+        this.state.isReconciling = true;
+        try {
+            const result = await this.rpc(`${ENDPOINT_BASE}/accept_suggestion`, {
+                suggestion_id: suggestionId,
+            });
+            this._removeReconciledLineFromState(this.state.selectedLineId);
+            this.state.unreconciledCount = result.unreconciled_count_after;
+            this.notification.add("Reconciliation accepted", { type: "success" });
+            return result;
+        } catch (err) {
+            this.notification.add(`Accept failed: ${err.message || err}`, { type: "danger" });
+            throw err;
+        } finally {
+            this.state.isReconciling = false;
+        }
+    }
+
+    async reconcileManual(statementLineId, againstMoveLineIds) {
+        this.state.isReconciling = true;
+        try {
+            const result = await this.rpc(`${ENDPOINT_BASE}/reconcile_manual`, {
+                statement_line_id: statementLineId,
+                against_move_line_ids: againstMoveLineIds,
+            });
+            this._removeReconciledLineFromState(statementLineId);
+            this.notification.add("Reconciled", { type: "success" });
+            return result;
+        } catch (err) {
+            this.notification.add(`Reconcile failed: ${err.message || err}`, { type: "danger" });
+            throw err;
+        } finally {
+            this.state.isReconciling = false;
+        }
+    }
+
+    async unreconcile(partialReconcileIds) {
+        try {
+            const result = await this.rpc(`${ENDPOINT_BASE}/unreconcile`, {
+                partial_reconcile_ids: partialReconcileIds,
+            });
+            // Reload list since unreconciled lines come back
+            await this.loadLines({ reset: true });
+            this.notification.add("Unreconciled", { type: "info" });
+            return result;
+        } catch (err) {
+            this.notification.add(`Unreconcile failed: ${err.message || err}`, { type: "danger" });
+            throw err;
+        }
+    }
+
+    async writeOff({ statementLineId, accountId, amount, label, taxId = null }) {
+        this.state.isReconciling = true;
+        try {
+            const result = await this.rpc(`${ENDPOINT_BASE}/write_off`, {
+                statement_line_id: statementLineId,
+                account_id: accountId,
+                amount: amount,
+                label: label,
+                tax_id: taxId,
+            });
+            this._removeReconciledLineFromState(statementLineId);
+            this.notification.add("Write-off applied", { type: "success" });
+            return result;
+        } catch (err) {
+            this.notification.add(`Write-off failed: ${err.message || err}`, { type: "danger" });
+            throw err;
+        } finally {
+            this.state.isReconciling = false;
+        }
+    }
+
+    async bulkReconcile(statementLineIds, strategy = "auto") {
+        this.state.isReconciling = true;
+        try {
+            const result = await this.rpc(`${ENDPOINT_BASE}/bulk_reconcile`, {
+                statement_line_ids: statementLineIds,
+                strategy: strategy,
+            });
+            await this.loadLines({ reset: true });
+            const msg = `${result.reconciled_count} reconciled, ${result.skipped} skipped`;
+            this.notification.add(msg, { type: "success" });
+            return result;
+        } catch (err) {
+            this.notification.add(`Bulk failed: ${err.message || err}`, { type: "danger" });
+            throw err;
+        } finally {
+            this.state.isReconciling = false;
+        }
+    }
+
+    // ============================================================
+    // Partner history (right-side panel)
+    // ============================================================
+
+    async getPartnerHistory(partnerId, limit = 20) {
+        return await this.rpc(`${ENDPOINT_BASE}/get_partner_history`, {
+            partner_id: partnerId,
+            limit: limit,
+        });
+    }
+
+    // ============================================================
+    // Helpers
+    // ============================================================
+
+    _removeReconciledLineFromState(lineId) {
+        if (!lineId) return;
+        this.state.lines = this.state.lines.filter((l) => l.id !== lineId);
+        if (this.state.selectedLineId === lineId) {
+            this.state.selectedLineId = null;
+        }
+        delete this.state.lineCache[lineId];
+        if (this.state.unreconciledCount > 0) {
+            this.state.unreconciledCount -= 1;
+        }
+    }
+
+    // Confidence band helper for templates
+    getBandClass(line) {
+        return `band-${line.fusion_confidence_band || "none"}`;
+    }
+
+    // ============================================================
+    // Enterprise-compat methods (stubs — wired up later)
+    // ============================================================
+    // The following surface is required by mirrored components from
+    // account_accountant. They are primarily no-ops or thin wrappers
+    // around the legacy/V19 ORM. Phase 1 prioritizes structural parity;
+    // fusion-only Tasks 34-36 will replace these with native
+    // implementations driven by our JSON-RPC endpoints.
+
+    _readChatterPref() {
+        try {
+            return (
+                JSON.parse(
+                    browser.sessionStorage.getItem("isFusionBankRecChatterOpened")
+                ) ?? false
+            );
+        } catch {
+            return false;
+        }
+    }
+
+    toggleChatter() {
+        this.chatterState.visible = !this.chatterState.visible;
+        try {
+            browser.sessionStorage.setItem(
+                "isFusionBankRecChatterOpened",
+                this.chatterState.visible
+            );
+        } catch {
+            // Session storage unavailable — non-fatal.
+        }
+    }
+
+    openChatter() {
+        this.chatterState.visible = true;
+    }
+
+    selectStatementLine(statementLine) {
+        this.chatterState.statementLine = statementLine;
+    }
+
+    reloadChatter() {
+        this.bus.trigger("MAIL:RELOAD-THREAD", {
+            model: "account.move",
+            id: this.statementLineMoveId,
+        });
+    }
+
+    async computeReconcileLineCountPerPartnerId(records) {
+        // Stub: real impl to be added in fusion-only task.
+        // Components call this after partner edits to refresh the per-partner
+        // count badge. Returning empty here keeps the badge silent.
+        if (!this.orm) {
+            return;
+        }
+        try {
+            const partnerIds = (records || [])
+                .map((r) => r?.data?.partner_id?.id)
+                .filter(Boolean);
+            if (!partnerIds.length) {
+                this.reconcileCountPerPartnerId = {};
+                return;
+            }
+            // Best-effort: keep a zero map so templates don't blow up.
+            const out = {};
+            for (const pid of partnerIds) {
+                out[pid] = this.reconcileCountPerPartnerId[pid] ?? 0;
+            }
+            this.reconcileCountPerPartnerId = out;
+        } catch {
+            // Non-fatal; templates fall back to defaults.
+        }
+    }
+
+    async computeAvailableReconcileModels(records) {
+        // Stub: components show these as quick-action buttons. Empty for now.
+        const out = {};
+        for (const r of records || []) {
+            const id = r?.data?.id;
+            if (id) {
+                out[id] = [];
+            }
+        }
+        this.reconcileModelPerStatementLineId = out;
+    }
+
+    async updateAvailableReconcileModels(recordId) {
+        if (recordId) {
+            this.reconcileModelPerStatementLineId[recordId] = [];
+        }
+    }
+
+    async reloadRecords(records) {
+        await Promise.all(
+            (records || []).map((record) => record?.load ? record.load() : null)
+        );
+    }
+
+    get statementLineMove() {
+        return this.chatterState.statementLine?.data?.move_id;
+    }
+
+    get statementLineMoveId() {
+        return this.statementLineMove?.id;
+    }
+
+    get statementLine() {
+        return this.chatterState.statementLine;
+    }
+
+    get statementLineId() {
+        return this.statementLine?.data?.id;
+    }
+}
+
+export const bankReconciliationService = {
+    dependencies: ["notification", "orm"],
+    start(env, services) {
+        return new BankReconciliationService(env, services);
+    },
+};
+
+registry.category("services").add("fusion_bank_reconciliation", bankReconciliationService);
+
+/**
+ * Hook for OWL components mirrored from Enterprise.
+ *
+ * Enterprise's components import `useBankReconciliation` from
+ * `../bank_reconciliation_service`; we expose the same hook here so
+ * mirrored code works unmodified after the relative-import rewrite.
+ */
+export function useBankReconciliation() {
+    return useState(useService("fusion_bank_reconciliation"));
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/tours/bank_rec_tours.js

@@ -0,0 +1,109 @@
+/** @odoo-module **/
+
+import { registry } from "@web/core/registry";
+
+/**
+ * 5 OWL tours for fusion_accounting_bank_rec smoke testing.
+ *
+ * Each tour scripts a user interaction with the bank-rec widget and
+ * is invoked from Python via HttpCase.start_tour(). Useful for catching
+ * UI regressions that asset-bundle compilation alone won't catch.
+ */
+
+// Tour 1: Open the kanban widget and confirm it loads
+registry.category("web_tour.tours").add("fusion_bank_rec_smoke", {
+    test: true,
+    url: "/odoo/action-fusion_accounting_bank_rec.action_fusion_bank_rec_widget",
+    steps: () => [
+        {
+            content: "Wait for header to appear",
+            trigger: ".o_fusion_bank_rec_header h1:contains(Bank Reconciliation)",
+        },
+        {
+            content: "Confirm stats are visible",
+            trigger: ".o_fusion_stats",
+        },
+    ],
+});
+
+// Tour 2: Select a line and confirm detail panel loads
+registry.category("web_tour.tours").add("fusion_bank_rec_select_line", {
+    test: true,
+    url: "/odoo/action-fusion_accounting_bank_rec.action_fusion_bank_rec_widget",
+    steps: () => [
+        {
+            content: "Wait for at least one line card",
+            trigger: ".o_fusion_bank_rec_line:first",
+        },
+        {
+            content: "Click the first line",
+            trigger: ".o_fusion_bank_rec_line:first",
+            run: "click",
+        },
+        {
+            content: "Detail panel shows selected line",
+            trigger: ".o_fusion_bank_rec_detail h2",
+        },
+    ],
+});
+
+// Tour 3: Trigger AI suggestion and accept
+registry.category("web_tour.tours").add("fusion_bank_rec_accept_suggestion", {
+    test: true,
+    url: "/odoo/action-fusion_accounting_bank_rec.action_fusion_bank_rec_widget",
+    steps: () => [
+        {
+            content: "Click first line with a partner",
+            trigger: ".o_fusion_bank_rec_line:has(.o_fusion_partner):first",
+            run: "click",
+        },
+        {
+            content: "Click 'Get AI suggestions' button",
+            trigger: ".o_fusion_bank_rec_detail .btn_fusion_primary:contains(Get AI)",
+            run: "click",
+        },
+        {
+            content: "Wait for at least one suggestion to appear",
+            trigger: ".o_fusion_ai_suggestion",
+        },
+    ],
+});
+
+// Tour 4: Open auto-reconcile wizard
+registry.category("web_tour.tours").add("fusion_bank_rec_auto_reconcile_wizard", {
+    test: true,
+    url: "/odoo/action-fusion_accounting_bank_rec.action_fusion_auto_reconcile_wizard",
+    steps: () => [
+        {
+            content: "Wizard form opens",
+            trigger: ".modal-dialog .o_form_view",
+        },
+        {
+            content: "Strategy field exists",
+            trigger: ".modal-dialog [name='strategy']",
+        },
+        {
+            content: "Close wizard",
+            trigger: ".modal-dialog .btn-secondary",
+            run: "click",
+        },
+    ],
+});
+
+// Tour 5: Load more (pagination)
+registry.category("web_tour.tours").add("fusion_bank_rec_load_more", {
+    test: true,
+    url: "/odoo/action-fusion_accounting_bank_rec.action_fusion_bank_rec_widget",
+    steps: () => [
+        {
+            content: "Wait for kanban container",
+            trigger: ".o_fusion_bank_rec",
+        },
+        // Pagination button only appears if there are more lines than `limit`.
+        // This tour is a no-op if the dataset is small — that's fine for smoke.
+        {
+            content: "Confirm app loaded (regardless of pagination state)",
+            trigger: ".o_fusion_bank_rec_header h1",
+        },
+    ],
+});

fusion_accounting/fusion_accounting_bank_rec/static/src/views/kanban/bank_rec_kanban.xml

@@ -0,0 +1,142 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+
+    <t t-name="fusion_accounting_bank_rec.BankRecKanbanController">
+        <div class="o_fusion_bank_rec">
+            <div class="o_fusion_bank_rec_header">
+                <div>
+                    <h1>Bank Reconciliation</h1>
+                    <div t-if="state.journalId" class="text-muted">
+                        Journal #<t t-esc="state.journalId"/>
+                    </div>
+                </div>
+                <div class="o_fusion_stats">
+                    <div>
+                        Unreconciled:
+                        <span class="stat-value"><t t-esc="state.unreconciledCount"/></span>
+                    </div>
+                    <div>
+                        Total pending:
+                        <span class="stat-value">
+                            $<t t-esc="formatCurrency(state.totalPendingAmount)"/>
+                        </span>
+                    </div>
+                </div>
+            </div>
+
+            <div class="d-flex" style="gap: 1rem; padding: 1rem;">
+                <div style="flex: 1 1 60%; max-width: 60%;">
+                    <div t-if="state.isLoading" class="text-center p-4 text-muted">
+                        Loading…
+                    </div>
+                    <div t-elif="state.lines.length === 0" class="text-center p-4 text-muted">
+                        Nothing to reconcile.
+                    </div>
+                    <div t-else="">
+                        <BankRecLineCard
+                            t-foreach="state.lines"
+                            t-as="line"
+                            t-key="line.id"
+                            line="line"
+                            selected="state.selectedLineId === line.id"
+                            onSelect="() => onSelectLine(line.id)"
+                            formatCurrency="formatCurrency.bind(this)"
+                        />
+                        <div t-if="state.lines.length lt state.unreconciledCount"
+                             class="text-center mt-3">
+                            <button class="btn_fusion" t-on-click="onLoadMore">
+                                Load more
+                            </button>
+                        </div>
+                    </div>
+                </div>
+
+                <div style="flex: 1 1 40%; max-width: 40%;" class="o_fusion_bank_rec_detail">
+                    <t t-if="state.selectedLineId">
+                        <t t-set="detail" t-value="state.lineCache[state.selectedLineId]"/>
+                        <div t-if="!detail" class="text-muted">Loading detail…</div>
+                        <div t-else="">
+                            <h2>
+                                <t t-esc="detail.line.payment_ref || 'No reference'"/>
+                            </h2>
+                            <div class="text-muted mb-3">
+                                <span><t t-esc="detail.line.date"/></span>
+                                <span class="ms-2">
+                                    $<t t-esc="formatCurrency(detail.line.amount)"/>
+                                </span>
+                                <span t-if="detail.line.partner_name" class="ms-2">
+                                    · <t t-esc="detail.line.partner_name"/>
+                                </span>
+                            </div>
+
+                            <div t-if="detail.suggestions.length === 0">
+                                <button class="btn_fusion btn_fusion_primary"
+                                        t-on-click="() => onSuggestForLine(detail.line.id)">
+                                    Get AI suggestions
+                                </button>
+                            </div>
+                            <div t-else="">
+                                <h5>AI Suggestions</h5>
+                                <div t-foreach="detail.suggestions" t-as="sug" t-key="sug.id"
+                                     class="o_fusion_ai_suggestion"
+                                     t-att-data-band="confidenceBandLabel(sug.confidence >= 0.85 ? 'high' : sug.confidence >= 0.6 ? 'medium' : sug.confidence > 0 ? 'low' : 'none').toLowerCase()">
+                                    <div class="o_fusion_confidence_badge">
+                                        <t t-esc="(sug.confidence * 100).toFixed(0)"/>%
+                                    </div>
+                                    <div class="o_fusion_suggestion_text">
+                                        <div><t t-esc="sug.reasoning"/></div>
+                                    </div>
+                                    <div class="o_fusion_suggestion_actions">
+                                        <button class="btn_fusion btn_fusion_primary"
+                                                t-on-click="() => onAcceptSuggestion(sug.id)">
+                                            Accept
+                                        </button>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </t>
+                    <t t-else="">
+                        <div class="text-muted">
+                            Select a bank line on the left to see details.
+                        </div>
+                    </t>
+                </div>
+            </div>
+        </div>
+    </t>
+
+    <t t-name="fusion_accounting_bank_rec.BankRecLineCard">
+        <div class="o_fusion_bank_rec_line"
+             t-att-class="props.selected ? 'o_fusion_selected' : ''"
+             t-on-click="props.onSelect">
+            <div class="o_fusion_bank_rec_line_header">
+                <div class="o_fusion_amount" t-att-class="props.line.amount lt 0 ? 'negative' : ''">
+                    $<t t-esc="props.formatCurrency(props.line.amount)"/>
+                </div>
+                <div class="o_fusion_date">
+                    <t t-esc="props.line.date"/>
+                </div>
+            </div>
+            <div class="o_fusion_bank_rec_line_body">
+                <span t-if="props.line.partner_name" class="o_fusion_partner">
+                    <t t-esc="props.line.partner_name"/>
+                </span>
+                <span class="o_fusion_memo">
+                    <t t-esc="props.line.payment_ref || 'No memo'"/>
+                </span>
+            </div>
+            <div t-if="props.line.attachment_count" class="o_fusion_attachments_badge">
+                📎 <t t-esc="props.line.attachment_count"/>
+            </div>
+            <div t-if="props.line.fusion_confidence_band and props.line.fusion_confidence_band !== 'none'"
+                 t-att-class="'o_fusion_ai_suggestion ' + 'band-' + props.line.fusion_confidence_band"
+                 t-att-data-band="props.line.fusion_confidence_band">
+                <div class="o_fusion_confidence_badge">
+                    AI Suggestion Available
+                </div>
+            </div>
+        </div>
+    </t>
+
+</templates>

fusion_accounting/fusion_accounting_bank_rec/static/src/views/kanban/bank_rec_kanban_controller.js

@@ -0,0 +1,81 @@
+/** @odoo-module **/
+
+/**
+ * Bank reconciliation kanban controller.
+ *
+ * Top-level OWL component for the fusion bank-rec widget. Hosts:
+ * - Header bar (journal name, unreconciled count, total pending amount)
+ * - Left column: list of unreconciled bank line cards
+ * - Right column: detail panel for the selected line
+ *
+ * Reads journal_id + company_id from action context. Wires up the
+ * fusion_bank_reconciliation service for all data + reactivity.
+ */
+
+import { Component, useState, onWillStart } from "@odoo/owl";
+import { useService } from "@web/core/utils/hooks";
+import { BankRecLineCard } from "./bank_rec_kanban_renderer";
+
+export class BankRecKanbanController extends Component {
+    static template = "fusion_accounting_bank_rec.BankRecKanbanController";
+    static components = { BankRecLineCard };
+    static props = {
+        action: { type: Object, optional: true },
+        actionId: { type: [Number, String], optional: true },
+        className: { type: String, optional: true },
+        "*": true,
+    };
+
+    setup() {
+        this.bankRec = useService("fusion_bank_reconciliation");
+        this.notification = useService("notification");
+        this.state = useState(this.bankRec.state);
+
+        const ctx = this.props.action?.context || {};
+        const journalId = ctx.default_journal_id || ctx.active_id;
+        const companyId = ctx.allowed_company_ids?.[0]
+            || this.env.services.user?.context?.allowed_company_ids?.[0];
+
+        onWillStart(async () => {
+            if (journalId && companyId) {
+                await this.bankRec.initForJournal(journalId, companyId);
+            }
+        });
+    }
+
+    onSelectLine(lineId) {
+        this.bankRec.selectLine(lineId);
+    }
+
+    async onLoadMore() {
+        await this.bankRec.loadMore();
+    }
+
+    async onSuggestForLine(lineId) {
+        await this.bankRec.suggestMatches([lineId]);
+    }
+
+    async onAcceptSuggestion(suggestionId) {
+        await this.bankRec.acceptSuggestion(suggestionId);
+    }
+
+    async onUnreconcile(partialIds) {
+        await this.bankRec.unreconcile(partialIds);
+    }
+
+    formatCurrency(amount) {
+        return new Intl.NumberFormat(undefined, {
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 2,
+        }).format(amount);
+    }
+
+    confidenceBandLabel(band) {
+        return {
+            high: "High",
+            medium: "Medium",
+            low: "Low",
+            none: "None",
+        }[band] || "—";
+    }
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/views/kanban/bank_rec_kanban_renderer.js

@@ -0,0 +1,20 @@
+/** @odoo-module **/
+
+/**
+ * Bank reconciliation line-card renderer.
+ *
+ * Renders one unreconciled bank line as a card in the kanban list.
+ * Owned by BankRecKanbanController; receives line + selected flag as props.
+ */
+
+import { Component } from "@odoo/owl";
+
+export class BankRecLineCard extends Component {
+    static template = "fusion_accounting_bank_rec.BankRecLineCard";
+    static props = {
+        line: { type: Object },
+        selected: { type: Boolean, optional: true },
+        onSelect: { type: Function },
+        formatCurrency: { type: Function },
+    };
+}

fusion_accounting/fusion_accounting_bank_rec/static/src/views/kanban/bank_rec_kanban_view.js

@@ -0,0 +1,20 @@
+/** @odoo-module **/
+
+/**
+ * Custom view type "fusion_bank_rec_kanban" — registers the controller
+ * with the views registry so window actions can specify
+ * <field name="view_mode">fusion_bank_rec_kanban</field>.
+ */
+
+import { registry } from "@web/core/registry";
+import { BankRecKanbanController } from "./bank_rec_kanban_controller";
+
+export const fusionBankRecKanbanView = {
+    type: "fusion_bank_rec_kanban",
+    Controller: BankRecKanbanController,
+    display_name: "Bank Reconciliation",
+    icon: "fa-exchange",
+    multiRecord: true,
+};
+
+registry.category("views").add("fusion_bank_rec_kanban", fusionBankRecKanbanView);