Skip to content

Commit

Permalink
fix(yearPicker): initialize page with selected value
Browse files Browse the repository at this point in the history
  • Loading branch information
@arfedulov
arfedulov committed Oct 27, 2018
1 parent 8d7ef36 commit 6c639aa
Show file tree
Hide file tree
Showing 3 changed files with 100 additions and 93 deletions.
7 changes: 6 additions & 1 deletion src/inputs/YearInput.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,11 @@ class YearInput extends BaseInput {
dateFormat,
} = this.props;
const rest = getUnhandledProps(YearInput, this.props);
const initializeWith = getInitializer({
dateParams: { year: parseInt(value) },
initialDate,
dateFormat,
});
return (
<InputView
popupIsClosed={this.state.popupIsClosed}
Expand All @@ -54,7 +59,7 @@ class YearInput extends BaseInput {
value={value}>
<YearPicker
onChange={this.handleSelect}
initializeWith={getInitializer({ initialDate, dateFormat })}
initializeWith={initializeWith}
value={parseValue(value, dateFormat)}
disable={parseArrayOrValue(disable, dateFormat)}
maxDate={parseValue(maxDate, dateFormat)}
Expand Down
4 changes: 3 additions & 1 deletion src/pickers/YearPicker.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,9 @@ class YearPicker extends React.Component {
that used to populate calendar's page.
*/
const years = [];
const first = this.state.date.year();
const date = this.state.date;
const padd = date.year() % YEARS_ON_PAGE;
const first = date.year() - padd;
for (let i = 0; i < YEARS_ON_PAGE; i++) {
years[i] = (first + i).toString();
}
Expand Down
182 changes: 91 additions & 91 deletions test/pickers/testYearPicker.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,10 +57,10 @@ describe('<YearPicker />: buildYears', function() {
it('has `buildYears` method that works properly', () => {
const date = moment('2015-05-01');
const shouldBuildYears = [
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
];
const wrapper = shallow(<YearPicker initializeWith={date} />);
assert(_.isFunction(wrapper.instance().buildYears), 'has the method');
Expand All @@ -80,18 +80,18 @@ describe('<YearPicker />: getActiveYearPosition', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
initializeWith={date}
value={moment('2016-01-01')} />);
value={moment('2012-01-01')} />);
assert(_.isFunction(wrapper.instance().getActiveYearPosition), 'has the method');
assert(_.isNumber(wrapper.instance().getActiveYearPosition()), 'method returns number');
assert.equal(wrapper.instance().getActiveYearPosition(), 1, 'method returns active year index');
assert.equal(wrapper.instance().getActiveYearPosition(), 8, 'method returns active year index');
});

it('works properly when `value` prop is undefined', () => {
Expand All @@ -107,14 +107,14 @@ describe('<YearPicker />: getDisabledYearsPositions', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
disable={[moment('2017-01-01'), moment('2019-01-01')]}
disable={[moment('2006-01-01'), moment('2008-01-01')]}
initializeWith={date} />);
assert(_.isFunction(wrapper.instance().getDisabledYearsPositions), 'has the method');
assert(_.isArray(wrapper.instance().getDisabledYearsPositions()), 'method returns an array');
Expand All @@ -130,14 +130,14 @@ describe('<YearPicker />: getDisabledYearsPositions', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
maxDate={moment('2022-01-01')}
maxDate={moment('2011-01-01')}
initializeWith={date} />);
assert(_.isArray(wrapper.instance().getDisabledYearsPositions()), 'method returns an array');
assert.equal(wrapper.instance().getDisabledYearsPositions().length, 4, 'method returns an array of length 4');
Expand All @@ -154,14 +154,14 @@ describe('<YearPicker />: getDisabledYearsPositions', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
minDate={moment('2017-01-01')}
minDate={moment('2006-01-01')}
initializeWith={date} />);
assert(_.isArray(wrapper.instance().getDisabledYearsPositions()), 'method returns an array');
assert.equal(wrapper.instance().getDisabledYearsPositions().length, 2, 'method returns an array of length 2');
Expand All @@ -176,16 +176,16 @@ describe('<YearPicker />: getDisabledYearsPositions', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
minDate={moment('2017-01-01')}
maxDate={moment('2025-01-01')}
disable={[moment('2019-01-01')]}
minDate={moment('2006-01-01')}
maxDate={moment('2014-01-01')}
disable={[moment('2008-01-01')]}
initializeWith={date} />);
/* disabled indexes: 0, 1, 4, 11 */
assert(_.isArray(wrapper.instance().getDisabledYearsPositions()), 'method returns an array');
Expand All @@ -203,10 +203,10 @@ describe('<YearPicker />: getDisabledYearsPositions', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
Expand All @@ -223,18 +223,18 @@ describe('<YearPicker />: getDisabledYearsPositions', function() {
const minDate = moment('2015-02-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
initializeWith={date}
maxDate={maxDate}
minDate={minDate} />);

const shouldReturn = _.range(1, YEARS_ON_PAGE);
const shouldReturn = _.range(0, YEARS_ON_PAGE - 1);
assert(_.isFunction(wrapper.instance().getDisabledYearsPositions), 'has the method');
assert.equal(wrapper.instance().getDisabledYearsPositions().length, 11, 'method returns an array of length 11');
_.forEach(wrapper.instance().getDisabledYearsPositions(), (disabledIndex) => {
Expand All @@ -251,14 +251,14 @@ describe('<YearPicker />: getDisabledYearsPositions', function() {
const YEARS_ON_PAGE = 12;
it('return all positions', () => {
const date = moment('2015-05-01');
const maxDate = moment('2013-05-01');
const minDate = moment('2014-02-01');
const maxDate = moment('1999-05-01');
const minDate = moment('1995-02-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
Expand All @@ -283,14 +283,14 @@ describe('<YearPicker />: getDisabledYearsPositions', function() {
const YEARS_ON_PAGE = 12;
it('return all positions', () => {
const date = moment('2015-05-01');
const maxDate = moment('2029-05-01');
const minDate = moment('2027-02-01');
const maxDate = moment('2020-05-01');
const minDate = moment('2018-02-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
Expand All @@ -317,10 +317,10 @@ describe('<YearPicker />: isNextPageAvailable', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
Expand All @@ -336,14 +336,14 @@ describe('<YearPicker />: isNextPageAvailable', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
maxDate={moment('2025-01-01')}
maxDate={moment('2014-01-01')}
initializeWith={date} />);

it('returns false', () => {
Expand All @@ -355,14 +355,14 @@ describe('<YearPicker />: isNextPageAvailable', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
maxDate={moment('2026-01-01')}
maxDate={moment('2015-01-01')}
initializeWith={date} />);

it('returns false', () => {
Expand All @@ -374,14 +374,14 @@ describe('<YearPicker />: isNextPageAvailable', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
maxDate={moment('2027-01-01')}
maxDate={moment('2018-01-01')}
initializeWith={date} />);

it('returns true', () => {
Expand All @@ -395,10 +395,10 @@ describe('<YearPicker />: isPrevPageAvailable', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
Expand All @@ -414,14 +414,14 @@ describe('<YearPicker />: isPrevPageAvailable', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
minDate={moment('2025-01-01')}
minDate={moment('2014-01-01')}
initializeWith={date} />);

it('returns false', () => {
Expand All @@ -433,14 +433,14 @@ describe('<YearPicker />: isPrevPageAvailable', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
minDate={moment('2015-01-01')}
minDate={moment('2004-01-01')}
initializeWith={date} />);

it('returns false', () => {
Expand All @@ -452,14 +452,14 @@ describe('<YearPicker />: isPrevPageAvailable', function() {
const date = moment('2015-05-01');
/*
[
'2015', '2016', '2017',
'2018', '2019', '2020',
'2021', '2022', '2023',
'2024', '2025', '2026',
'2004', '2005', '2006',
'2007', '2008', '2009',
'2010', '2011', '2012',
'2013', '2014', '2015',
]
*/
const wrapper = shallow(<YearPicker
minDate={moment('2014-01-01')}
minDate={moment('2003-01-01')}
initializeWith={date} />);

it('returns true', () => {
Expand Down

0 comments on commit 6c639aa

Please sign in to comment.