How to Use File Viewers in Noca Apps
How to use file viewers in Noca apps
Build a file viewer and load real files from Salesforce
A file viewer lets someone see a document right inside your app instead of downloading it. In this guide I build an invoice app with a PDF viewer, then wire it to Salesforce so the app loads the invoice fields on one side and the actual file on the other. I left the file loading out of the prompt on purpose so you can see every step. Here’s how to do it.
Watch & Learn
Follow these steps to build a file viewer:
Steps:
1
Write your prompt
- Describe the app, here it’s create an app with invoice fields on the left and a file viewer on the right
- Noca confirms the layout and builds a modern invoice app with a PDF viewer
2
Add an onload event
- Open Events on the page and choose On Load
- Create a flow so the file loads as soon as the app opens
3
Build a flow that reads the file from Salesforce
- In the flow, read the opportunity, then read its related files
- Add a component mapping node at the end to push the file into your app
4
Map the file into the viewer
- Point the component mapping node at your page and click Add Fields
- Map the file name and the version data so the actual file lands in the viewer
5
Go live and save
- Take the flow live, then bind it to the app
- In the versions panel, click Go Live on your latest draft
6
Preview the result
- Open the app and the invoice fields show on the left
- The file viewer on the right loads the real PDF straight from Salesforce
-
Back to top