Date Filter is possible to add datepicker calendar?

bbs2009 commented 7 years ago

Make sure these boxes are checked before submitting your issue - thank you!

[Y] I have checked the superset logs for python stacktraces and included it here as text if any
[Y] I have reproduced the issue with at least the latest released version of superset
[Y] I have checked the issue tracker for the same issue and I haven't found one similar

I greet everyone. Please add a drop-down calendar to the date filter, like default

Thank you.

mistercrunch commented 7 years ago

It's a bit more complicated than that as our current date dropdown allows for bot fixed dates and relative dates. Expressions like 52 weeks ago or 4 hours ago or 2015 currently work. We'd need a slightly more complex control with a radio button (relative or fixed) that shows a datepicker or some form for [input int] [frequency] [ago/from_now] depending...

bbs2009 commented 7 years ago

Perhaps it will be convenient for users. Thank you

higaxman commented 7 years ago

We are interested in implementing this feature. @mistercrunch : could we make some proposal about which widget to use? Do you have any advice ?

mistercrunch commented 7 years ago

Awesome @higaxman , it's now possible to build rich controls too. Here are a few thoughts:

the representation could be a simple text and a subtle edit icon
if no specific time is select (00:00:00) I wouldn't show it, just show what is relevant.
clicking the edit icon would pop a small bootstrap popover to the right of the text
inside the popover a radio button for fixed/relative
fixed would go along with the nicest react datepicker you can find, it has to allow date and time
relative would be perhaps 3 boxes
- an input box that validates numeric
- a time unit dropdown (seconds, minutes, hours, days, weeks, months, years), default to days
- dropdown for ago or from now, defaults to ago
clicking the form controls in the popover flips the radio button accordingly to save a click. meaning if you click the time unit dropdown, it selects the relative option for the radiobutton, or if you click any part of the date picker, it chooses the fixed option
[probably out of scope], an option for UTC / timezones when using fixed dates

For an example of a rich control, check out this branch (unmerged) where I'm working on a popover for the metrics control. https://github.com/airbnb/superset/compare/metrics...mistercrunch:metrics?expand=1

higaxman commented 7 years ago

Thanks! Going to check it.

DavidJHassan commented 7 years ago

I am very interested in this feature. Please keep up the good work! I look forward to using a date-picker filter.

mistercrunch commented 7 years ago

After a quick research, I'd go with http://dev.quri.com/react-bootstrap-datetimepicker/

xrmx commented 7 years ago

@mistercrunch is it better than https://github.com/airbnb/react-dates ?

mistercrunch commented 7 years ago

@xrmx we need the component to handle time as well, not just date

pariser commented 7 years ago

Hey @higaxman how's your progress coming on this? I'd be happy to help

mistercrunch commented 7 years ago

Controls live here: https://github.com/airbnb/superset/tree/master/superset/assets/javascripts/explore/components/controls

Create 2 instances for since and until here: https://github.com/airbnb/superset/blob/master/superset/assets/javascripts/explore/stores/controls.jsx

Hard coded list here: https://github.com/airbnb/superset/blob/master/superset/assets/javascripts/explore/components/Control.jsx#L21 you can move this list to an index.jsx if you think it's better

vschoener commented 7 years ago

Hi @mistercrunch, wanted to know if we can use it ? or still in progress ? :)

mistercrunch commented 7 years ago

No one is working on this at the moment as far as I know

vschoener commented 7 years ago

So sad :'(

xrmx commented 7 years ago

@vschoener don't be sad, that's an opportunity for you to implement it.

emhlbmc commented 6 years ago

Will you add datepicker in next version? Any plans? AFAIK,datepicker is important for most developers and analysis.

mistercrunch commented 6 years ago

This as been done, will be in next release.

TheScoobyBoy commented 6 years ago

Will this be available in the FilterBox date filter as well? For dashboard filters.

Thanks.

mistercrunch commented 6 years ago

Yes it is

Him121 commented 6 years ago

Thanks all for Apache superset contribution and s/w.

My question is. Are there any sample dashboard reports available with date filters? My team is especially looking for having ability to switc/refresh the view based on reporting date change.

felexkemboi commented 5 years ago

Thanks all for Apache superset contribution and s/w.

My question is. Are there any sample dashboard reports available with date filters? My team is especially looking for having ability to switc/refresh the view based on reporting date change.

Am interested in this too

Danielmrg commented 2 years ago

I added a Persian Datepicker to my superset that filters all the data inside a dashboard .

Danielmrg commented 2 years ago

I applied my changes in the following path: superset/superset-frontend/src/visualizations/FilterBox

First I added my filter to the control panel with the following code: After that I changed the transform Props file: Finally, I added my filter to the FilterBox as follows: And here is my filter file: And Da Dam ...

@bbs2009 @xrmx @higaxman @pariser @vschoener @mistercrunch @KingAnnihilate @felexkemboi @TheScoobyBoy

AnettaStein commented 7 months ago

@Danielmrg - Hello Thank you for good idea I did everything according to your screenshots Tell me please the full path to install node.js and npm in SuperSet? And also the path for jalali-react-datepicker

apache / superset

Date Filter is possible to add datepicker calendar? #2579