Mornin all 🙂 I'm migrating a v13 site to v14 that have some backoffice stuff I'm not sure how to do in v14. The first is how to override content tree menu item icon and text of a given document type, and the second is how to override default localization strings in the backoffice. Any help or pointers would be greatly appreciated. Cheers!

Well menu items (right click are known known as actions) You wanting to override the icon used for an action that ships with Umbraco or create something new in that menu @Kenneth Solberg ?

No, tree icons and labels https://cdn.discordapp.com/attachments/1253595476411023442/1253699890706387095/image.png?ex=6676ce82&is=66757d02&hm=704a3f151c826b2dc862ff800aec63d1fa3fe1581e5926e936ee6b7e59fbe6a1&

So whats the use case you are trying to do

Based on the value of certain properties of a given document, I want to display a different icon and label.

Yeh this would all need to be done clientside AFAIK and not with ServerSide. So probably some custom context to observe certain documents & its properties so that then you could change the tree icon perhaps would be the way to go about it... I am not 100% sure really. One for the HQ gang to comment on I think

Mm, suggestions on who to mention? 🙂

I reckon @Jacob Overgaard or @Niels Lyngsø may have some thoughts on it

Thanks Warren, any help / pointers would be really appreciated @Jacob Overgaard / @Niels Lyngsø 🙏

Hi @Kenneth Solberg Interesting case. So currently it’s not possible to just override the icon. But we do see that there is several needs for appending a state/badge/… on tree items. And now is a good time to come up with a great common solution to that. But since that’s not available at this very moment. The choices at hand are to override the Document Tree Item with your own Element. In this element you are in full control and would at this stage need to implement some of the existing features for accessing Actions etc. But it will become a challenge for you with your current solution, cause we do not know the property values of items in the tree. We only load the necessary data for representing the item. So maybe you would need to find other ways to propagate/determine the state? Regarding localization, I’m not sure but have you tried to provide a localization with the same key and see if it overrides by doing so? It sounds a little hacky to do so, maybe you could expand upon why you need to overwrite localizations?

Thanks for answering Niels! I can see the challenge with regards to access to property values. I've just started development of extending the backoffice, but if I understand correctly it should be possible to create a custom context at a higher level that can manage retrieval and caching of the relevant property values and then consume this context in document tree items? I'm on thin ice here, hehe. With regards to overriding certain default UI text labels, it was something done before i joined the project (a government agency btw), but I would guess it was certain terminology that made more sense as they use Umbraco as a data management tool for a frontend react app (headless'y) where f.ex publish "means" something else. Where can I find the correct key name for the default localization? Cheers!

That’s correct, you can make a globalContext which then lives for the whole application/user session. I’ll be back on the localization one

Thanks Niels!

So, this is not for any devs. But I think this approach might be the most useful one for you. And we maybe need to look at better DX/investigation tools for this. But, all extensions inserted into Backoffice, gets their extension manifest set on a

manifest

property. In this case I'm investigation the DOM to find the host element of the Save and Publish button. aka. the element of the extension. > A hint here is that its the first elements within the

umb-extension-with-api-slot

or

umb-extension-slot

we use these elements to insert extensions. Some places they are inserted in other ways. but its a good one to spot for. Once I found the element, I can inspect it in the console..

$0

points to current selected element. In other words

$0.manifest

will give me the manifest and I can investigate it. The reason why I'm interested in this, is because most likely a localization key is defined here. otherwise it gives you an idea about where the source code of the element is. I hope that helps, let me know how this way of investigation works for you 🙂 https://cdn.discordapp.com/attachments/1253595476411023442/1255055886544801852/image.png?ex=667bbd61&is=667a6be1&hm=9e4d50a3a3f9bfa0b03bf1141d41534e9f7160741f50f0892b709d2e69e081fd&

Ok, thanks again, I'll try that approach 🙂

Given me an idea 🙂