mirror of
https://github.com/plausible/analytics.git
synced 2024-12-20 16:11:49 +03:00
b6eeb40472
* First pass on manual filter & path regex/negated filters Still needs: - Form structure on filter modal - Edit filter button - Filter dropdown UI improvement - Filter modal mount data collection - Tests - Potentially negating other filters * Second pass - mostly everything user-facing is done Still needs: - Tests - Potentially negating other filters - Potentially some code cleanup * Bugfix in realtime view, formatting * Fixes editing UX on list view * Adds tests for exclusions and wildcards * Various UI Improvements - Makes edit buttons full-length & properly sized - Adds remove filter button in edit menu * Changelog * Makes requested changes, adds different version of filter button * Makes colorings on top bar elements consistent
58 lines
2.3 KiB
JavaScript
58 lines
2.3 KiB
JavaScript
import React from 'react';
|
|
|
|
import Datepicker from './datepicker'
|
|
import SiteSwitcher from './site-switcher'
|
|
import Filters from './filters'
|
|
import CurrentVisitors from './stats/current-visitors'
|
|
import VisitorGraph from './stats/visitor-graph'
|
|
import Sources from './stats/sources'
|
|
import Pages from './stats/pages/'
|
|
import Countries from './stats/countries'
|
|
import Devices from './stats/devices'
|
|
import Conversions from './stats/conversions'
|
|
import { withPinnedHeader } from './pinned-header-hoc';
|
|
|
|
class Historical extends React.Component {
|
|
renderConversions() {
|
|
if (this.props.site.hasGoals) {
|
|
return (
|
|
<div className="items-start justify-between block w-full mt-6 md:flex">
|
|
<Conversions site={this.props.site} query={this.props.query} />
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
|
|
render() {
|
|
const navClass = this.props.site.embedded ? 'relative' : 'sticky'
|
|
|
|
return (
|
|
<div className="mb-12">
|
|
<div id="stats-container-top"></div>
|
|
<div className={`${navClass} top-0 sm:py-3 py-1 z-9 ${this.props.stuck && !this.props.site.embedded ? 'z-10 fullwidth-shadow bg-gray-50 dark:bg-gray-850' : ''}`}>
|
|
<div className="items-center w-full sm:flex">
|
|
<div className="flex items-center w-full mb-2 sm:mb-0">
|
|
<SiteSwitcher site={this.props.site} loggedIn={this.props.loggedIn} />
|
|
<CurrentVisitors timer={this.props.timer} site={this.props.site} query={this.props.query} />
|
|
<Filters site={this.props.site} query={this.props.query} history={this.props.history} />
|
|
</div>
|
|
<Datepicker site={this.props.site} query={this.props.query} />
|
|
</div>
|
|
</div>
|
|
<VisitorGraph site={this.props.site} query={this.props.query} />
|
|
<div className="items-start justify-between block w-full md:flex">
|
|
<Sources site={this.props.site} query={this.props.query} />
|
|
<Pages site={this.props.site} query={this.props.query} />
|
|
</div>
|
|
<div className="items-start justify-between block w-full md:flex">
|
|
<Countries site={this.props.site} query={this.props.query} />
|
|
<Devices site={this.props.site} query={this.props.query} />
|
|
</div>
|
|
{ this.renderConversions() }
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default withPinnedHeader(Historical, '#stats-container-top');
|