[Music] foreign [Music] let's have a look at new record templates and new capability in the November store release new record templates will make it easier to extend CSM configurable workspace in two ways first we've introduced the construct of controllers and presets now when certain components are added to a page the configuration will automatically get set second we have taken the monolithic layout of the detail page and broken it into smaller sections this means that components such as forms compose and the activity stream can be added removed and moved at will these changes will make the lives of admins and developers easier let's take a look in this first demo we'll start from a blank page drop a form component on the page and then we'll use the presets to configure the form you'll get a sense of what configuring a page is like with and without presets you'll see how controllers are used to set component properties set up events and bind data resources so let's go ahead and hit create and we're going to go ahead and create a blank page we're going to go ahead and give the page a name and we're going to add a component to the page in this example we're going to go ahead and we're going to add a form component to our page and we're going to go ahead and save early saved often in uib and you'll notice that we have a very basic page you also notice that none of the configurations have been set over here and if we click on events no events have been associated with the page and the component and for the data sources it has not been associated with any table or API you also notice that there are no State parameters or there are no scripts as well so things are looking a little Bleak for our page but what we're going to do now is we're going to apply presets so I'm going to click on this drop down and I'm going to say that we want to apply the record form preset and we're going to go ahead and give it a table in this case we're going to base it on the case table and we're going to go ahead and paste in a sysid and we're going to go ahead and we're going to use the preset and it's warning us that if you have set anything up manually previously that it will be clobbered or erased so we're going to apply that and we're going to go ahead and save early saved often and now what we want to do is go ahead and Associate this with a specific table let's go ahead and choose that table and once again we will associate with a specific record ID and we're going to go ahead and hit save and now what you'll notice is that the form has been fully configured and under configuration settings here you can see that all the properties have been set more importantly you'll notice that a whole bunch of events have been automatically created so these are events for selected notification actions and things of that nature over here under data sources we have Associated it with a specific table and of course if there were client state or scripts those would also get Bound in as well the other thing that we want to do here is we want to now go and add another component to our form so I'm going to go ahead and click on ADD and you'll notice that when we go to add components that there's certain components that are highlighted in this green kind of background and what uib is telling us is it's saying hey these are components that if you add them to the form presets will automatically apply so in our situation what we're going to do is we're going to go and add the ribbon to the form and the presets will automatically apply I simply double click on it and you'll notice that the ribbon has now been instantiated on the form and all of the properties of the ribbons have been set the events have been set as well as the record so there you have it uh a bit under the hood how we make it easy for admins and developers to leverage existing components with presets and we really flatten the learning curve for them because now they can just leverage these components without having to know the inner workings of each of those respective components so in this second demo we're going to do something that most customers want to do that is they want to be able to move components such as the compose or the activity stream around the page layout so for example they might want to have the compose appear on the left hand side here they may want to have the case detail disappear off the canvas altogether and perhaps add it over here on the sidebar and this is exactly what we're going to do as in this demo so let's go ahead and show how this could happen over here you'll notice that we have a variant of the standard default record page and what we want to start by doing is we want to go ahead and start by adding a new tab within the sidebar component so we're going to come over here and we're going to click on ADD it's going to be an empty container and we're going to go ahead and click next we're going to give the tab a name we're going to call it the case form and we're going to go ahead and just select a basic icon for it and we're going to go ahead and hit create so what we've done is we've added an additional tab the tab appears here at the bottom so what we're going to do is we're going to drag and drop that up to the top so it's the first tab that appears on the sidebar and the next thing we want to do is we want to add a component to that tab because right now that tab is empty so we can use the search here on the side and we can go ahead and search for that case form that we just added and it's a case form and it's empty so we'll go ahead and click on ADD component and we're going to go ahead and add a form component which we get a warning that there's some presets associated with it life is good we're going to go ahead and hit those presets because presets are fun and Powerful and we can go ahead and hit save on this now so far we've added a new tab we've associated with a form but what we haven't done is we haven't gotten rid of the original case form nor have we moved the composer over so let's go ahead and show you how that can happen so down here you'll notice that on the left hand side we have the case form and we're going to go ahead and delete the component for the case form so that's going to go away and then the next thing that we're going to do is we're going to grab the activity stream compose and we're going to drag and drop it this is a new capability in the November store release and we're going to release it onto the left hand panel and then what we're going to do is we're going to drive the grab the activity stream and we're going to drag and drop it and we're going to release it on the right hand side now our stackable side panel is a little bit boring now because there's no components associated with it so what we're going to do is we're going to go ahead and delete that stackable side panel all together and we are going to go ahead and hit save so if life is good what we should now see in the runtime is we should see that the components have moved themselves around in a moment here what we'll be able to see is we will see that on the left hand side we now have the compose and this is a fully scalable kind of window in the middle we have the activity stream which is also fully scalable and on the right hand side we have the case form that we added as a tab to the side panel and you'll notice that we can click on the different icons on the side panel to adjust that so this is a very powerful illustration of how we have taken that monolithic page layout and broken It Up made it more Atomic so you can move components around and it's also a wonderful illustration of how easy it is for an admin or a developer to change the default layout of a page to match the needs of their end users thank you