Assigning multiple source collection to the Calendar

Overview

The Calendar component is designed to help display resources and events in the calendar visually and in a well-structured format. With its interface and customizable features, the Avonni Calendar offers seamless integration and an organized presentation of your data, visually streamlining event and resource management.

Let's dive into this tutorial to connect multiple source collections to the Calendar component.

The Calendar component only supports multiple collections for events. Only one collection can be associated with a resource

Step 1: Creating your source collection

Initiate the creation of your source collections: Before assigning several source collections to the Calendar component, build the collections you wish to utilize. Within the Flow Builder, employ the 'Get Records' element to generate your collection variables (e.g., Collection1, Collection2, Collection3) to fetch data from multiple sources."

Step 2: Adding the Avonni Scheduler Events action

In this step, you will add the SObject Collection to Scheduler Events Avonni Action to your flow. This action allows you to convert your source collections into a format compatible with the Calendar component.

1. Add an Action element: In the Flow Builder, click the + sign and select "Action"

2. Select the Avonni category: In the filter panel for the Action element, select Avonni.

3. Choose the SObject Collection to Scheduler Events: In the Avonni category, select the 'SObject Collection to Scheduler Events' action. This action will enable you to transform your source collections into a format compatible with the Calendar component.

Step 3: Configuring the action

In this step, you will create your collections using the 'SObject Collection to Scheduler Events' action added in Step 2. You will select the corresponding Get records collection created in Step 1 for each collection and map the data accordingly.

1. Configure collections: Create your collection within the properties panel of the 'SObject Collection to Scheduler Events' action. You can create up to 10 collections.

2. Select Get records collection: For each collection, click the 'Add Collection' input field and select the appropriate Get records collection created in Step 1. This step ensures that each collection is associated with its corresponding source collection.

3. Map the data: Specify the fields displayed in the Calendar component after selecting the Get records collection for each input field. This includes fields like 'Title', 'Resource Name', 'From', 'To', and others, depending on your specific use case. Be sure to map these fields from the source collection to the corresponding input fields in the action. This process ensures the data is correctly formatted for display within the Calendar component.

Step 4: Configuring action advanced settings

In this step, you'll set up advanced settings for the 'SObject Collection to Scheduler Items' action to manually assign variables and create a new variable resource.

• Access Advanced settings: Click on the 'Advanced' link within the properties panel of the 'SObject Collection to Scheduler Items' action to access the advanced settings.

• Enable manual variable assignment: Check the box next to "Manually assign variables." This option allows you to create a new variable resource and manually define its properties.

• Create a new variable resource: Click on the 'New Resource' button and enter an API name for your variable. This name will be used to reference the variable throughout your Flow.

• Set Data Type and Apex Class: In the 'Data Type' field, select 'Apex-Defined.' Check the box next to "Allow multiple values" to support multiple records for this variable. Then, in the 'Apex Class' field, select "avcmpbuilder__SchedulerEvent" from the dropdown list.

• Save your changes: Once you've completed the configuration, click the 'Done' button to save your settings.

Step 5: Adding and configuring the Calendar component

In this final step, you'll connect the Calendar component to the Apex-Defined variable created in step 4, enabling it to display data from multiple source collections.

1. Add a screen element with no header and footer

2. Drag the Calendar Component into our screen

3. Open the Calendar component: Locate it within your Screen Flow and click on it to access its configuration settings.

4. Access the Data Source section: Navigate to the 'Data Source' section within the properties panel of the Calendar component.

5. Select Variable: From the 'Data Source' options, choose 'Manual' to specify that the component should use the Apex-Defined variable you created earlier for the events.

6. Choose the Apex-Defined variable: In the dropdown list, select the Apex-Defined variable you created in step 4. This will connect the Calendar component to the variable containing the combined data from multiple source collections.

7. Save your changes: Click the 'Done' button to save your settings and finalize the configuration.

Congratulations! You have successfully added multiple source collections to the Calendar component. These steps enabled the component to display data from various source collections.