From bbe563ca6052137f67ef0193ff884883f83429d5 Mon Sep 17 00:00:00 2001 From: Rushabh Mehta Date: Tue, 3 Sep 2024 09:58:21 +0530 Subject: [PATCH] fix(minor): add website in app switcher --- frappe/public/icons/espresso/icons.svg | 5 ++ frappe/public/icons/timeless/icons.svg | 4 +- frappe/public/images/web.svg | 3 + frappe/public/js/frappe/ui/sidebar.js | 78 +++++++++++++++-------- frappe/public/js/frappe/views/treeview.js | 1 + frappe/public/scss/desk/sidebar.scss | 4 +- frappe/public/scss/desk/tree.scss | 8 +++ 7 files changed, 75 insertions(+), 28 deletions(-) create mode 100644 frappe/public/images/web.svg diff --git a/frappe/public/icons/espresso/icons.svg b/frappe/public/icons/espresso/icons.svg index f3c4d6e97c..b603948684 100644 --- a/frappe/public/icons/espresso/icons.svg +++ b/frappe/public/icons/espresso/icons.svg @@ -1694,5 +1694,10 @@ + + + + + diff --git a/frappe/public/icons/timeless/icons.svg b/frappe/public/icons/timeless/icons.svg index 769c2fbbba..5300c8284d 100644 --- a/frappe/public/icons/timeless/icons.svg +++ b/frappe/public/icons/timeless/icons.svg @@ -1003,5 +1003,7 @@ - + + + diff --git a/frappe/public/images/web.svg b/frappe/public/images/web.svg new file mode 100644 index 0000000000..619cb9e758 --- /dev/null +++ b/frappe/public/images/web.svg @@ -0,0 +1,3 @@ + + + diff --git a/frappe/public/js/frappe/ui/sidebar.js b/frappe/public/js/frappe/ui/sidebar.js index 1ef2d71ead..deed1d07ef 100644 --- a/frappe/public/js/frappe/ui/sidebar.js +++ b/frappe/public/js/frappe/ui/sidebar.js @@ -111,43 +111,71 @@ frappe.ui.Sidebar = class Sidebar { for (var app of frappe.boot.app_data) { frappe.boot.app_data_map[app.app_name] = app; if (app.workspaces?.length) { - $(`
- -
- -
- ${app.app_title} - -
`).appendTo(app_switcher_menu); + this.add_app_item(app, app_switcher_menu); } } + this.add_website_select(app_switcher_menu); + this.setup_select_app(app_switcher_menu); + } + add_app_item(app, app_switcher_menu) { + $(`
+ +
+ +
+ ${app.app_title} + +
`).appendTo(app_switcher_menu); + } + + setup_select_app(app_switcher_menu) { app_switcher_menu.find(".app-item").on("click", (e) => { let item = $(e.delegateTarget); + let route = item.attr("data-app-home"); frappe.current_app = item.attr("data-app-name"); - frappe.set_route(item.attr("data-app-home")); - this.wrapper - .find(".app-switcher-dropdown .sidebar-item-icon img") - .attr("src", frappe.boot.app_data_map[frappe.current_app].app_logo_url); - this.wrapper - .find(".app-switcher-dropdown .sidebar-item-label") - .html(frappe.boot.app_data_map[frappe.current_app].app_title); + if (route.startsWith("/app")) { + frappe.set_route(item.attr("data-app-home")); - // hide menu - app_switcher_menu.toggleClass("hidden"); + this.wrapper + .find(".app-switcher-dropdown .sidebar-item-icon img") + .attr("src", frappe.boot.app_data_map[frappe.current_app].app_logo_url); + this.wrapper + .find(".app-switcher-dropdown .sidebar-item-label") + .html(frappe.boot.app_data_map[frappe.current_app].app_title); - // re-render the sidebar - this.make_sidebar(); + // hide menu + app_switcher_menu.toggleClass("hidden"); + + // re-render the sidebar + this.make_sidebar(); + } else { + // new page + window.open(route); + } }); } + add_website_select(app_switcher_menu) { + $(`
`).appendTo(app_switcher_menu); + this.add_app_item( + { + app_name: "website", + app_title: __("Website"), + app_home: "/", + app_logo_url: "/assets/frappe/images/web.svg", + }, + app_switcher_menu + ); + } + setup_pages() { this.sidebar_pages = frappe.boot.sidebar_pages; this.all_pages = this.sidebar_pages.pages; diff --git a/frappe/public/js/frappe/views/treeview.js b/frappe/public/js/frappe/views/treeview.js index ec43b23696..2be0ab49f3 100644 --- a/frappe/public/js/frappe/views/treeview.js +++ b/frappe/public/js/frappe/views/treeview.js @@ -86,6 +86,7 @@ frappe.views.TreeView = class TreeView { var me = this; if (!this.opts || !this.opts.do_not_make_page) { this.parent = frappe.container.add_page(this.page_name); + $(this.parent).addClass("treeview"); frappe.ui.make_app_page({ parent: this.parent, single_column: true }); this.page = this.parent.page; frappe.container.change_to(this.page_name); diff --git a/frappe/public/scss/desk/sidebar.scss b/frappe/public/scss/desk/sidebar.scss index 4385782850..4596b9ea1e 100644 --- a/frappe/public/scss/desk/sidebar.scss +++ b/frappe/public/scss/desk/sidebar.scss @@ -115,7 +115,7 @@ body { } .divider { - margin: var(--margin-md) 0; + margin: var(--margin-xs) 0; border-top: 1px solid var(--border-color); } @@ -225,7 +225,7 @@ body { a { text-decoration: none; display: flex; - vertical-align: middle; + align-items: center; } } diff --git a/frappe/public/scss/desk/tree.scss b/frappe/public/scss/desk/tree.scss index 5e9a2fe3c1..2c6bb05eba 100644 --- a/frappe/public/scss/desk/tree.scss +++ b/frappe/public/scss/desk/tree.scss @@ -1,5 +1,13 @@ +.treeview { + .layout-main-section { + max-width: var(--page-max-width); + margin: auto; + } +} + .tree { padding: var(--padding-sm); + .btn-group { .btn { box-shadow: none;