Christian Menzinger, who joins to talk about User Interface API, is a self-employed Germany-based Salesforce developer, trainer, Salesforce MVP, Community leader.
Main Points
- What is the User Interface API?
- What problem does it solve?
- How is it in use before and in LWC?
- Examples of usage scenarios and sample code
Links
- Christian’s Twitter
- Christian’s LinkedIn
- User Interface API in general
- Explore the Salesforce APIs with a Postman Collection
- Wire Adapters and Functions for UI-API
- Presentation and sample project how to leverage User Interface API hooks in Lightning Web Components
Contact Me
If you enjoy this podcast, please reach me out to let me know your thoughts or simply say Hello. My (Xi’s) contact info:
Take care, until next time :)!
Transcript
AI-generated, unedited.
[00:14] Hey everybody! This is Xi Xiao. This is a new episode of Salesforce Way podcast. Today I'm sitting with another guest with me. His name is Christian Menzinger. Hello, Christian. Hello, hello everybody. Yeah, great to have you on the show. So I know you are one of the guests who are wearing multiple hats. So why would you introduce yourself? Yeah, sure. Yeah, my name is Christian Menzinger. I'm a Salesforce developer and trainer from Munich, Germany. I'm co-leading the developer group here, and yeah, I am in the ecosystem since oh more than six years now, and yeah, I'm wearing different hats. That's true. I have been in different roles. So I started my Salesforce career with an ISV partner, so we're building a product for the Salesforce platform. Then I moved to the customer side and saw different different challenges over there, and so since yeah a little bit more than a year, I'm independent right now. And so, also getting in touch with different customers from different industries, different projects, and so yeah, I have a broad view on yeah challenges on the Salesforce platform. Are you now more on the developer side or the admin side? Developer side, yeah. Okay, I see. So on this show, you wanted to talk about the user interface API, am
[01:44] I right? Yeah, I I found this is an interesting aspect. Not so many people are aware about. I was not. I was not either. Yeah. So the user interface API is the one thing. But what I want to go or want to share more details is the combination of the user interface API with Lightning Web Components because this is an interesting pair. Hmm. Yeah. So, frankly speaking, I hadn't had any idea about the user interface API before you told me this. So then I went home to study a bit about, you know, the information you shared with me. Then I realized, okay, there is such a API in Salesforce. So I think we can use this time to really. To share with our listeners, what is it about, and why? Like what you just mentioned, the Lightning Web Component might could use it as well, right? Yeah, so the user interface API is actually an interesting piece. So when they transition from Salesforce Classic to Salesforce Lightning Experience, it's not only about repainting the user interface. So they really introduced several layers of logical abstractions, and the user interface API is one of them. And so you can think about. What you see in Salesforce, this all comes from this API. So, for instance, if you have several access to different
[03:14] objects, so you have a CRUD access—create, read, update, delete—whether you can see or not see a certain object, or you have a sharing setting on a certain record. Or of course, all the localization settings and the customizations you are doing. These are all baked into this API. So just give you an example. Yeah. Yeah. Basically, on what you just mentioned, it's not really just user interface related because you have these permissions like read, edit. So so there are more than the user interface related data you can retrieve from this API. Absolutely. So, so for instance, I give you an example. So, when you open Salesforce and you have you view a certain record, so you have opportunity with a record ID X Y set. When you do a request in the API, you will retrieve all the record data, so all the field values for for the for that given record. But you will also retrieve metadata. So, for instance, which fields are in the current page layout? Which fields are you allowed to view? So it could be that you don't have a permission that certain field is hidden in your visualization. And so, all these information comes in one single request to the user interface API. So you retrieve data and metadata at the same time. And the main purpose for this API is
[04:45] it's actually how Lightning experiences built. So Lightning experiences built on top of the user interface API. They're consuming the user interface API, but when you think about you want to build your own iOS app, for instance, so you have a customized iOS app. So Coca Cola was a great example in the past when they when they showed. That showcase the Coca Cola iPad app. So it's a whole customized iOS app, but you still want to have the same mechanism as you are as you have in the browser natively. So you still want to apply all the security settings, of course, and this is where you can use this API that you have the same information as Lightning Experience has, and so you can build your own customized interface on top of the metadata from Salesforce. Ah, so you just mentioned the Lightning Experience retrieves the data from the user interface API and then visualise. So, if you want, you can do the same thing as the Lightning experience. So, you are building your own Lightning experience UI if you want using the same. Yeah, I mean, yeah. This this would be a little bit a little bit of a work, but generally speaking, yes, yeah. And when you think a little, a step further, I guess no one really wants to rebuild Lightning experience in total, but maybe you want to add a little bit information on a certain piece.
[06:15] So you're on a Lightning record page, and you want to add a little bit more deeper information on a certain piece. For instance, a picklist value. And so you could use the user interface API in the same manner as Lightning experiences, doing just with your own component, and that is what I meant when you build a Lightning Web component, which can live on a Lightning page, for instance. You can use the same mechanism as Lightning experiences using, and this is an interesting piece because you can enhance. Information you can enhance the GUI with data which is natively available. So you don't have to build your own web service. You don't have to request the Lightning. You don't have to request the user interface API manually. It's a REST API. Of course you can, but it's a lot of work to parse all the data and all that stuff. But there are pre-built hooks into Lightning web components, and this is the interesting part. Oh, okay. So, yeah, like what you mentioned, the Coca Cola, the iOS app. I would assume they they reach the REST API to get the data and then visualize something. But in the Lightning Web Component, there is kind of like a wrapper already. The thing is embedded inside, so you don't need to make your own REST API request. Am I right? Exactly, and I mean you can. I mean a good learning path would be
[07:45] if you just use the API natively to see what the what the API is about, and a very cool introduction. I think it was introduced. I don't know earlier to 2020. Their Salesforce introduced the Postman collection. So Postman is an application where it's just a client for for for for REST calls, SOAP calls, all this kind of stuff. And they introduced the Postman collection for Salesforce APIs. So they have built templates for all available Salesforce APIs within Postman. And so it's really, really easy to make a request to the user interface API with this Postman collections, and see the response. What you will get back if you would do a REST request, and this is a good learning path because you have a feeling about what information is baked into this API. And so I can really recommend go for the Postman collection. Would you would you mind to share the UIL for that Postman connection later? Absolutely, absolutely. Okay, yeah. Okay, we'll put the information. There's also a great blog post, and there's also a great blog post. I think from Philip Oseil explaining how to use this Postman collection. Definitely, okay. So that's kind of get the touch and feeling how. You can query via the REST
[09:15] API, right? The the user interface REST API. Does it also include the authentication part? Do you need to put your credentials in so that before you query the data? Yeah, absolutely. Because I mentioned earlier that. The User Interface API is running in the context of the current user, so your localization settings, your sharing settings, your CRUD object settings. So it has to know, of course, the context of the user, and for that you have to authenticate. That's true. So you have to do an authentication request first, and then you have a session, and with that session you can query the User Interface API on the same org. Okay, but if we use it in the Lightning Web Component, do we also need to authenticate? No, because you're running in the context of the current user, and so this is all baked in in these so-called wire adapters. So there are wire adapters for the user interface API. So there are hooks which have been pre-built, and you can just consume these hooks by just using them. Okay. And the interesting part here is you don't have to write a single line of Apex code. So, have you any idea why this is good? Not writing Apex was it because you don't need to maintain the Apex?
[10:47] Yes.
[10:49] What is it? You don't have to maintain. That's true. And also, you don't have to write test classes for it. Because every every Apex class needs a test class coverage or test coverage. And so for the deployment. But if you use the user interface API with Lightning Web Components. It's just baked into JavaScript, and so you can just consume those data without writing Apex, without writing test classes, and so it's just a predefined API. And you can be sure that this API is not changing, so you don't have to maintain more things. That's that's that's definitely a good point.
[11:30] How about before Lightning Web Web Components? We had Aura, right? So was the user interface API there like well used as well? No, it wasn't. In general, that's true for Aura and Lightning Web Components. You cannot call any Salesforce API directly within JavaScript, so you cannot do an AJAX request to to any of the Salesforce API endpoints. So you have to go through Apex and then. There are ways to get this done, but as I said, these hooks are pre-built for JavaScript, and so you can just consume them. And these hooks have not been available in Aura previously. Okay, okay, I see. That's why maybe a lot of people, including me, didn't hear about it at all.
[12:23] Yeah. So I think one more thing I still want to ask is the scope of the data we can retrieve from the user interface API. Is it like really covered all the metadata? If I, for example, query one account record, so how much metadata does it come back really? Oh, there is a lot of metadata included, from the page layout, from all the permission settings, all all that stuff. But in general, there are kind of I would say sections which are available for the user interface API and for the hooks in Lightning Web Components in special. And those categories are object, so you can also get a lot of just plain metadata information about the object. So, for instance, what's the default record type ID? What are my permission to that certain object? All these kind of things. Then you have all related to list views. So you can create your own list views, of course, and then you can consume the data of your own list view. So, for instance, if you want to do a different visualization of a list view, a list view is always a table, and if you want to present a user the information. Where he can configure in a list view by a totally different kind. So, for instance, in I don't know boxes or maybe accounts which have a bigger annual revenue are bigger visualized
[13:54] than other accounts. So. There are no limits about the visualization of Lightning Web Components, but you can still rely on the metadata of a List View, for instance. And that means that the user can configure the data from the List View by just modifying the List View, and you can just consume whatever he has configured in your Lightning Web Components. And so you will not only get the records, you will also get about which columns you have included, which is which columns are sorted, all these kind of things. Everything what you can do with a List View. All the data you can get into your Lightning Web Components by using the List View hook into the UI API. Ah, so I can I can get certain categories defined by myself, not everything. Right. If I want, there are different different endpoints. I would say, and these categories are just grouped. So there are, for instance, for object, I don't know, there are five or six endpoints. Get object info. Get picklist values. Get. And so, yeah. So you can, the best thing really to see what's available is to go to the documentation about the UI API hooks in the Lightning Web Components documentation, and I think you have a very clear understanding about what's supported. The biggest section is the record section. So everything what you can do with a record. Is supported. Create a record, update a record. You can even say, "Hey, give me a new record
[15:24] and and predefine certain values." This is defined in Salesforce, but with the call, you will get these information back. So, if you want to build a new a new record dialog to create a record, and you still want to prefill certain values, what the administrator has configured, you can use just this endpoint, and you will get the information about which fields has which values predefined for a new record. Ah, so what you just mentioned is we are not just read data through the API; we can After reading the data, we can define to create or update certain records. Am I right? Absolutely. As I said, read, update, or even create new records are all endpoints. How about delete? Yes. Also, delete. Okay, so it's like a really powerful thing here for us to use. Yeah, and and but before you build your own components, implementing these endpoints, there are some pre-built components from Salesforce already. So they are called base Lightning components, and one of these components is called Lightning Record Form. And the Lightning record form is also implementing the user interface API already for you. It's just another abstraction. It's just a little bit more, yeah, component based.
[16:54] So, how to say? It's just a ready-to-use component, right? So you have a dedicated API for this component. It's limited. It's not so powerful as you would implement the hooks by yourself, but from. Some of the use cases, these components are perfectly fitting, and so there is kind of a priority. Whenever you think about working with record data in Lightning Web Components, your first approach should always be. Use the base Lightning components, and the base Lightning components are Lightning Record Form, Lightning Record Edit Form, Lightning Record View Form. These three components should your first step into. And if you feel okay, this is nice, but I'd like to have a different behavior. I'd like to add more power on this component. Then you can build your own component, and then you use the wire adapters with these endpoints in the user interface API. Are those base components open sourced? Yes, they are. Okay, there is a GitHub repo, and especially these components are interesting to see how Salesforce built these components. Unfortunately, not all base components are open sourced yet, and one which is really missing is the data table. Unfortunately, this is not open sourced yet. But most, I would say, 95% of
[18:24] all base components are in this repo, and the components which are using the UI API, these are also open sourced. Yeah, I see. Thanks for sharing all this. One last question from me is just to get the full picture over this user interface API. I want to get the opposite example. So, in the Lightning Web Component, what if we don't use the user interface API? Let's say if I want to get some Let's say get one record related metadata. What would I do if I don't use the user interface API?
[19:07] You can do everything with Apex, so it's just a matter of how you structure your data, and you always have to take care when you write your Apex code to think about Apex is running in system mode. So that means you don't have any of the security mechanism out of the box available. So you have to manually ask for it. For instance, do I have access on this object? Do I have Access on this field, so you have to ask yourself on a cycle query, for instance, give me the fields that I'm that I can consume. I as a user, of course, in the context of the user, when we're talking about viewing a record, and so you have to build this by your own. Of course, there are more and more good options available, like with security enforced in a SOQL query, which has been introduced. Not so long ago, but yeah, you have to think about what you do. You're running in system mode. You're kind of God mode, so you can do everything in Apex, and then you can send everything to Lightning Web Component. When you run in JavaScript, there is a good saying: say never trust the client. So you're in JavaScript, so you can also do whatever you like because JavaScript does not know any S object. It does not know any field level security. It's just a JavaScript object. Which has the structure, which is mapping coincidentally on an S object on the Salesforce platform, right? And so you can do whatever you like in
[20:37] JavaScript, send it to Apex, and then Apex is your safety net. Apex is the one say, hey. I take care that I do not have any, any I don't know faulty data, and so I have to do checks. Are you allowed to update this field? Even if you send this field to Apex, does not mean that JavaScript knows anything about field level security. But when you consume the user interface API in JavaScript directly, of course, you only get those values already. Already directly in JavaScript, and you don't have to take care about because you can be sure that the implementation of this JavaScript endpoint is done correctly. Okay, I got it. So, if we want to study more about this user interface API, where should we go? I will share some links. I also did a presentation in the developer group here in Munich a couple of weeks ago, and I will also share the link to this presentation because that presentation gives you a hands-on example. Two examples I built using the user interface API, and so one example is the one I mentioned is like a list view. I visualized a list view in a different way, just to give you that idea. And the second one is, whenever you have a picklist value on a record and you want to change this value, it's just a dropdown. But what if I want to visualize it differently, for instance, like a
[22:07] tile bar? So say I want to have I have an account and you have the rating like hot, cold, medium, and so I want to see all these three values and I want to just highlight which value has been selected rather than just print. the the text value in the column, and these are the two examples I built. And just to to summarize, why I am very pleased about this combination with Lightning Web Components and the User Interface APIs. Lightning Web Components is an industry standard. They're using state-of-the-art browser technology. ECMAScript 8 is nearly fully supported, and which is kind of yeah very new implementation of ECMAScript. So you can use everything which is available in browser technology this day in Salesforce by building Lightning Web Components, and this includes like rich animations, CSS-free style sheets. You can visualize whatever you like. It's totally free without boundaries. But on the other hand, we want to respect the work of administrators in Salesforce. If they configure something for the user, of course, you want to respect it in your Lightning Web Components. And this is where the User Interface API comes into the game. So you have both the best of both worlds. Rich visualization, without boundaries with Lightning Web Components, and on the other hand, you respect Salesforce metadata,
[23:37] and so you're fitting perfectly into the picture of the Salesforce platform with the User Interface API, and this combination for me that is the real power. Thanks a lot. This is a really great conclusion. Thanks for sharing with us about the user interface API, Christian. Yeah, thanks for having me. Was fun and yeah, great to have you on this show. If you have any questions. Yeah, and I will put all the studying resources, the links to our show notes on this episode. Thanks, Christian. Perfect. Thank you very much.
[24:16] Hi, I'm constantly looking for good guests. If you have any guest recommendation, please reach me out. I'll make sure they are joining to the show to share their knowledge. Otherwise, thanks for listening to the show. I'll see you next Thursday.
