Publish Crystal Reports on Typeform Data

The CData ADO.NET Provider for Typeform is fully integrated into the SAP Crystal Reports for Visual Studio development environment. You can employ standard ADO.NET components to construct reports, much like you would with SQL Server, but with the added advantage of real-time connectivity to Typeform. This article will guide you through the essential three steps to incorporate Typeform data into a report that refreshes upon opening.

Note: You will need to install SAP Crystal Reports, developer version for Visual Studio to follow this tutorial.

Create a Crystal Reports Application

To follow this article, you will also need a Visual Studio Crystal Reports project. This article will add a report to a WPF application. You can create one by clicking File -> New Project and then selecting the Crystal Reports WPF Application template. In the resulting wizard, select the option to create a blank report.

Connect to Typeform

Creating an ADO.NET data source for Typeform from Server Explorer makes it easy to create a DataSet that can be used in Crystal Reports wizards and the Crystal Reports Designer. You can find a guide to working with Typeform data in Server Explorer in the "Getting Started" chapter of the help documentation.

Start by setting the Profile connection property to the location of the TypeForm Profile on disk (e.g. C:\profiles\TypeForm.apip). Next, set the ProfileSettings connection property to the connection string for TypeForm (see below).

TypeForm API Profile Settings

Authentication to TypeForm uses the OAuth standard.

To authenticate to TypeForm, you must first register and configure an OAuth application with TypeForm here: https://admin.typeform.com/account#/section/tokens. Your app will be assigned a client ID and a client secret which can be set in the connection string. More information on setting up an OAuth application can be found at https://developer.typeform.com/get-started/.

Note that there are several different use scenarios which all require different redirect URIs:

• CData Desktop Applications: CData desktop applications (Sync, API Server, ArcESB) accept OAuth tokens at /src/oauthCallback.rst. The host and port is the same as the default port used by the application. For example, if you use http://localhost:8019/ to access CData Sync then the redirect URI will be http://localhost:8019/src/oauthCallback.rst.
• CData Cloud Applications: CData cloud applications are similar to their desktop counterparts. If you access Connect Cloud at https://1.2.3.4/ then you should use the redirect https://1.2.3.4/src/oauthCallback.rst.
• Desktop Application: When using a desktop application, the URI https://localhost:33333 is recommended.
• Web Application: When developing a web application using the driver, use your own URI here such as https://my-website.com/oauth.

After setting the following connection properties, you are ready to connect:

• AuthScheme: Set this to OAuth.
• InitiateOAuth: Set this to GETANDREFRESH. You can use InitiateOAuth to manage the process to obtain the OAuthAccessToken.
• OAuthClientId: Set this to the Client Id that is specified in your app settings.
• OAuthClientSecret: Set this to Client Secret that is specified in your app settings.
• CallbackURL: Set this to the Redirect URI you specified in your app settings.

When you configure the connection, you may also want to set the Max Rows connection property. This will limit the number of rows returned, which is especially helpful for improving performance when designing reports and visualizations.

Create a DataSet

Follow the steps below to use the Visual Studio ADO.NET DataSet Designer to create an ADO.NET DataSet object. Crystal Reports will bind to the DataSet object, which contains Typeform table metadata. Note that this approach also adds a connection string to App.config; you will use this connection string later to load data into the report.

1. In the Solution Explorer, right-click your project and then click Add -> New Item.
2. Select DataSet. The DataSet Designer is then displayed.
3. Drag and drop tables from Server Explorer onto the DataSet Designer. This article uses the Tags table.

Add Typeform Fields to the Report

Follow the steps below to add columns from the DataSet to the report:

1. Double-click the .rpt file in the Solution Explorer to open the Crystal Reports Designer.
2. Right-click the designer and click Database -> Database Expert.
3. Expand the Project Folder and ADO.NET DataSets nodes and drag the DataSet you created into the Selected Tables box. The fields are now accessible from the Field Explorer.
4. Drag and drop fields from the Field Explorer to the Details section or another section of your report.

Load Data into the Report

Having created the DataSet, which will only contain the metadata, you will now need to create the DataTable containing the actual data. You can use the APIDataAdapter to fill a DataTable with the results of an SQL query.

1. Add a reference to System.Configuration.dll to your project to be able to use the connection string from App.config.
2. In App.config, add the following code to the configuration node for compatibility with Crystal Reports when working with .NET 4.0:

   
     <startup useLegacyV2RuntimeActivationPolicy="true">
       <supportedRuntime version="v4.0" sku=".NETFramework,Version=v4.0"/>
     </startup>
   

3. Add the following references in your Window.xaml.cs file:

   using System.Configuration;
   using CrystalDecisions.CrystalReports.Engine;
   using CrystalDecisions.Shared;
   using System.Data.CData.API;
   using System.Data;
   

4. Add the following Window_Loaded method in your Window.xaml.cs to execute the SQL query that will return the DataTable. Note that your query needs to select at least the same columns used in your report.

   private void Window_Loaded(object sender, RoutedEventArgs e) {
     ReportDocument report = new ReportDocument();
     report.Load("../../CrystalReport1.rpt"); 
    var connectionString = ConfigurationManager.ConnectionStrings["MyAppConfigConnectionStringName"].ConnectionString;
     using (APIConnection connection = new APIConnection(connectionString)) {
       APIDataAdapter dataAdapter = new APIDataAdapter(
       "SELECT Id, Title FROM Tags WHERE SettingsIsPublic = 'true'", connection);
        DataSet set = new DataSet("_set");
        DataTable table = set.Tables.Add("_table");
        dataAdapter.Fill(table);
        report.SetDataSource(table);
     }
     reportViewer.ViewerCore.ReportSource = report;
   }
   

5. In the Window.xaml file, add the Loaded event so that your Window tag resembles the following:

   
   <Window x:Class="CrystalReportWpfApplication4.Window1"
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
           xmlns:cr="clr-namespace:SAPBusinessObjects.WPF.Viewer;assembly=SAPBusinessObjects.WPF.Viewer"
           Title="WPF Crystal Report Viewer" Height="600" Width="800" Loaded="Window_Loaded">
           ...
   </Window>
   

6. Run the report. When the report is loaded, the provider executes the query to retrieve the current data.

Chart Typeform Data

You can also use the DataSet with experts like the Chart Expert:

1. Right-click in the Crystal Reports Designer and click Insert -> Chart.
2. Select the Report Header or Report Footer section. The Chart Expert is then displayed.
3. On the Type tab, select the chart type. This article uses a side-by-side bar chart.
4. On the Data tab, select the column and conditions for the x-axis. For example, drag the Id column in the DataSet node onto the box under the On Change Of menu.
5. Select the x-axis column and click the TopN and Order buttons to configure sorting and limiting.
6. Select the columns and summary operations for the y-axis. For example, drag the Title column in the DataSet node into the Show Values box.
7. Run the report.

Note that Crystal Reports performs the aggregation on the data already loaded into DataTable, instead of, for example, executing a GROUP BY to the Typeform API. This will also be true for the report creation wizards.

You could gain more control over the queries executed to Typeform by creating another DataSet and populating it with a different query. See the help documentation for more information on the driver's SQL engine.