@gooddata/react-components
Version:
GoodData React Components
156 lines • 7.37 kB
JavaScript
;
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
exports.__esModule = true;
var React = require("react");
var GoodData = require("gooddata");
var noop = require("lodash/noop");
var isEqual = require("lodash/isEqual");
var identity = require("lodash/identity");
var data_layer_1 = require("@gooddata/data-layer");
var Subject_1 = require("rxjs/Subject");
require("rxjs/add/operator/switchMap");
var errorStates_1 = require("../../constants/errorStates");
var BaseChart_1 = require("../core/base/BaseChart");
var Table_1 = require("../core/Table");
var Visualization_1 = require("../../proptypes/Visualization");
var visualizationTypes_1 = require("../../constants/visualizationTypes");
function isDateFilter(filter) {
return filter.type === 'date';
}
function isAttributeFilter(filter) {
return filter.type === 'attribute';
}
function getDateFilter(filters) {
return filters.filter(isDateFilter).shift();
}
function getAttributeFilters(filters) {
return filters.filter(isAttributeFilter);
}
function uriResolver(projectId, uri, identifier) {
if (uri) {
return Promise.resolve(uri);
}
if (!identifier) {
return Promise.reject('Neither uri or identifier specified');
}
return GoodData.md.getObjectUri(projectId, identifier);
}
var Visualization = /** @class */ (function (_super) {
__extends(Visualization, _super);
function Visualization(props) {
var _this = _super.call(this, props) || this;
_this.state = {
isLoading: true
};
_this.visualizationUri = props.uri;
var errorHandler = props.onError;
_this.subject = new Subject_1.Subject();
_this.subscription = _this.subject
.switchMap(identity)
.subscribe(function (_a) {
var type = _a.type, dataSource = _a.dataSource, metadataSource = _a.metadataSource;
_this.type = type;
_this.dataSource = dataSource;
_this.metadataSource = metadataSource;
_this.setState({ isLoading: false });
}, function () { return errorHandler(errorStates_1.ErrorStates.NOT_FOUND); });
return _this;
}
Visualization.prototype.componentDidMount = function () {
var _a = this.props, projectId = _a.projectId, uri = _a.uri, identifier = _a.identifier, filters = _a.filters;
this.uriAdapter = new data_layer_1.UriAdapter(GoodData, projectId);
this.visualizationUri = uri;
this.prepareDataSources({
projectId: projectId,
identifier: identifier,
filters: filters
});
};
Visualization.prototype.componentWillUnmount = function () {
this.subscription.unsubscribe();
this.subject.unsubscribe();
};
Visualization.prototype.shouldComponentUpdate = function (nextProps, nextState) {
return this.hasChangedProps(nextProps) || (this.state.isLoading !== nextState.isLoading);
};
Visualization.prototype.hasChangedProps = function (nextProps, propKeys) {
var _this = this;
if (propKeys === void 0) { propKeys = Object.keys(Visualization_1.VisualizationPropType); }
return propKeys.some(function (propKey) { return !isEqual(_this.props[propKey], nextProps[propKey]); });
};
Visualization.prototype.componentWillReceiveProps = function (nextProps) {
var hasInvalidResolvedUri = this.hasChangedProps(nextProps, ['uri', 'projectId', 'identifier']);
var hasInvalidDatasource = hasInvalidResolvedUri || this.hasChangedProps(nextProps, ['filters']);
if (hasInvalidDatasource) {
this.setState({
isLoading: true
});
var projectId = nextProps.projectId, identifier = nextProps.identifier, filters = nextProps.filters;
var options = {
projectId: projectId,
identifier: identifier,
filters: filters
};
if (hasInvalidResolvedUri) {
this.visualizationUri = nextProps.uri;
this.metadataSource = null;
}
this.prepareDataSources(options);
}
};
Visualization.prototype.render = function () {
var _a = this, dataSource = _a.dataSource, metadataSource = _a.metadataSource, type = _a.type;
if (!dataSource || !metadataSource || !type) {
return null;
}
var _b = this.props, drillableItems = _b.drillableItems, onFiredDrillEvent = _b.onFiredDrillEvent, onError = _b.onError, onLoadingChanged = _b.onLoadingChanged, locale = _b.locale, config = _b.config;
switch (type) {
case visualizationTypes_1.VisualizationTypes.TABLE:
return (React.createElement(Table_1.Table, { dataSource: dataSource, metadataSource: metadataSource, drillableItems: drillableItems, onFiredDrillEvent: onFiredDrillEvent, onError: onError, onLoadingChanged: onLoadingChanged, locale: locale }));
default:
return (React.createElement(BaseChart_1.BaseChart, { dataSource: dataSource, metadataSource: metadataSource, drillableItems: drillableItems, onFiredDrillEvent: onFiredDrillEvent, onError: onError, onLoadingChanged: onLoadingChanged, type: type, locale: locale, config: config }));
}
};
Visualization.prototype.prepareDataSources = function (_a) {
var _this = this;
var projectId = _a.projectId, identifier = _a.identifier, _b = _a.filters, filters = _b === void 0 ? [] : _b;
var promise = this.props.uriResolver(projectId, this.visualizationUri, identifier)
.then(function (visualizationUri) {
_this.visualizationUri = visualizationUri;
var dateFilter = getDateFilter(filters);
var attributeFilters = getAttributeFilters(filters);
return _this.uriAdapter.createDataSource({ uri: _this.visualizationUri, attributeFilters: attributeFilters, dateFilter: dateFilter })
.then(function (dataSource) {
_this.metadataSource = _this.metadataSource || new data_layer_1.UriMetadataSource(GoodData, visualizationUri);
return _this.metadataSource.getVisualizationMetadata()
.then(function (_a) {
var metadata = _a.metadata;
return {
type: metadata.content.type,
dataSource: dataSource,
metadataSource: _this.metadataSource
};
});
});
});
this.subject.next(promise);
};
Visualization.propTypes = Visualization_1.VisualizationPropType;
Visualization.defaultProps = {
onError: noop,
filters: [],
uriResolver: uriResolver
};
return Visualization;
}(React.Component));
exports.Visualization = Visualization;
//# sourceMappingURL=Visualization.js.map