Academy Lesson: Server-Side Data Filtering & Record Mapping

Building dynamic dashboards often requires creating logic to safely request, filter, and render specific rows of data from a backend server. In this lesson, you will learn how to use Noca’s visual orchestration graph to construct multi-step database routines that fetch live Salesforce CRM data, filter it using active session context, and automatically map records right onto your user interface.

Step 1: Open Your Page’s Lifecycle Event

Rather than managing fetch requests inside your layout properties, Noca structures backend operations directly inside visual lifecycle events.

1. Open your Noca Web workspace and navigate to your OpportunitiesPage dashboard view.

2. Head to the top right of the editor and open the Events panel.

3. Click into your page’s master On Load flow event to open the visual orchestration flow canvas.

Step 2: Inject a Native Salesforce Connector Node

Noca comes out-of-the-box with various ecosystem connectors. Let’s wire one up to your live data repository.

1. Click the center plus node on the orchestration workspace to create an event block.

2. In the node picker modal, search for and select the Salesforce integration block, then click Next.

3. In the parameter configurations panel on the left, set your configurations:

   • Connection: Select your active Salesforce sandbox instance.

   • Action: Choose Read as your primary action state.

   • Object: Select Opportunity as your target database dataset.

Step 3: Apply Dynamic Context-Aware Filtering

To ensure sales agents only see records explicitly assigned to them, we need to bind our query to the logged-in user’s active session profile.

1. Scroll down the left configuration panel and drop open the Condition adjustments section.

2. Set your matching clause criteria: target the database field “Owner ID”.

3. Move to the right-hand sidebar and open your Data Kit panel.

4. Expand the Session App Fields menu to view your active application user session cookies.

5. Simply click, drag, and drop the User ID data pill straight into your matching condition row back on the left panel.

Step 4: Add an Interface Mapping Block

Once Noca successfully reads the filtered database records, you must instruct the event graph where to display the loop payload.

1. Click and drag a success edge line out from the right side of your configured Salesforce node to initialize a new terminal event block.

2. In the search field, type in Mapping and choose the Interface Mapping block.

Step 5: Wire the Backend Fields Directly to UI Elements

The mapping node lets you pipe complex array lists straight into repeating layouts without creating manual loop arrays or custom state handlers.

1. Under your mapping properties, point the interface target dropdown straight to your OpportunitiesPage structure.

2. Select your main dashboard grid container: the Table Body component.

3. Check off the target dynamic table cell elements you want to feed. For this lesson, click the check boxes next to:

   • ID Tags

   • Opportunity Name

   • Account Name

   • Stage Tags

   • Priority Ratings

   • Close Date

   • Financial Amount

💡 Pro-Tip: Because this workflow operates entirely server-side inside Noca’s secure graph orchestration layer, your app remains exceptionally performant. Noca will automatically execute this layout routing workflow on page wake, loop through thousands of database entries, and populate the frontend UI asynchronously!