Date/Time Picker Component
Opened this issue · 5 comments
Some upcoming work will require us to take date/times and date/time ranges from users when creating batch / streaming ClickPipes.
We can start with plain text boxes on our end so it's not urgent, but I believe it would enhance the user experience and require less involved input validation in the backend.
This is on the design roadmap
Hi @pjhampton , I have some designs for the date picker
.
Simple Date Picker
Users select a single date.
Simple Date Range
Users can select an interval between 2 dates. We can also disable future dates if we want.
Date Range with Predefined Values
To simplify date range selection, we can offer some predefined values, like Past day
, Past week
Past 2 weeks
, Past month
, etc, and if those are not enough, we can let users select their own custom period of time.
Date and Time Picker
For ClickPipes, it's useful to pick a specific date and time, this UI aims to address that
Designs can be found here
Deisgns validated with @pjhampton and the design team.
@serdec, can we plan an implementation in the near future?
@vineethasok and I chatted about and this and he proposed a list of libraries we can use to power this.
- Ant design. Pros: Lots of functionality, highly active and used library. Cons: may not be very customizable, comes with a whole design library
- react-multi-date-picker. Pros: Provides the functionality we need, looks pretty easy to use. Cons: is large (~370 kB package size), unclear how performant this is, seems to be a single person maintaining this project.
- Adobe react-spectrum datepicker: Pros: Extensible, maintained by Adobe. Cons: will probably require more work than the first two libraries, maintained by Adobe.
- h6s calendar: Pros: extensible, lightweight. Cons: requires us to implement the UI