8 ms·

It's not bad, but I have grown really fond of Grafana's date/time picker and can whip up a clone of that using React-Bootstrap and React Datepicker (https://rea

It's not bad, but I have grown really fond of Grafana's date/time picker and can whip up a clone of that using React-Bootstrap and React Datepicker (https://reactdatepicker.com https://reactdatepicker.com) in about ten minutes :)

paxys 4y ago
Not being able to go back months or years without pressing the back button 3000 times is the worst possible design for a date picker.
- geekrax 4y ago
  I am assuming that you're judging the behavior by the minimal example in the top 1% of the site. If you scroll further, you will notice how extensible it is to support not only month and date navigation but many other customizations.
  - craigching 4y ago
    Exactly. There are tons of different ways to solve that problem in react-date picker, this being one of them: https://reactdatepicker.com/#example-year-dropdown https://reactdatepicker.com/#example-year-dropdown
    - stoplying1 4y ago
      I also assumed it was limited in such ways. Mostly because it is extraordinarily rare that anyone bothers to enable those. I'd much, much, much rather have a singular, consistent full UX available to me instead of defaulting to some "simple elegant" artificially stunted version.
    - matsemann 4y ago
      A hundred more clicks than JetBrains' one, though.
madeofpalk 4y ago
For what it's worth, the Grafana date picker[0] is "just" react-calendar[1]. The time range picker you see on a dashboard uses that and a bunch of other (custom) stuff. (I work on grafana frontend) [0]: https://github.com/grafana/grafana/blob/4b2a9406596ba63a694534e10c230f587dc974c6/packages/grafana-ui/src/components/DateTimePickers/DatePicker/DatePicker.tsx#L44 https://github.com/grafana/grafana/blob/4b2a9406596ba63a6945... [1]: https://www.npmjs.com/package/react-calendar https://www.npmjs.com/package/react-calendar
- stavros 4y ago
  We just deployed Grafana across our company and are very impressed with it. All this functionality for $8/user/mo is amazing.
makmanalp 4y ago
Funnily enough I have a pet peeve with Grafana's picker (which is overall quite nice) - I can't copy and paste the whole date range from one window to another in one go. I'm often punching in varies specific datetime ranges across multiple dashboards so this comes up all the time every day. Sure I've added data links for the cases that I use most frequently but I can't do that for everything. The "recently used ranges" (which is a neat feature) doesn't seem to work across dashboards and seems to require a page reload which baffles me a bit.

paxys 4y ago

Not being able to go back months or years without pressing the back button 3000 times is the worst possible design for a date picker.

geekrax 4y ago
I am assuming that you're judging the behavior by the minimal example in the top 1% of the site. If you scroll further, you will notice how extensible it is to support not only month and date navigation but many other customizations.
- craigching 4y ago
  Exactly. There are tons of different ways to solve that problem in react-date picker, this being one of them: https://reactdatepicker.com/#example-year-dropdown https://reactdatepicker.com/#example-year-dropdown
  - stoplying1 4y ago
    I also assumed it was limited in such ways. Mostly because it is extraordinarily rare that anyone bothers to enable those. I'd much, much, much rather have a singular, consistent full UX available to me instead of defaulting to some "simple elegant" artificially stunted version.
  - matsemann 4y ago
    A hundred more clicks than JetBrains' one, though.

madeofpalk 4y ago

For what it's worth, the Grafana date picker[0] is "just" react-calendar[1]. The time range picker you see on a dashboard uses that and a bunch of other (custom) stuff. (I work on grafana frontend) [0]: https://github.com/grafana/grafana/blob/4b2a9406596ba63a694534e10c230f587dc974c6/packages/grafana-ui/src/components/DateTimePickers/DatePicker/DatePicker.tsx#L44 https://github.com/grafana/grafana/blob/4b2a9406596ba63a6945... [1]: https://www.npmjs.com/package/react-calendar https://www.npmjs.com/package/react-calendar

stavros 4y ago
We just deployed Grafana across our company and are very impressed with it. All this functionality for $8/user/mo is amazing.

makmanalp 4y ago

Funnily enough I have a pet peeve with Grafana's picker (which is overall quite nice) - I can't copy and paste the whole date range from one window to another in one go. I'm often punching in varies specific datetime ranges across multiple dashboards so this comes up all the time every day. Sure I've added data links for the cases that I use most frequently but I can't do that for everything. The "recently used ranges" (which is a neat feature) doesn't seem to work across dashboards and seems to require a page reload which baffles me a bit.