Data Sources

In developing WireBootstrap applications, most application code and all components communicate with data services through a DataSource object. This object is located at wire.data.DataSource.

Configuration

//
// Create a new data source object from a CSV file
//
const accountService = new wire.data.DataSource("local", {
    ...
    Provider: {
        Csv: { url: "./data/sales.csv" }
    }
});

The data source constructor takes two parameters. The first is the service provider key. This tells the data source which service provider to use with the data service.

The second parameter is the configuration for the data source. This configuration has two parts. The root properties are attributes of the data source object. These settings are independent of any service provider. One of the root parameters on the data source is the Provider attribute. This attribute is the root of the configuration for the service provider. Any configuration in this object will be specific to the service provider.

In the example above, the Csv configuration object is only valid for the local service provider specified in the first parameter local.

Data Models

Data models contain meta data about the data returned from a data service. Data models are a convenient way to share data attributes such as friendly labels or numeric formatting across any queries that are run through a data source with a model set up. This meta data is also available to any WireBootstrap component for display.

Data models are set up on a data source. A data model is meta data about fields in the data service that will be added to result sets returned as DataTable objects. The meta data is set up by the data source once it receives the results from the data service. Meta data for each field is stored in the Columns attribute on the data table.

In the following example, any query that returns the Sales or Date field from the data service will have meta data attached to the respective columns in any data table.

const accountService = new wire.data.DataSource("local", {
    ...
    Model: new eb.data.DataModel({
        Fields: [
            
            // Use 'Revenue' as the UI label for this field
            // Format the field as currency with 2 decimal places
            { Entity: "Facts", Name: "Sales_Stage", Alias: "Revenue", Format: "C2" },
            
            // Use 'Date' as the UI label for this field
            // Format the field as a date using the the third party library 'moment.js'
            { Entity: "Facts", Name: "Date_Stage", Alias: "Date", Format: (value) => {
                return moment(value).format("MM/DD/YYYY");
            }}
            
        ]
    })
});

Security

To set security on calls to a data service, set the Headers property on the data source configuration using standard HTTP Authorization.

const accountService = new wire.data.DataSource("custom", {
    Headers: {"Authorization": "Bearer " + "[accessToken]"}
}

Methods on the DataSource object can also be used to set authorization.

accountService.useBearerAuth("[accessToken]");
...
accountService.useBasicAuth("[user]", "[password]");

Visit the wire.data.DataSource reference for more on data sources. Visit the service provider documentation for details on configuration for a specific service provider.