How can I add Custom Menu Entries in the Main Sidebar?

James_Houx · July 13, 2022, 11:06pm

I’d like to insert custom menu entries in the sidebar as shown in the screenshot below.
Also, I want to be able to do this conditionally based on information about the currently logged in user.

What is the best way to do this?

Kurt_Rottmann · July 18, 2022, 2:39pm

Hi, to add new menu entries you have to create a new “Workspace”. “Build” → “Workspace”. It’s necessary that the module where you save the workspace has at least one doctype to appear in the menu.
You can limit menu entries based in allowed modules. In “User Form” → “Allow Modules”.

James_Houx · July 18, 2022, 8:08pm

There has got to be a more flexible way to deal with this.

Right now, I am only given the option of creating Modules which link to workspaces with doctypes and shortcuts.

How could I use the built-in client javascript to add my own elements to the Modules menu and attach event listeners to those elements so I can run my own javascript when the links are clicked.

Kurt_Rottmann · July 19, 2022, 5:45pm

I’ve the same problem. I override “frappe/frappe/public/js/frappe/views/workspace/workspace.js” to add custom entries to the side menu.

peterg · July 20, 2022, 1:06am

I don’t have a v13 instance available to test, but it should be possible to extend the Workspace class and then override the reference that frappe keeps to it here.

github.com

frappe/frappe/blob/db568c44620c2fd1e8d51455eaa1e589f99b0cda/frappe/public/js/frappe/views/workspace/workspace.js#L16-


      
          		name: 'Workspaces',
          		title: __("Workspace"),
          	});
          
          
	frappe.workspace = new frappe.views.Workspace(wrapper);
          	$(wrapper).bind('show', function () {
          		frappe.workspace.show();
          	});
          };
          
          
frappe.views.Workspace = class Workspace {
          	constructor(wrapper) {
          		this.wrapper = $(wrapper);
          		this.page = wrapper.page;
          		this.prepare_container();
          		this.show_or_hide_sidebar();
          		this.setup_dropdown();
          		this.pages = {};
          		this.sidebar_items = {};
          		this.sidebar_categories = [
          			"Modules",

In your app js, it’d be something like:

frappe.views.Workspace = class CustomWorkspace extends Workspace {
   //your custom code
}

It may be worth mentioning too that v14 includes a significant rewrite of how desk pages work, though I don’t believe it’s possible there either to add arbitrary links or js triggers on the sidebar.