Building a Monopoly app in Salesforce - part 2: Making a custom app and Lightning Pages

In the first episode in this series we built the datamodel in Schema Builder. By choosing this route we have not yet taken care of:

  • Create tabs voor these custom objects
  • Create Page Layouts for these custom objects
  • Grant access to the tabs, objects and fields

Let's do that in this episode.

Building a Custom App

First we will create a custom app for or Monopoly game.

In the search field in the left menu on the Setup home page, start typing App m. The menu options are filtered. Now you can quickly find App Manager and click it.

Click New Lightning App

In the next step, you can add Actions to the Utility Bar. These will be directly available no matter where you are within the app. We don't have any actions for this app yet, but we will likely return to this later to offer at least one screenflow via the Utility Bar. We will skip the selection of tabs for now, as we will create them in the next step. We will then link them to this app. Later, you can go back to the App Manager to change the order of the tabs if you wish.

The last step is to select which Profiles should have access to this app. We will skip this one as well because I want to grant access to the app via Permission Sets instead.

Creating Tabs

To create a new custom object tab, go to Setup and type Tab into the search field in the left menu. Next click Tabs .

Click the New button under Custom Object Tabs.

Choose the object and pick a Tab Style.

In the second screen you can specify which Profiles should have access to this tab. Because we will provide access only through Permission Sets, you can disable access to this tab for all Profiles.

In the third screen, you select in which apps the tab should be available. Deselect everything except the Monopoly app.

For the objects Player, Asset Group, Asset and Rule, we will also create tabs. For other objects I think tabs are not needed. The Rule tab will mainly be used while building and testing, but for the end users it is less important.

Designing Lightning Pages

Almost everything on a record page can be directly managed in the Lightning Page, so we are going to try and see if it is possible to no longer use the old-fashioned Page Layout at all.

Go to Setup > Object Manager and find the Board object.

Click the New button, select Record Page and click the Next button's custom label.

As for most solutions I build or configure, here too I will use a consistent naming convention. An acronym for the customer or app, LRP (Lightning Record Page), followed by the object name.

I always choose Header and Two Equal Regios. With this layout I can place record details and Related Lists alongside each other. Because half of the page width is available for Related Lists jou can use the enhanced view, that you can not choose when you have just the width of a sidebar. Enhanced Related Lists can show more than 4 columns and you have the opportunity to edit column widths, hide action buttons, choose how many lines to show and filter a subset of child records to be shown in the related list.

Let's use the Dynamic version of for all components we use, starting with the Dynamic Highlights Panel with Dynamic Actions.

You will not find the Dynamic Highlights Component under Components, but under Fields.

Because the Board will not contain every component I want to show, I will use different objects to explain some of them. You will notice this in the screenshots.

Dynamic Highlights Panel

On the Player object's record page I find the Cash Balance and Position the most important information from the record fields. Therefore I will drag these fields onto the Dynamic Highlights Panel Component on the page.

Another feature I want to use here is Conditional Formatting. I want to show a red warning icon next to the cash balance when that amount is below € 1,000.

We shall do this as follows. Click the Cash Balance field on the Highlights Panel. Click in the Conditional Formatting search field and click + Create Ruleset.

The final step for the Highlights Panel is to add the Dynamic Actions. For now, I will only include the actions Edit, Clone, and Delete. If we decide to add more actions later, we will revisit this.

You can see that you can configure the visibility settings for the entire Highlights Panel, each field on it, and each Action individually. This principle is consistent across all types of Components on Lightning Pages, and I will demonstrate it later in this blog with an example.

Tabs Component

To ensure users can easily navigate an app, it's important to choose a consistent layout for your Lightning Pages. I always use the same structure with two equal columns. Additionally, I make it a habit to place the Record Details on the left side and the Related Lists on the right.

Since you might occasionally need multiple tabs to add features like a Chatter feed to your page, I always use the Tabs Component, even if there is only one tab.

Field Sections en Fields

In the Details tab, I first drag in a Field Section, which I can name. In this section, I include the player's name, Cash Balance, and Position.

The Player's name must be mandatory, but the Position and Cash Balance fields should not be editable by the player through this page. To achieve this, you can set these fields to Read-only.

I did not make these actual fields Read-only, as the player will edit their during gameplay through a screen flow. Additionally, I want to retain the ability to edit these fields as an admin. To accommodate this, I include a second Field Section with the Cash Balance and Position fields, where these fields remain editable.

We will use Set Component Visibility to ensure that this Field Section is only displayed when the user viewing the page has a System Admin profile.

Throughout the series, we will likely edit Lightning Pages multiple times and conditionally set the visibility of Components or fields. When doing so, I will consistently refer back to this explanation.

Dynamic Related Lists

To add related lists, go to the Components tab in the left-hand sidebar and search for Related. Then you pick up Dynamic Related List – Single and drag this onto the canvas into the Related Tab Component.

For the Player, we need the Assets that the player owns.

The maximum number or telated records that you can display in the Component is 30. For more, the user must click the View all link at the bottom of the related list.

I want to sort the Assets by Asset Group so that the player can quickly see if they own all the Assets in a group, allowing them to charge higher rent.

In this related list, I would also like to display information such as:

  • Number of houses on this Asset
  • Whether the Asset is mortgaged

I’ll go ahead and create fields for that on the Asset object right away.

A checkbox named Mortgaged__c and a Picklist named Buildings__c. For the picklist, I want to use the same picklist values as the field with the same name on Asset Rent Rule.

To achieve this, we’ll navigate to the Buildings field on the Asset Rent Rule object and promote the picklist values to a Global Value Set. This Global Value Set can then be reused for the Buildings field on the Asset object.

Lastly we remove the New button, because we do not want players to start creating Assets themselves.

When you save the page, the Builder will ask if you want to set it as the default. You can do this for the entire Org (all apps), for specific apps that you select, or even per app, record type, and profile. I choose the second option. Our pages will be the default for the Monopoly app. We will not configure anything for profiles or record types.

After we have created some data in the next section, we can take a good look at how the different pages appear with data populated.

Defining permissions with a Permission Set.

We will create two permission sets: one for regular players and one for the admin or the bank.

Fields that players should never be allowed to edit, such as names, purchase prices, and rent rates, will be set to Read Only for regular players. Some fields need to be editable within a flow but not directly on the record page. For these, we have made the fields Read Only in the Lightning pages, but these fields must be set as editable in the Permission Set.

In addition to granting access to the objects and fields, we will also use the Permission Set to provide access to the Monopoly app and the custom object tabs.

First, we create the Permission Set for the Admin. Then, we clone it and set fields to Read Only in the cloned version for regular players.

In the lefthand menu, search for "permission" and click Permission Sets . Then click the New button to create a new Permission Set. We will name this first permissio set “Monopoly Admin”.

First, we will configure object and field access. Use the search bar to find the Board object. You willll notice that each object is listed here using its plural name.

Follow the link and click Edit.

Admins are granted full access, so for each object, you select the following:

  • Tab settings: Visible
  • Object Permissions: Modify all + Create
  • Field Permissions: Edit Access for the entire column

We shall do the same for:

  • Boards
  • Asset Groups
  • Assets
    • Make sure to select the custom object Asset. This is the second one. You can verify if you chose the right one as you see the fields belonging to this object.
  • Asset Rent Rules (no tab settings)
  • Positions (no tab settings)
  • Rules
  • Position Rules (no tab settings)
  • Players

Next, we click the Clone button and name our new permission set "Monopoly Player". Be aware to also change the API name.

For this permission set we will uncheck the following permissions:

  • Boards
    • Object Permissions
      • Create
      • Edit
      • Delete
      • View All
      • Modify all
    • Field Permissions
      • External Id
        • Edit Access
  • Asset Groups
    • Object Permissions
      • Create
      • Edit
      • Delete
      • View All
      • Modify all
    • Field Permissions
      • External Id
        • Edit Access
  • Assets
    • Object Permissions
      • Keep Read and Edit selected
      • Uncheck Create, Delete, View All and Modify All
    • Field Permissions
      • For the Building, Mortgaged and Owned by Player fields, make sure Edit Access remains selected
      • For all other fields Edit Access is unchecked
  • Asset Rent Rules
    • Object Permissions
      • Keep Read selected
      • Uncheck Create, Edit, Delete, View All and Modify All
    • Field Permissions
      • Keep Read Access selected on all fields
      • Uncheck Edit access for all fields
  • Positions
    • Object Permissions
      • Keep Read selected
      • Uncheck Create, Edit, Delete, View All and Modify All
    • Field Permissions
      • Keep Read Access selected on all fields
      • Uncheck Edit access for all fields
  • Rules
    • Tab Settings
      • Uncheck both Available and Visible
    • Object Permissions
      • Keep Read selected
      • Uncheck Create, Edit, Delete, View All and Modify All
    • Field Permissions
      • Keep Read Access selected on all fields
      • Uncheck Edit access for all fields
  • Position Rules
    • Object Permissions
      • Keep Read and Edit selected
      • Uncheck Create, Delete, View All and Modify All
    • Field Permissions
      • Keep Read Access checked for all fields
      • Keep Edit Access checked for Index
        • The user needs to update this field value when a used Chance or Community Chest card is returned to the bottom of the deck.
  • Players
    • Tab Settings
      • Available and Visible stay selected
    • Object Settings
      • Keep Read, Create and Edit selected
      • Uncheck Delete, View All and Modify All
    • Field Settings
      • Keep Read Access and Edit Access selected for all fields where you can.

Next episodes in this series

In the next episode, we will focus on importing data to bring our app to life. After that, we'll dive into the Flow Builder to set the game in motion.

I can anounce the following blogs

  • part 3: Importing Data - thursday 13 february
  • part 4: How does the player move around the board? - thursday 27 february
  • part 5: What happens when aPplayer arrives at a new Position? - thursday 13 march
  • part 6: Chance and Community Chest - Thursday 27 march