Add Options To Desk Theme (Modify Core Field)

ERPNext
1

Is there a way that I could add options to the core field “desk_theme” of the User doctype from my custom app? I tried the below JS script which does add the options, however when you attempt to save, it fails validation because it doesn’t think “Custom Theme” is a valid option.

frappe.ui.form.on( "User", "refresh", function( frm ){
    frm.set_df_property( "desk_theme", "options", [ "Dark", "Light", "Automatic", "Custom Theme" ] );
	frm.refresh_field( "desk_theme" );
} );

I was thinking maybe I could somehow set the options from my module in the after_install method? Is that possible?

Or does someone have a solution to get around the validation?

2

If the custom theme is there, then it will comes automatically, because theme fieldtype is Link.

3

The desk theme field is a select with hard coded values: Light, Dark, Automatic. This is where I would like to add additional options.

image
image752×653 35.8 KB

4

custom option-related theme is developed or not?

5

Yes, I have a couple custom themes developed.

6

Then you have to check the base code, when user select the default theme then how to set the theme.

8

I have it so that the user can set the theme using the “Toggle Theme” option which is found under their avatar. I found somewhere this code which showed how to override the switch_theme function with the following:

hooks.py

override_whitelisted_methods = {
	"frappe.core.doctype.user.user.switch_theme": "tweaks.overrides.theme.switch_theme"
}

And then this code:

import frappe

@frappe.whitelist()
def switch_theme( theme ):
	if theme in [ "Dark", "Light", "Automatic", "Apricot", "Midnight Blue", "Newara" ]:
		frappe.db.set_value( "User", frappe.session.user, "desk_theme", theme )

So when the user clicks on their avatar and selects “Toggle Theme”, they get this popup and they can switch their theme.

image
image732×544 23 KB

But the problem lies in the User Document Form. Using JavaScript, I can successfully add the options to the Desk Theme drop down:

frappe.ui.form.on( "User", "refresh", function( frm ){
    frm.set_df_property( "desk_theme", "options", [ "Dark", "Light", "Automatic", "Apricot", "Midnight Blue", "Newara" ] );
	frm.refresh_field( "desk_theme" );
} );

But the minute I try to save the user document, I get the following:

image
image891×433 20.4 KB

I can’t save the user as long as they have a theme selected that is not one of the three. Granted I can just switch their theme to one of the three in order to successfully save, but that messes with them and frankly shouldn’t be necessary.

Does anyone have any ideas on how I continue with the custom themes but allow selection of them in the user document form?

9

You will have to add options to the select field (via Customize Form or via DocType); this code validates whether the selected option is present in the select field’s options.

10

Can’t do Customize Form because it’s a Core DocType. But you are right I could customize the DocType and have tested that. I prefer to avoid putting in a requirement though on a new install that I have to go in and change the DocType.

Is there a way to update a field on the Core DocType in a custom app? I started reading up on fixtures but don’t have a complete understanding on how they work yet. Is that something I could use here? I figured out the options are stored in the tabDocField table under the options column but don’t want to do a straight SQL update. I’m sure that is highly discouraged.

11

You can use property setters to update the selected option of a field.
Example:

image
image1738×1428 151 KB

12

That solved it, thanks for the great suggestion. Didn’t know about this feature in Frappe. Keep learning new great things about the platform.