Error: 'frappe.ui.Sidebar.extend is not a function

I’m trying to add a “Notifications” icon to a customized Frappe application, but I keep encountering the error “frappe.ui.Sidebar.extend is not a function.” I’ve followed the steps below to resolve this issue:

  1. I’ve correctly placed my JavaScript file and Navbar icon, and configured the hooks.py file appropriately.
  2. I’ve verified the content of my JavaScript file, and I’m confident the code is correct.
  3. I’ve recompiled my application using the bench build command.
  4. I’ve cleared the browser cache, tried different browsers and tabs, but the issue persists.

Could you please help me overcome this error or suggest any steps to diagnose the problem?

Thank you.

my hooks file

app_include_js = ["/assets/js/erpnext.min.js",
                  "/assets/js/navbartest.js"  
                  ]

my navbartest.js


frappe.ui.Sidebar = frappe.ui.Sidebar.extend({
    setup_primary_links: function() {
        this._super();
                this.add_primary_item(__('Notifications'), function() {
                    frappe.msgprint('Hello!');
                }, 'notification-icon-class'); 
    }
});