diff --git a/cypress/integration/form.js b/cypress/integration/form.js index c533d14f03..6319e8ae80 100644 --- a/cypress/integration/form.js +++ b/cypress/integration/form.js @@ -99,7 +99,9 @@ context("Form", () => { cy.new_form("User"); jump_to_field("Location"); // this is in collapsed section + cy.wait(500); type_value("Bermuda"); + cy.wait(500); cy.get_field("location").should("have.value", "Bermuda"); }); diff --git a/frappe/public/js/frappe/ui/notifications/notifications.js b/frappe/public/js/frappe/ui/notifications/notifications.js index 2cdfd5ba33..7c3cd2c0c4 100644 --- a/frappe/public/js/frappe/ui/notifications/notifications.js +++ b/frappe/public/js/frappe/ui/notifications/notifications.js @@ -8,7 +8,8 @@ frappe.ui.Notifications = class Notifications { } make() { - this.dropdown = $(".navbar").find(".dropdown-notifications").removeClass("hidden"); + $(".standard-items-sections").find(".sidebar-notification").removeClass("hidden"); + this.dropdown = $(".standard-items-sections").find(".dropdown-notifications"); this.dropdown_list = this.dropdown.find(".notifications-list"); this.header_items = this.dropdown_list.find(".header-items"); this.header_actions = this.dropdown_list.find(".header-actions"); @@ -25,19 +26,19 @@ frappe.ui.Notifications = class Notifications { setup_headers() { // Add header actions - $(` + $(` ${frappe.utils.icon("setting-gear")} `) .on("click", (e) => { e.stopImmediatePropagation(); - this.dropdown.dropdown("hide"); + console.log("what"); frappe.set_route("Form", "Notification Settings", frappe.session.user); }) .appendTo(this.header_actions) .attr("title", __("Notification Settings")) .tooltip({ delay: { show: 600, hide: 100 }, trigger: "hover" }); - $(` + $(` ${frappe.utils.icon("mark-as-read")} `) .on("click", (e) => this.mark_all_as_read(e)) @@ -45,6 +46,16 @@ frappe.ui.Notifications = class Notifications { .attr("title", __("Mark all as read")) .tooltip({ delay: { show: 600, hide: 100 }, trigger: "hover" }); + $(` + ${frappe.utils.icon("x")} + `) + .on("click", (e) => { + this.dropdown.addClass("hidden"); + }) + .appendTo(this.header_actions) + .attr("title", __("Close")) + .tooltip({ delay: { show: 600, hide: 100 }, trigger: "hover" }); + this.categories = [ { label: __("Notifications"), @@ -118,6 +129,7 @@ frappe.ui.Notifications = class Notifications { } setup_dropdown_events() { + const dropdown = this.dropdown; this.dropdown.on("hide.bs.dropdown", (e) => { let hide = $(e.currentTarget).data("closable"); $(e.currentTarget).data("closable", true); @@ -127,6 +139,25 @@ frappe.ui.Notifications = class Notifications { this.dropdown.on("click", (e) => { $(e.currentTarget).data("closable", true); }); + + $(document).on("click", function (e) { + const isInsideNotificationBtn = + $(e.target).closest(".standard-items-sections .sidebar-notification").length > 0; + const isInsideDropdown = $(e.target).closest(".notifications-list").length > 0; + + if (!isInsideNotificationBtn && !isInsideDropdown) { + dropdown.addClass("hidden"); + } + }); + + dropdown.find(".notification-item").on("click", (e) => { + dropdown.addClass("hidden"); + }); + $(document).on("page-change", function () { + if (dropdown && dropdown.length) { + dropdown.addClass("hidden"); + } + }); } }; diff --git a/frappe/public/js/frappe/ui/sidebar/sidebar.html b/frappe/public/js/frappe/ui/sidebar/sidebar.html index 86c48db035..518d459909 100644 --- a/frappe/public/js/frappe/ui/sidebar/sidebar.html +++ b/frappe/public/js/frappe/ui/sidebar/sidebar.html @@ -1,7 +1,21 @@
-
+
+ +
diff --git a/frappe/public/js/frappe/ui/sidebar/sidebar.js b/frappe/public/js/frappe/ui/sidebar/sidebar.js index f99a28f913..293aeb5698 100644 --- a/frappe/public/js/frappe/ui/sidebar/sidebar.js +++ b/frappe/public/js/frappe/ui/sidebar/sidebar.js @@ -248,10 +248,23 @@ frappe.ui.Sidebar = class Sidebar { class: "navbar-search-bar hidden", }); } + this.standard_items.push({ + label: "Notification", + icon: "bell", + type: "Button", + class: "sidebar-notification hidden", + onClick: () => { + this.wrapper.find(".dropdown-notifications").toggleClass("hidden"); + if (frappe.is_mobile()) { + this.wrapper.removeClass("expanded"); + } + }, + }); this.standard_items.forEach((w) => { this.add_item(this.$standard_items_sections, w); }); this.setup_awesomebar(); + this.setup_notifications(); this.standard_items_setup = true; } setup_awesomebar() { @@ -270,6 +283,11 @@ frappe.ui.Sidebar = class Sidebar { } } } + setup_notifications() { + if (frappe.boot.desk_settings.notifications && frappe.session.user !== "Guest") { + this.notifications = new frappe.ui.Notifications(); + } + } add_item(container, item) { this.items.push( this.make_sidebar_item({ diff --git a/frappe/public/js/frappe/ui/sidebar/sidebar_item.js b/frappe/public/js/frappe/ui/sidebar/sidebar_item.js index 01f4fe7cbc..5c8235249f 100644 --- a/frappe/public/js/frappe/ui/sidebar/sidebar_item.js +++ b/frappe/public/js/frappe/ui/sidebar/sidebar_item.js @@ -382,6 +382,7 @@ frappe.ui.sidebar_item.TypeButton = class SidebarButton extends frappe.ui.sideba super(item); this.title = frappe.app.sidebar.workspace_title; this.item.id && this.wrapper.attr("id", this.item.id); + this.item.class && this.wrapper.attr("class", this.item.class); this.wrapper.attr("title", this.item.label); this.setup_click(); } diff --git a/frappe/public/js/frappe/ui/toolbar/awesome_bar.js b/frappe/public/js/frappe/ui/toolbar/awesome_bar.js index 801e89af79..4d924b0f11 100644 --- a/frappe/public/js/frappe/ui/toolbar/awesome_bar.js +++ b/frappe/public/js/frappe/ui/toolbar/awesome_bar.js @@ -5,7 +5,7 @@ frappe.provide("frappe.tags"); frappe.search.AwesomeBar = class AwesomeBar { setup(element) { - $(".search-bar").removeClass("hidden"); + $(".search-bar, .navbar-search-bar").removeClass("hidden"); this.options = []; this.global_results = []; diff --git a/frappe/public/js/frappe/ui/toolbar/navbar.html b/frappe/public/js/frappe/ui/toolbar/navbar.html index d2facd7485..e5243335ed 100644 --- a/frappe/public/js/frappe/ui/toolbar/navbar.html +++ b/frappe/public/js/frappe/ui/toolbar/navbar.html @@ -26,34 +26,6 @@
{% endif %}