Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

#331 Datepicker component #300

Merged
merged 41 commits into from
Aug 26, 2022
Merged

#331 Datepicker component #300

merged 41 commits into from
Aug 26, 2022

Conversation

przemuh
Copy link
Contributor

@przemuh przemuh commented Mar 9, 2022

@skrabkab-design
Copy link

From my perspective this component is perfect! There are few things that we should improve:

  • There should be a corner radius
    image

  • The icons that jump between years are not the right ones - we should use those icons from our DS
    image

  • I don't see the option to mark today on the date picker. Is this option supported?
    image

@kamilmateusiak kamilmateusiak mentioned this pull request Mar 9, 2022
Closed
@skrabkab-design
Copy link

skrabkab-design commented Mar 14, 2022 •
edited
Loading

Component looks great! Awesome work @kamilmateusiak!
Few minor things and we're ready to go! I think we'll finish them on our side. @przemuh can you take over from here?

image
This one still needs to be fixed – the icons are not correct here, let's use the ones from DS

image
When selecting range, the corner radius should be 0px for the inner corners

image
When selecting range in Dark mode - there is some lighter border around selection. Can we do anything to remove that effect?

image
We need to add support for entering the dates manually

image
We need to add Picker component, to replace the placeholder

@kamilmateusiak
Copy link
Contributor

We need to add support for entering the dates manually
In the issue (#284) requirements was stated that manual inputs change should be removed and because of that I removed that option. @skrabkab-design did you change your mind?

@skrabkab-design
Copy link

We need to add support for entering the dates manually
In the issue (#284) requirements was stated that manual inputs change should be removed and because of that I removed that option. @skrabkab-design did you change your mind?

Sorry! We've discussed that internally and decided to keep this option, I forgot to change the task description :(

kamilmateusiak
kamilmateusiak reviewed Mar 14, 2022
View reviewed changes
packages/react-components/src/components/Datepicker/DatePicker.tsx Outdated
import { IDatePickerProps } from './types';
import { isDateWithinRange } from './helpers';

const baseClass = 'date-picker';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I noticed that I used className without lc- prefix. Please change it :)

@MichalPaszowski MichalPaszowski force-pushed the datepicker branch 2 times, most recently from 394513d to 9433420 Compare July 8, 2022 09:11
@MichalPaszowski
Copy link
Contributor

This PR is the work of Kamil who agreed to help us out with the DatePicker component. 
It is refreshed version of DatePicker from the previous Design System. It still does not allow to enter date manually but other than that should be fully functional.
You can compare design to Figma

@sgraczyk sgraczyk changed the title Datepicker - internal branch Datepicker component Jul 11, 2022
mreszke
mreszke reviewed Jul 11, 2022
View reviewed changes
Copy link
Collaborator

@mreszke mreszke left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There is a lot of logic inside useEffects on props change, and IMO it's not correct usage of effects. This logic should be fired when calling some onChange

AlithAnar
AlithAnar reviewed Jul 15, 2022
View reviewed changes
packages/react-components/src/components/Datepicker/DatePicker.spec.tsx Outdated Show resolved Hide resolved
packages/react-components/src/components/Datepicker/DatePicker.spec.tsx Outdated Show resolved Hide resolved
packages/react-components/src/components/Datepicker/DatePicker.tsx Outdated

const [month, setMonth] = React.useState(propsMonth || new Date());

React.useEffect(() => {
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

do we need to supply React. namespace everywhere? you could import it directly

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It is a convention used across all components - I can change it, but what do others have to say about it? @marcinsawicki @sgraczyk

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We can drop importing * as React if whenever possible

packages/react-components/src/components/Datepicker/DatePicker.tsx Outdated Show resolved Hide resolved
packages/react-components/src/components/Datepicker/DatePicker.tsx Outdated Show resolved Hide resolved
packages/react-components/src/components/Datepicker/RangeDatePicker.tsx Outdated Show resolved Hide resolved
packages/react-components/src/components/Datepicker/RangeDatePicker.tsx Outdated Show resolved Hide resolved
packages/react-components/src/components/Datepicker/RangeDatePicker.tsx Outdated Show resolved Hide resolved
packages/react-components/src/components/Datepicker/helpers.ts Outdated Show resolved Hide resolved
packages/react-components/src/components/Datepicker/helpers.ts Outdated Show resolved Hide resolved
@sgraczyk sgraczyk linked an issue Jul 20, 2022 that may be closed by this pull request
[DatePicker] Component #331
Closed
@MichalPaszowski
Copy link
Contributor

There is a lot of logic inside useEffects on props change, and IMO it's not correct usage of effects. This logic should be fired when calling some onChange

I've had a screen-sharing session with Marek, and we have concluded that changing this would require rewriting a big chunk of code. It will stay at it is now until the component is rewritten to React DayPicker v8

@sgraczyk sgraczyk changed the title Datepicker component #331 Datepicker component Aug 26, 2022
@MichalPaszowski MichalPaszowski merged commit ebbb816 into v1 Aug 26, 2022
@MichalPaszowski MichalPaszowski deleted the datepicker branch August 26, 2022 12:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@kamilmateusiak kamilmateusiak kamilmateusiak left review comments

@MichalPaszowski MichalPaszowski MichalPaszowski left review comments

@mreszke mreszke mreszke approved these changes

@TomaszRatajczyk TomaszRatajczyk TomaszRatajczyk approved these changes

@sgraczyk sgraczyk sgraczyk approved these changes

@AlithAnar AlithAnar AlithAnar approved these changes

@walaszczykm walaszczykm Awaiting requested review from walaszczykm

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[DatePicker] Component
8 participants
@przemuh @skrabkab-design @kamilmateusiak @MichalPaszowski @sgraczyk @AlithAnar @TomaszRatajczyk @mreszke