plausible/analytics
1
1
Fork 0
mirror of https://github.com/plausible/analytics.git synced 2024-11-26 23:27:54 +03:00
Code Issues Packages Projects Releases Wiki Activity

Fixes case-sensitivity and residual keys in date-keybinds (#709)

Browse Source 
* Fixes case-sensitivity and residual keys

* Adds 30d and 6mo shortcuts

* Changelog, rename function appropriately
This commit is contained in:
Vignesh Joglekar 2021-02-18 03:18:54 -06:00 committed by GitHub
parent 600378ba22
commit e55c2213a9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
CHANGELOG.md
View File

@ -5,6 +5,10 @@ All notable changes to this project will be documented in this file.
### Added
- Stats API [currently in beta] plausible/analytics#679
- 30 day and 6 month keybindings (`3` and `6`, respectively) plausible/analytics#709
### Fixed
- Capitalized date/time selection keybinds not working plausible/analytics#709
## [1.2] - 2021-01-26

18
assets/js/dashboard/datepicker.js
View File

@ -23,7 +23,7 @@ import { navigateToQuery, QueryLink, QueryButton } from "./query";
class DatePicker extends React.Component {
constructor(props) {
super(props);
this.handleKeyup = this.handleKeyup.bind(this);
this.handleKeydown = this.handleKeydown.bind(this);
this.handleClick = this.handleClick.bind(this);
this.openCalendar = this.openCalendar.bind(this);
this.open = this.open.bind(this);
@ -31,19 +31,19 @@ class DatePicker extends React.Component {
}
componentDidMount() {
document.addEventListener("keyup", this.handleKeyup);
document.addEventListener("keydown", this.handleKeydown);
document.addEventListener("mousedown", this.handleClick, false);
}
componentWillUnmount() {
document.removeEventListener("keyup", this.handleKeyup);
document.removeEventListener("keydown", this.handleKeydown);
document.removeEventListener("mousedown", this.handleClick, false);
}
handleKeyup(e) {
handleKeydown(e) {
const { query, history } = this.props;
if (e.ctrlKey || e.metaKey || e.altKey) return
if (e.ctrlKey || e.metaKey || e.altKey || e.isComposing || e.keyCode === 229) return
const newSearch = {
period: false,
@ -100,11 +100,11 @@ class DatePicker extends React.Component {
this.setState({open: false});
const keys = ['d', 'r', 'w', 'm', 'y'];
const redirects = [{date: false, period: 'day'}, {period: 'realtime'}, {date: false, period: '7d'}, {date: false, period: 'month'}, {date: false, period: '12mo'}];
const keys = ['d', 'r', 'w', 'm', 'y', '3', '6'];
const redirects = [{date: false, period: 'day'}, {period: 'realtime'}, {date: false, period: '7d'}, {date: false, period: 'month'}, {date: false, period: '12mo'}, {date: false, period: '30d'}, {date: false, period: '6mo'}];
if (keys.includes(e.key.toLowerCase())) {
navigateToQuery(history, query, {...newSearch, ...(redirects[keys.indexOf(e.key) % 5])});
navigateToQuery(history, query, {...newSearch, ...(redirects[keys.indexOf(e.key.toLowerCase())])});
} else if (e.key.toLowerCase() === 'c') {
this.setState({mode: 'calendar', open: true}, this.openCalendar);
} else if (newSearch.date) {
@ -302,6 +302,8 @@ class DatePicker extends React.Component {
'Last 7 days': 'W',
'Month to Date': 'M',
'Last 12 months': 'Y',
'Last 6 months': '6',
'Last 30 days': '3',
};
return (