 Okay, going live. Hello, everyone. I am Sanjay Gupta. I welcome you on Sanjay Gupta Tech School. I have Abhishek with me for one more session. So welcome Abhishek on the platform. First of all, so Abhishek will be delivering like last scenario session. So this is episode 12 and in this session as on the slide you can see today he will be explaining all four components, data rector, integration, procedure, omniscript and flex card. So flex card will be new for you in this session, in this season, because this is for the first time he will be introducing flex card and will tell you how you can use flex card in Omnis Studio along with DR, IP and omniscript, right? So with this session, like all the scenario based sessions will be completed and we will be having two project sessions in the next month where we will be having some scenarios and he will be implementing those in front of you so that you have the project understanding as well, okay? Because in these sessions we explained things in pieces, but in those project sessions everything will be implemented end to end. So those will be helpful for you, right? So I think we can move forward. So Abhishek, if you can talk about you a little bit. So hi everyone, myself Abhishek and I'm working as a host velocity developer since five plus years now. And I have done some certifications around velocity as well as on Salesforce core and some certifications around velocity are Omnis Studio developer, industry speaker developer and there is one more called health coding developer. And there are some certifications on Sage code as well as you can see on the screen. So yeah, that's all about. Okay, thank you Abhishek. And moving forward, if you want to become part of a community where lots of experienced and freshers are connected, their learnings is for sharing their knowledge. So you can scan this QR code. And if you want to share some reviews or feedback through YouTube or LinkedIn, so you can follow Sanjay Gupta Tech School and please share the reviews and whenever you do the certification tag Abhishek so that he can feel proud like with his knowledge, people are learning Omnis Studio and clearing certification and upskilling their career. Okay, so with this note, let's jump on to the scenario now. So as you can see, like we will be having all four components together. So it will be a bigger example. And it is in continuation with one example that he already explained using Omniscript IP and DR. So over to you Abhishek. So just give a little insight of that previous implementation and then just let people know how we can introduce flex card. Yeah, sure. So I mean, like in the previous session where we executed the Omniscript IP plus DR, in that example, what we did, so I'm going to show it from the org itself. I mean, like what exactly we did in that. So let me go to the Omniscript that we created into the previous session. So this was the Omniscript that we created into the previous session, where in the first step, we were asking user to select the object for which he wants to see the data. And then in the IP, we were passing the whatever value has been selected into the first screen. And in that IP what we were doing, we had some conditional block. If object is equals to account and execute the data vector of account, if it is contact, then execute the data vector of contact. And in the response, we were saying that if object is account, then give me the data from the DRE account and otherwise give me the data from DRE contact. And in the Omniscript again, we had two screens. First is for showing the data from for the account with the conditions where we were saying object is equals to account and second screen is for the contact. So these two screens were conditional. Now, what we're going to do is, rather than showing the data into the Omniscript itself, we're going to show the data into the flex card. The reason why we are doing this, because if you go back to the IP and open the data vector, we have added one condition in that, I mean, we are always retrieving only one record with the limit parameter or the limit parameter. The reason, because in the Omniscript, we can only show one record at a time. But now what we're going to do with the help of flex card, we're going to use a data table. So if you are aware of LWC components, we use data table to show n number of records. So that sort of functionality we're going to build into the flex card and show all the records fetched by the data vector. And another thing is what we're going to do is, so I'm going to start my, so this is the brief introduction for the previous session. And for today's session, what we're going to do is we're going to read the object name from the first screen, which is a counter contact. And then we're going to pass the value from Omniscript to flex card. And in that flex card, we're going to call that IP. So we're going to remove this IP, we're going to remove this screen, this screen, and we're going to introduce a new screen, which will be calling the flex card. And in that flex card, what we're going to do is we're going to pass the parameter from flex card to IP, which is getting passed from the Omniscript. So the flow is like, you will read your parameter from Omniscript, object name, account or contact, then you will pass it to the flex card. And in the flex card, you will call the IP. And from the flex card, you will be passing the object parameter. Correct. And so I'm going to begin this session with the introduction of flex card. How do, what is flex card and how do we use it? So I mean, like, you must be aware of flex card already, because we have covered it, covered this topic into the previous season, but I'm going to give you a brief introduction again. So basically this name and title is your flex card name. So let's say I'm going to call it, call it like fc underscore show, account or contact record contacts. So you can keep the same name as title as well. And there are two themes, lightning and new port. And so we're going to go with the lightning of course, because we are from the starting, we are working on lightning only. And if you want this flex card to be a child flex card, so what does that mean? If you turn this on, then this flex card can be used into the, into any other flex card. If you keep this flag as off, then you cannot use this flex card into any other flex card. This is your author. You can give it anything and then description. And as soon as I click on next, that is the second step called a select data source type. So basically what data source you want to select to show the data into that flex card that you can select. So basically you always use your flex card whenever you want to show some sort of data into the onto the UI. So there are various, various number of options like SQL query, SOSL, Epics, remote, REST, data refter, IP, streaming API and custom. So for our case, what we have to do is we have to call the IP, correct? Because we will be calling the IP from data refter and passing the object name. So I'm going to click next. Then what I'm going to do is I'm going to call the same IP that we are calling from your own script. So I think that name is IP fetch account or contact, right? And okay, let me open this into the another tab so that we can see what our IP is doing. Let me go to the IP. Yeah. So in the IP, I think we are expecting a parameter called as object. Yeah, this object. So we have selected our IP name and from the input name input math, we can pass the object name. Okay. So let's say right now, let's say I'm going to hard code it. After that, I mean, like once we move on, I'm going to make it dynamic as well. Contact. So we are passing the value contact into the object parameter, which is expected into your IP. And if I click next, and let's save the flex card now and it will create a flex card. Okay. And so basically, this is the structure of the UI of your flex card. This version clone activate preview are similar to your own script. This is your structure parameter where you will be able to see your UI, whatever elements that you are using into the build, you will be able to see many, many things like action, block chart, custom LWC. So almost everything which is available, which is available into your IP, which is available into your omniscript, all the things will be available here. There are some new things introduced by flex card, like which is your data table chart. You can show some sort of chart and kind of icon thing that also this is kind of new image, this is new. So this is all, all these things are, you know, introduced into the flex card as a new elements that you can use. And in the input, all things are same, like checkbox, currency, date, date, time, all similar things that we have into the omniscript. If I go to properties, so basically your flex card, so you can compare this thing as your step into your omniscript. So whenever you will be creating a flex card, you will be having an active, I mean, like this whole thing called it as a state. So you can have multiple state. So like if I want to replicate it, let's say I'm going to call it active one, click on say. So there will be a new state. So I mean, like we can show multiple state conditionally, I can add some sort of condition and do my things. But for this example, we don't need state, multiple states. So we can go with the one only and into the style. So yeah, this is the best part of your flex card. Whenever you are working with the flex card, if you compare with the omniscript, you can give some sort of CSS properties with the configuration. Like you can set the height for your flex card, minimum height, maximum height and all these things. I mean, like you can check the other configurations by yourself. But yeah, I mean, like there are so many things that we can do with the configuration on the CSS site. And if I go to setup, again, this is, this is a flex card. I mean, like you can update your data source into the setup. Like I mean, like when we were creating our flex card, we selected IP. If you want to change it later on, you can do from the setup, you can select anything else if you figure out something else. You can pass the parameters, you can do all the things. And some other things are like, I mean, like, as we go into the session ahead, I will explain you some other things, other options like this repeat option. I will explain you this omniscript support, multi-language support and all these things. So right now what we did is we called the IP, we passed the parameter as contact, which is your hard coded parameter right now. And for just testing purpose, what we can do here is we can click on this save and fetch button. And as soon as you will be, you will click your save and fetch button, your IP will get called into the background. And if you go to the JSON, you will be able to see that your result is coming from your IP. So this is your contact name. Let's say I'm going to make it as account. And if I click again again, then my one account record is coming. Okay, so let's do one thing. We're going to remove the limit now because we don't need it anymore. And similar to the similar for contact as well. For contact, we already don't have any limit. Let's go back to the Lex card. And if I click on refresh, yeah, it is still returning one record only, right? Yep. Let's execute it from hell on the IP. Yeah, here also only one. Okay, so I mean, like into the debug it is giving all the records, but from the response, it is giving only one. And what's the reason for that? This object is equals to this. Then give me all the records from your DRE account counts. And I think if I do it for contact. But in the locks you're having, so why not in the response? Yep. So that is what I'm trying to understand. But let's see if object is equals to this can give me all the things from, okay, let me create a version for this IP. And if I do it again, okay, it is coming as one. I go to the additional output. And let's do that. Account cool and this cool and this because our conditional block conditionally block element name is account and content. So let's I'm just, this is just a guess. I'm not sure whether it will work. Okay, it didn't work. No worries. Let's have it. Can we, yeah, just check once. Yeah, here it is showing the data. And yeah, okay. So what we can do to fix this problem, I think we can use one set values. Not sure. I mean, like, again, this is a try, but let's try to do that. So here I'm going to say a result and same thing. If object is equals to account, then we need this, then we need this. Then okay, set value, then we'll be passing here instead of right. Okay. So if I click execute now, set values is giving me, okay, no, it's still give me one, only one output. No problem. I think I will figure this issue out later on. But for just now, what we can do here is we can have multiple responses, response account, and which will be again conditional response contact. And from here, we're going to remove it. And here we're going to say drd underscore contact. Correct. And same for this, we're going to remove this. And here we're going to say drd account. So now if I go and click configure, it should give me all the results. Nothing came. So I think something wrong with it because earlier it was working. This is the problem with this. Sometimes I mean, like it takes some time to execute those few simple scenarios. In drd underscore account, we are getting the data, but why it is not showing? I mean, like as soon as I enable this one, then this drd account is not getting executed. That's the problem. They directly execute the strange. So have you created a new version and activated that one? No, I have created a new version. I mean, like, okay, I have one more option to execute this one. So what I'm going to say, I'm going to put it here. So drd account. And what does I'm going to say, contact. So we're going to have two responses, but they will run traditionally. Let's activate this version and let's go back to the flex card. And go here again. If I click on save and fetch, it is giving me all the records now. Right. Because we have modified it. And if I pass the contact, it will give me all the contact records. Right. Yeah. So now how do we show this? All the things into the data table. So you just need to search for data table. You can just drag in, let me expand, and you can just drag and drop this data table here. So as you can see, as soon as you have dragged and dropped the data table, all the records that we are that they are fetched from your IP now visible into your flex card. And I mean, like, so if you click on this column, you will be able to see the mapping as well named, which is coming from your IP. Okay. And whatever data is coming from your IP that will be saved by default into the records. So if I remove this, then nothing will get displayed. So for showing the records, I have to do this. Now, if I go to preview, right, or just checking what exactly we are able to see onto the screen, you will be able to see one problematic thing over here, which is like, okay, let it visible first. Yeah. So all the contacts are coming. And if you scroll down again, again, the contacts are getting repeated, right? And the reason is there is a setting called in your flex card, repeat options. This. So if you deselect this repeat option, so basically what it is doing that, let's say you are able to fetch 10 records from your IP. So that data table will repeat 10 times if you enable this option. And in each data table, though those 10 records will be visible. But as soon as you deselect this one, if you go to the preview and now if you see this again, then the data table will come only once and all the records will be visible into a data table. I think the string got saved. Now if I press AB12. Yeah, I think it is repeating. Yeah, Sanjay, you want to, yeah, you're right. Let me go to design again. I mean, like, this is the, but if we, if I talk about the, you know, that this is the, I mean, like one of the most buggy product that Omni Studio have, which is your flex card. Till Omni Studio, everything works fine. But as soon as you work with flex card, this is a buggy product from the Salesforce to be very honest. So most of the time you will get frustrated why it is not working. That's the problem. Yeah, but here it is showing correctly, right? In the pop up, but here it is. Correct. I think it's still, okay, I think this is not working, but this is, I mean, like, this is the, this is one thing that we can skip for now because. Yeah. So we just need to enable, disable that chat box for repeat. If we want to repeat, we can enable otherwise we can disable. Correct. I think no, we don't need this because it was previously coming. Results. Yeah. Okay. So now what, now the other thing is that we want to pass this value as a dynamic value, right? So what we can do here is we can create some sort of parameter in this flex card. Let's say you want to call it as object name. And as soon as you you will put something into the curly braces, there will be a test parameter will get created automatically. So now I'm going to type the contact and if I click save and patch, I will still be able to fetch the values. So the benefit of these, this thing is I can use this parameter into the omniscript and from the omniscript, I can bind the variable. I can bind this variable, this object variable. Correct. So that whatever we are selecting, it will get passed automatically to your flex card and into your flex card. Then the bindation will pop dynamically. So this is just a test parameter, whatever we will be selecting into the omniscript will get passed to the flex card. So till now, we are half done with the flex card, we'll go back to the omniscript now. And I'm going to create a new version for omniscript and I will start removing the other things to incorporate the flex card into the omniscript. So we don't need the IP call. We don't need this one. We don't need this one. And I'm going to drag and drop one step. Okay, so you mean to say all the DR IP we called in flex card? And now flex card we are calling an omniscript. Correct. So let's call this main step is record for now. So and yeah, flex card will be always part of this omniscript. We cannot call omniscript in flex card. We can do that as well. Okay. I mean, like this is one of the example that we will be seeing into our project implementation. Okay, okay. Okay. So and for calling that flex card, we have to drag and drop custom LWC component from the build panel. Because whenever you will activate your flex card, it will be created as LWC component. Okay. And now you can copy your flex card name and you can search over here into your omniscript. But for now it will it will not be visible. I mean, like it will be visible, but it will not work with the reason is because we haven't activated our flex card. Right. So I mean, like this is the way of calling your flex card from the omniscript. Now second part arrives how to map how to map this object name parameter that we have in our flex card with our omniscript. Correct. So what we have to do over here is go to your custom lightning back component properties on whenever you are calling your flex card. And in your property name, there is there is a documentation as well that we will be sharing. There is a documentation as well. So from your custom lightning back components, you have to type parent hyphen attribute attribute. Okay. And in your property source, you can bind your variable. So basically I'm going to bind the whole step, which is your choose object. Okay. So basically what I did is in the parent hyphen attribute, I have bind the choose object step. And in that choose object step, I have a I have a element called as object and that thing. So basically this choose object, whatever we have into the choose object step that will get passed to your flex card. Make sense. Then now what will happen? We're going to go to the flex card again. So basically right now, we have created this object name parameter, but from our flex card, we are passing some sort of parent hyphen attribute thing. So how to access that thing into your flex card, the syntax for that one, I mean, like that is again, documentation part that we will be sharing. But when you are passing the data from your omniscript in the form of parent hyphen attribute over here, you have to write parent dot whatever element you have. Which is your object. So basically in your choose object, you have one, you have one element called object. And you have binded your choose object step to your flex card. And in your flex card, what you are doing is for getting the values from your omniscript, you have to start with parent dot, then whatever element name that you have into your flex card into your omniscript. So I'm going to remove this. And in this one, I'm going to type the contact. I'm going to click save and pass. I will be receiving all the records. And now I can activate my flex card. I'll explain this whole functionality, how we are passing the data once we have built the whole functionality. Then I can click on done. Now I will go to my flex card. And from my flex card, if I if I'll refresh this once, we'll again go to the omniscript we have. So now, as you can see, there are two things coming. First is your flex card name, CFFC. I mean, like CF is added by Omnisudio by default. And then FC underscore your flex card name and then flex card name hyphen m hyphen author. So let's say if you have multiple multiple versions of your flex card, then you can select particular version as well. And if you select the top most, then always the active activated version will get selected. Okay. So for now, I'm going to go with let's say this hyphen one. And if I go to preview, I mean, like that's the knowledge noise, the part when we'll see the results, select, let's say I'm going to select the account, I'm going to click next. As you can see, the flex card is not getting visible. It is coming as that custom lightning web component. The reason whenever you are using any flex card into your omniscript, you have you have to activate your omniscript, then only your cost flex card will be visible into the omniscript. Now if I preview, I hope it works because there is a product from Omnisudio for the flex card, which will let, which never works on the first time on click off next. Yeah, it's working. So as you can see, I selected the account for now. So all the accounts are coming Sanjay AB1 to all these things. And let's say I'm going to select the, oh, I think I selected the contact. Yeah. Now I'm going to select the account. And if I click next, no, I didn't, I selected the contact. Now I'm going to select the account. Is it working as I think both are showing same results. Yeah. So I think this is the problem we have in our DRI contact, DRI account. Okay, let me go to the flex card. And let's say I'm going to preview it. So for contact, it is showing the contacts. And let's say I'm going to do the account. Okay, here it is working fine. I think I also I have got it. What's the problem with this? So I'm going to create a new version for now. Because whenever you are using a flex card into your Omniscript, you have to check one more checkbox, which is this Omniscript support. This is the another configuration that you have to do. And if I click save, which should get saved. And I'm going to activate it into your Omniscript. I mean, like as I have selected the first version, now I have to select the second version, because I have created a new version of your, of the flex card. Click this. Yeah, as you can see, second version is also coming. I'm going to activate this. Another issue of Omniscript, what we have to do is now we have to clone our Omniscript. Okay. I mean, like this is the, this is the most confusing part for me as well, whenever I'm working with Omniscript. So why this version is not working? It is like internal issue or? It is an internal issue. So basically, when you are using a flex card into your Omniscript, and when you click, when you create a new version of your Omniscript and activate it, and if you reprieve it, it will always show that your Omniscript is deactivated. Now you have to clone your Omniscript. I'm going to change the subtype and it will clone my Omniscript and that's activated. That's why people do not use flex cards very frequently, but it is a powerful tool, I must say. I mean, like Salesforce have to work on the product side for flex card, but it's a powerful tool if these sort of errors will not come. Let me select the account, click next. Now I can see all the accounts are coming and if I select the contact, all the contacts are coming, right? Yeah, I have one question. We fetched only one field, so one column is there. If we fetch two fields, so in this data table, automatically two columns will be created? No. So first of all, we have to create a mapping into the data rector, exactly, right? Then you have to create a new version of your data rector, sorry, your flex card, and you have to edit your data table and add the new column into it. Okay. That's the understanding and okay. So I mean, it must be very confusing how I did all the configuration and the solve, so I'm going to explain it one more time. So first of all, simple, we have created a step. We have added one pick list named as object and added two values into it, which is account and contact. Then we created one flex card and in that flex card into the setup, we called our IP which was already created and that IP is expecting a parameter called as object and in that object, we have to pass the value which we are selecting into our openness card, into this pick list field. Okay. So what we will do is, what we are doing is into the next step, we are calling our flex card with the help of custom lightning web component element from the build and we have selected our flex card name and into the custom lightning web component properties configuration. We are passing this parameter parent-attribute and in that parent-attribute, we are passing the step which is your choose object and your choose object step contains one element called as object. Now, if we go back to the flex card, into the flex card, as a parameter, what we are doing is for fetching the values from your own script, we have to add this keyword called parent and after that use the dot operator and after that you can use the object and this object is your element name which is in your own script, this object. So this should match and then in the flex card, we are using a data table and in the data table, we have created the mappings for the name field because we are only having name right now and after that we have activated our own script and then from the preview, what is happening? We are selecting any value and this value, as you can see in the choose object, we have one element called object and as soon as I click on next, this object is getting passed to this parameter parent.object and it will be replaced with whatever value we are selecting into the own script and it will get passed to your IP and that IP will give you the results and in the data table, all the values will get set and also if you can see, the values are not getting repeated yet. It was only happening into the flex card. So checkbox is working here. So I just wanted to clarify that it's a product issue. I'm not saying this for the sake of staying on to the live stream, it's a product issue that you can see, it's not working on to the flex card preview but it's working on to the own script preview. It is a complete example which is bundled as an open studio tool, flex card, IP, VR, own script. Yeah, I think makes sense and it is very challenging and we need to pause and implement. Without implementation, I don't think it is understandable. Okay, so I think it is very helpful and maybe once we do the project session, so then with the help of these knowledge, like whatever you shared, those projects will be very much helpful. So guys, please practice all these scenarios in order to understand the project, right? So we will be having those sessions in the April month. So I will share like recordings, sorry, I will share the live streaming links with you whenever we will be having the sessions and if you are watching the recording, so once it is done, you can go through the recordings and implement the project step by step so that you can mention those in your CV also, like you have done some sort of POCs. Okay, so I think with this note, we take your leave. Thank you Abhishek for delivering the session and thank you for joining the session live or if you're watching the recording, thanks to you as well. Okay, see you in the next session next month with project implementation.