Hello guys! I want to create a new Owl Component that I want to add it to the existing Thread component in Chatter. The new component ("MailList") I want to look similar as the Activities component from Chatter. A "div" with collapse functionality under which the emails sent from the Odoo add-in for Outlook will be found.

How do I try to do this by creating a new addon:

mail_message_extension_v2:

├───models

│   └───__init__.py

├───static

│   └───src

│       ├───js

│        ​├───mail_list.js

│        ​├───thread_extension.js

│       └───xml

│        ​├───mail_list.xml

├───__init__.py

└───__manifest__.py

__manifest__.py:

{
    'name': 'Mail Message Extension V2',
    'version': '1.0',
    'summary': 'Extend mail message to add collapse functionality',
    'author': 'Your Name',
    'depends': ['mail'],
    'data': [],
    'qweb': [
        'static/src/xml/mail_list.xml',
    ],
    'assets': {
        'web.assets_backend': [
            'mail_message_extension_v2/static/src/**/*',
        ],
    },
    'installable': True,
    'application': False,
}

mail_list.xml:

<?xml version="1.0" encoding="UTF-8" ?>

<templates xml:space="preserve">

<t t-name="mail_message_extension_v2.MailList">

    <div class="o-mail-MailList">

        <div class="d-flex pt-4 cursor-pointer fw-bolder" t-on-click="toggleMails">

            <hr class="flex-grow-1 fs-3"/>

            <div class="d-flex align-items-center px-3">

                <i class="fa fa-fw" t-att-class="state.showMails ? 'fa-caret-down' : 'fa-caret-right'"></i>

                Mails

                <span t-if="!state.showMails" class="badge rounded-pill ms-2 text-bg-success"><t t-esc="mails.length"/></span>

            </div>

            <hr class="flex-grow-1 fe-3"/>

        </div>

    </div>

</t>

</templates>

mail_list.js:

/* @odoo-module */

import { Component, useState } from "@odoo/owl";

export class MailList extends Component {
    static template = "mail_message_extension_v2.MailList";

    setup() {
      this.state = useState({
          showMails: true,
      });
    }
    
    get mails() {
        return [];
    }

    toggleMails() {
        this.state.showMails = !this.state.showMails;
    }
}

thread_extension.js:

/** @odoo-module **/

import { registry } from "@web/core/registry";

import { Chatter } from "@mail/core/web/chatter";
import { Thread } from "@mail/core/common/thread";
import { MailList } from "./mail_list";

import { mount, onMounted, useRef} from "@odoo/owl";


export class ThreadExtension extends Thread {
    
    setup() {
        super.setup();

        this.messagesRef = useRef("messages")

        onMounted(() => {
            this.addMailsActivitiesSection();
        });
    }

    async addMailsActivitiesSection() {
        // Create the container div for Mails
        const mailsActivitiesDiv = document.createElement('div');
        mailsActivitiesDiv.innerHTML = ` <MailList/> `;

        // Find the position to insert the new section
        const chatterContentDiv = this.messagesRef.el;
        chatterContentDiv.prepend(mailsActivitiesDiv);

        // Mount the MailList component
        await mount(MailList, chatterContentDiv);
    }
}

registry.category("components").add("MailList", {
    Component: MailList,
});

Thread.components.MailList = MailList;

Chatter.components.Thread = ThreadExtension;

When I try to access the page I get the following error:
OwlError: Missing template: "mail_message_extension_v2.MailList" (for component "MailList")

    at App.getTemplate (owl.js:3268:1)

    at new ComponentNode (owl.js:2356:1)

    at App.makeNode (owl.js:5667:1)

    at App.mount (owl.js:5661:1)

    at mount (owl.js:5777:1)

    at ThreadExtension.addMailsActivitiesSection (chatter_extension.js:50:1)

    at ThreadExtension. (chatter_extension.js:20:1)

    at RootFiber.complete (owl.js:1771:1)

    at Scheduler.processFiber (owl.js:5615:1)

    at Scheduler.processTasks (owl.js:5591:1)

Where am I going wrong? Is the chosen approach correct? 

I am open to any information you can give.

Thank you very much!