<?xml version="1.0" encoding="utf-8"?>
<configuration>
    <connectionStrings>
        <clear />
        <add name="Telerik.Reporting.Examples.CSharp.Properties.Settings.TelerikConnectionString" connectionString="Data Source=No Local Servers Found!;Initial Catalog=AdventureWorks;Integrated Security=SSPI" providerName="System.Data.SqlClient"/>
        <add name="{theName}" connectionString="{theConnectionString}" providerName="Npgsql" />
    </connectionStrings>
  
    <Telerik.Reporting>
        <AssemblyReferences>
            <add name="Npgsql" />
        </AssemblyReferences>
    </Telerik.Reporting>
</configuration>

See screenshots.

In the c:\Program Files (x86)\Progress\Telerik Reporting 2024 Q1\Examples\Data\AdventureWorks OLTP\ folder, there is an instawdb.sql that creates and populates the AdventureWorks db. There is no AdventureWorks db in my local SQL server installation. Should I/can I run this script manually?

ng add @progress/telerik-angular-native-report-viewer

"dependencies": {
    "@angular-devkit/schematics": "^16.2.12",
    "@angular/animations": "^16.2.12",
    "@angular/cdk": "^16.2.14",
    "@angular/common": "^16.2.12",
    "@angular/compiler": "^16.2.12",
    "@angular/core": "^16.2.12",
    "@angular/forms": "^16.2.12",
    "@angular/localize": "^16.2.12",
    "@angular/material": "^16.2.14",
    "@angular/material-moment-adapter": "^16.2.14",
    "@angular/platform-browser": "^16.2.12",
    "@angular/platform-browser-dynamic": "^16.2.12",
    "@angular/router": "^16.2.12",
    "@angular/service-worker": "^16.2.12",
    "@azure/msal-angular": "^3.0.13",
    "@azure/msal-browser": "^3.10.0",
    "@egjs/hammerjs": "^2.0.17",
    "@ngx-translate/core": "^14.0.0",
    "@ngx-translate/http-loader": "^7.0.0",
    "@okta/okta-angular": "^6.3.2",
    "@okta/okta-auth-js": "^7.5.1",
    "@progress/kendo-angular-buttons": "^15.4.0",
    "@progress/kendo-angular-common": "^15.4.0",
    "@progress/kendo-angular-dateinputs": "^15.4.0",
    "@progress/kendo-angular-dropdowns": "^15.4.0",
    "@progress/kendo-angular-excel-export": "^15.4.0",
    "@progress/kendo-angular-grid": "^15.4.0",
    "@progress/kendo-angular-inputs": "^15.4.0",
    "@progress/kendo-angular-intl": "^15.4.0",
    "@progress/kendo-angular-l10n": "^15.4.0",
    "@progress/kendo-angular-label": "^15.4.0",
    "@progress/kendo-angular-layout": "^15.4.0",
    "@progress/kendo-angular-pdf-export": "^15.4.0",
    "@progress/kendo-angular-popup": "^15.4.0",
    "@progress/kendo-angular-progressbar": "^15.4.0",
    "@progress/kendo-angular-ripple": "^15.4.0",
    "@progress/kendo-angular-treeview": "^15.4.0",
    "@progress/kendo-data-query": "^1.5.4",
    "@progress/kendo-drawing": "^1.9.1",
    "@progress/kendo-licensing": "^1.3.5",
    "@progress/kendo-theme-material": "^3.19.0",
    "ajv": "^6.11.0",
    "bootstrap": "^4.4.1",
    "classlist.js": "^1.1.20150312",
    "core-js": "^3.6.4",
    "css-element-queries": "^1.2.3",
    "d3": "^5.15.0",
    "dexie": "^3.2.4",
    "fast-deep-equal": "^3.1.1",
    "file-saver": "^2.0.2",
    "gl-matrix": "^3.1.0",
    "hammerjs": "^2.0.8",
    "http-status-codes": "^1.3.2",
    "js-base64": "^3.4.5",
    "keycharm": "^0.3.1",
    "ngx-bootstrap": "^11.0.2",
    "ngx-mqtt": "^16.1.0",
    "ngx-toastr": "^17.0.2",
    "npm-run-all": "^4.1.5",
    "popper.js": "^1.16.1",
    "ramda": "0.26.1",
    "rxjs": "^7.8.1",
    "tslib": "^2.0.0",
    "uri-js": "^4.4.1",
    "uuid": "^8.3.0",
    "vis-data": "^7.1.9",
    "vis-network": "^9.1.9",
    "vis-util": "^5.0.7",
    "vkbeautify": "^0.99.3",
    "zone.js": "~0.13.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^16.2.12",
    "@angular/cli": "^16.2.12",
    "@angular/compiler-cli": "^16.2.12",
    "@angular/language-service": "^16.2.12",
    "@fortawesome/fontawesome-free": "^5.12.1",
    "@progress/kendo-angular-messages": "^1.56.0",
    "@types/d3-array": "^2.0.0",
    "@types/d3-axis": "^1.0.12",
    "@types/d3-brush": "^1.0.10",
    "@types/d3-color": "^1.2.2",
    "@types/d3-scale": "^2.1.1",
    "@types/d3-scale-chromatic": "^1.3.1",
    "@types/d3-selection": "^1.4.1",
    "@types/d3-shape": "^1.3.2",
    "@types/d3-time-format": "^2.1.1",
    "@types/d3-zoom": "^1.7.4",
    "@types/file-saver": "^2.0.1",
    "@types/gl-matrix": "^2.4.5",
    "@types/hammerjs": "^2.0.36",
    "@types/js-base64": "^2.3.1",
    "@types/node": "^18.16.20",
    "@types/ramda": "^0.26.41",
    "@types/vis": "^4.21.14",
    "prettier": "^1.19.1",
    "protractor": "~7.0.0",
    "roboto-fontface": "^0.10.0",
    "ts-node": "^8.6.2",
    "typescript": "~4.9.5"
  }

       
    <link href="/Content/bootstrap.css" rel="stylesheet"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/themes/7.2.0/classic/classic-silver.css" />
    <link rel="stylesheet" href="https://unpkg.com/@progress/kendo-font-icons/dist/index.css" />

    <script src="/Scripts/jquery-1.9.1.js"></script>
    <script src="https://unpkg.com/jszip/dist/jszip.min.js"></script>
    <script src="/Scripts/kendo/2024.1.130/pako_deflate.min.js"></script>
    <script src="/Scripts/kendo/2024.1.130/kendo.all.min.js"></script>
    <script src="/Scripts/kendo/2024.1.130/kendo.aspnetmvc.min.js"></script>
    <script src="/Scripts/kendo/2024.1.130/cultures/kendo.culture.pt-BR.min.js"></script>
    <script src="/Scripts/kendo/2024.1.130/messages/kendo.messages.pt-BR.min.js"></script>
    <script src="/Scripts/jquery.unobtrusive-ajax.min.js"></script>
    <script src="/Scripts/modernizr-2.5.3.js"></script>
    <script src="/Scripts/bootstrap.min.js"></script>
    <script src="/ReportViewer/js/telerikReportViewer.kendo-18.0.24.130.min.js"></script>
    <script src="/ReportViewer/js/telerikReportViewer-18.0.24.130.min.js"></script>
    <script src="/ReportViewer/js/localization.pt-BR.js"></script>

<script type="text/javascript">
    $(document).ready(function () {
        $("#reportViewer1")
            .telerik_ReportViewer({

                // The URL of the service which will serve reports.
                // The URL corresponds to the name of the controller class (ReportsController).
                // For more information on how to configure the service please check http://www.telerik.com/help/reporting/telerik-reporting-rest-conception.html.
                serviceUrl: "/api/reports",

                // The URL for custom report viewer template. The template can be edited -
                // new functionalities can be added and unneeded ones can be removed.
                // For more information please check http://www.telerik.com/help/reporting/html5-report-viewer-templates.html.
                //

                //ReportSource - report description
                reportSource: {
                    // The report can be set to a report file name (trdx report definition)
                    // or CLR type name (report class definition).
                    report: "Mantic.Core.Web.Reports.CancelledSales.CancelledSalesReport, Mantic.Core.Web.Reports, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null"
                },

                // Specifies whether the viewer is in interactive or print preview mode.
                // PRINT_PREVIEW - Displays the paginated report as if it is printed on paper. Interactivity is not enabled.
                // INTERACTIVE - Displays the report in its original width and height without paging. Additionally interactivity is enabled.
                viewMode: telerikReportViewer.ViewModes.PRINT_PREVIEW,

                // Sets the scale mode of the viewer.
                // Three modes exist currently:
                // FIT_PAGE - The whole report will fit on the page (will zoom in or out), regardless of its width and height.
                // FIT_PAGE_WIDTH - The report will be zoomed in or out so that the width of the screen and the width of the report match.
                // SPECIFIC - Uses the scale to zoom in and out the report.
                scaleMode: telerikReportViewer.ScaleModes.FIT_PAGE_WIDTH,

                // Zoom in and out the report using the scale
                // 1.0 is equal to 100%, i.e. the original size of the report
                scale: 1.0,

                ready: function () {
                    //this.refreshReport();
                },
            });

    });
</script>

namespace Mantic.Core.Web.Views.Report.Controllers
{
    using System.IO;
    using System.Web;
    using System.Web.Mvc;

    using Telerik.Reporting.Cache.File;
    using Telerik.Reporting.Services;
    using Telerik.Reporting.Services.WebApi;

    //The class name determines the service URL. 
    //ReportsController class name defines /api/report/ service URL.
    public class ReportsController : ReportsControllerBase
    {
        static ReportServiceConfiguration configurationInstance;

        static ReportsController()
        {
            //This is the folder that contains the report definitions
            //In this case this is the Reports folder
            var appPath = HttpContext.Current.Server.MapPath("~/");
            var reportsPath = Path.Combine(appPath, "Reports");

            //Add resolver for trdx/trdp report definitions, 
            //then add resolver for class report definitions as fallback resolver; 
            //finally create the resolver and use it in the ReportServiceConfiguration instance.
            var resolver = new ReportFileResolver(reportsPath)
                .AddFallbackResolver(new ReportTypeResolver());

            //Setup the ReportServiceConfiguration
            configurationInstance = new ReportServiceConfiguration
            {
                HostAppId = "Html5App",
                Storage = new FileStorage(),
                ReportResolver = resolver,
                // ReportSharingTimeout = 0,
                // ClientSessionTimeout = 15,
            };
        }

        public ReportsController()
        {
            //Initialize the service configuration
            this.ReportServiceConfiguration = configurationInstance;
        }
    }
}