# Using predefined resources

Learn how to use predefined resources with ActiveReportsJS Report Designer

## Content

During the report design process in ActiveReportsJS, users may need to access pre-defined resources, such as images and reports, for various controls and actions. Below are the key points where predefined resources can be provided.

1. **Image control's Image property under the Shared tab** – For more details, refer to the [Image Control](/activereportsjs/docs/v6.1/ReportAuthorGuide/Report-Items/Data-Visualizers/Image) page.
2. **Subreport's control Report Name property** – See [Subreport Control](/activereportsjs/docs/v6.1/ReportAuthorGuide/Report-Items/Supplemental-Report-Items/Subreport) for further information.
3. **Jump to Report Action parameters** – Visit the [Drill-through page](/activereportsjs/docs/v6.1/ReportAuthorGuide/QuickStart/get-started-with-analytical-reports/Get-Started-With-DrillThrough-Reports) for more details.
4. **Master Reports list for Set Master Report and Change Master Report** – Available from the Report tab of the application bar. For further information, visit the [Master Reports](/activereportsjs/docs/v6.1/ReportAuthorGuide/master-reports) page.

`Angular`, `React`, and `Vue` Designer components expose several properties for handling resources:
* The `imageList` property accepts an array of [ImageResourceInfo](/activereportsjs/api/v6.1/modules/ReportDesigner#imageresourceinfo) objects, allowing you to manage available images.
* The `reportList` and `masterReportList` properties allows you to manage available reports in the designer UI.

Each resource must have an `id` (a resolvable URL). Optionally, you can provide a `displayName` to show in the UI.
In pure JavaScript applications, the [setResourceProvider](/activereportsjs/api/v6.1/classes/ReportDesigner.Designer#setresourceprovider) method helps manage available resources, such as images and reports, dynamically. You can register resources by passing a [ResourceProvider](/activereportsjs/api/v6.1/interfaces/ReportDesigner.ResourceProvider) object containing `getImagesList`, `getMasterReportList`, and `getReportsList` methods, which return `Promise` objects that resolve to arrays of the corresponding resources.
For comprehensive examples and live code samples, explore the [Live Demo page](https://developer.mescius.com/activereportsjs/demos/features/designer-resources). These demos cover implementation for Angular, React, Vue, and pure JavaScript applications.