// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved. // See License.txt for license information. import Constants from '../../utils/constants.jsx'; import LineChart from './line_chart.jsx'; import DoughnutChart from './doughnut_chart.jsx'; import StatisticCount from './statistic_count.jsx'; var Tooltip = ReactBootstrap.Tooltip; var OverlayTrigger = ReactBootstrap.OverlayTrigger; import {injectIntl, intlShape, defineMessages, FormattedMessage, FormattedDate} from 'mm-intl'; const holders = defineMessages({ analyticsTotalUsers: { id: 'admin.analytics.totalUsers', defaultMessage: 'Total Users' }, analyticsPublicChannels: { id: 'admin.analytics.publicChannels', defaultMessage: 'Public Channels' }, analyticsPrivateGroups: { id: 'admin.analytics.privateGroups', defaultMessage: 'Private Groups' }, analyticsTotalPosts: { id: 'admin.analytics.totalPosts', defaultMessage: 'Total Posts' }, analyticsFilePosts: { id: 'admin.analytics.totalFilePosts', defaultMessage: 'Posts with Files' }, analyticsHashtagPosts: { id: 'admin.analytics.totalHashtagPosts', defaultMessage: 'Posts with Hashtags' }, analyticsIncomingHooks: { id: 'admin.analytics.totalIncomingWebhooks', defaultMessage: 'Incoming Webhooks' }, analyticsOutgoingHooks: { id: 'admin.analytics.totalOutgoingWebhooks', defaultMessage: 'Outgoing Webhooks' }, analyticsChannelTypes: { id: 'admin.analytics.channelTypes', defaultMessage: 'Channel Types' }, analyticsTextPosts: { id: 'admin.analytics.textPosts', defaultMessage: 'Posts with Text-only' }, analyticsPostTypes: { id: 'admin.analytics.postTypes', defaultMessage: 'Posts, Files and Hashtags' } }); export default class Analytics extends React.Component { constructor(props) { super(props); this.state = {}; } render() { // in the future, break down these into smaller components const {formatMessage} = this.props.intl; var serverError = ''; if (this.props.serverError) { serverError =
; } let loading = (
); let firstRow; let extraGraphs; if (this.props.showAdvanced) { firstRow = (
); const channelTypeData = [ { value: this.props.channelOpenCount, color: '#46BFBD', highlight: '#5AD3D1', label: formatMessage(holders.analyticsPublicChannels) }, { value: this.props.channelPrivateCount, color: '#FDB45C', highlight: '#FFC870', label: formatMessage(holders.analyticsPrivateGroups) } ]; const postTypeData = [ { value: this.props.filePostCount, color: '#46BFBD', highlight: '#5AD3D1', label: formatMessage(holders.analyticsFilePosts) }, { value: this.props.filePostCount, color: '#F7464A', highlight: '#FF5A5E', label: formatMessage(holders.analyticsHashtagPosts) }, { value: this.props.postCount - this.props.filePostCount - this.props.hashtagPostCount, color: '#FDB45C', highlight: '#FFC870', label: formatMessage(holders.analyticsTextPosts) } ]; extraGraphs = (
); } else { firstRow = (
); } let postCountsByDay; if (this.props.postCountsDay == null) { postCountsByDay = (
{loading}
); } else { let content; if (this.props.postCountsDay.labels.length === 0) { content = (
); } else { content = ( ); } postCountsByDay = (
{content}
); } let usersWithPostsByDay; if (this.props.userCountsWithPostsDay == null) { usersWithPostsByDay = (
{loading}
); } else { let content; if (this.props.userCountsWithPostsDay.labels.length === 0) { content = (
); } else { content = ( ); } usersWithPostsByDay = (
{content}
); } let recentActiveUser; if (this.props.recentActiveUsers != null) { let content; if (this.props.recentActiveUsers.length === 0) { content = loading; } else { content = ( { this.props.recentActiveUsers.map((user) => { const tooltip = ( {user.email} ); return ( ); }) }
); } recentActiveUser = (
{content}
); } let newUsers; if (this.props.newlyCreatedUsers != null) { let content; if (this.props.newlyCreatedUsers.length === 0) { content = loading; } else { content = ( { this.props.newlyCreatedUsers.map((user) => { const tooltip = ( {user.email} ); return ( ); }) }
); } newUsers = (
{content}
); } return (

{serverError} {firstRow} {extraGraphs}
{postCountsByDay}
{usersWithPostsByDay}
{recentActiveUser} {newUsers}
); } } Analytics.defaultProps = { title: null, channelOpenCount: null, channelPrivateCount: null, postCount: null, postCountsDay: null, userCountsWithPostsDay: null, recentActiveUsers: null, newlyCreatedUsers: null, uniqueUserCount: null, serverError: null }; Analytics.propTypes = { intl: intlShape.isRequired, title: React.PropTypes.string, channelOpenCount: React.PropTypes.number, channelPrivateCount: React.PropTypes.number, postCount: React.PropTypes.number, showAdvanced: React.PropTypes.bool, filePostCount: React.PropTypes.number, hashtagPostCount: React.PropTypes.number, incomingWebhookCount: React.PropTypes.number, outgoingWebhookCount: React.PropTypes.number, postCountsDay: React.PropTypes.object, userCountsWithPostsDay: React.PropTypes.object, recentActiveUsers: React.PropTypes.array, newlyCreatedUsers: React.PropTypes.array, uniqueUserCount: React.PropTypes.number, serverError: React.PropTypes.string }; export default injectIntl(Analytics);