Skip to content

Commit 55f2917

Browse files
authored
Merge pull request #14 from Proskynete/enhancement/month-day-allow
Enhancement/month day allow
2 parents fb40827 + 50b9be9 commit 55f2917

File tree

6 files changed

+149
-33
lines changed

6 files changed

+149
-33
lines changed

__tests__/content-year.spec.js

Lines changed: 57 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,62 @@ Enzyme.configure({ adapter: new Adapter() });
99

1010
describe('Description Component', () => {
1111
it('should render with text prop and wihtout optional prop', () => {
12-
const wrapper = shallow(<ContentYear year="hello" />);
13-
expect(wrapper.find('.item-year-component').text()).to.be.equal('hello');
12+
const wrapper = shallow(<ContentYear startYear="2018" />);
13+
expect(wrapper.find('.item-year-component').text()).to.be.equal('2018');
14+
});
15+
16+
it('should render with startYear and currentYear', () => {
17+
const wrapper = shallow(<ContentYear startYear="2018" currentYear />);
18+
expect(
19+
wrapper
20+
.find('.item-year-component')
21+
.at(0)
22+
.text(),
23+
).to.be.equal('2020');
24+
expect(
25+
wrapper
26+
.find('.item-year-component')
27+
.at(1)
28+
.text(),
29+
).to.be.equal('2018');
30+
});
31+
32+
it('should render with startMonth and default type', () => {
33+
const wrapper = shallow(<ContentYear startYear="2018" startMonth="1" />);
34+
expect(wrapper.find('.item-year-component').text()).to.be.equal('01-2018');
35+
});
36+
37+
it('should render with startMonth and text type', () => {
38+
const wrapper = shallow(
39+
<ContentYear startYear="2018" startMonth="1" monthType="text" />,
40+
);
41+
expect(wrapper.find('.item-year-component').text()).to.be.equal(
42+
'Jan, 2018',
43+
);
44+
});
45+
46+
it('should render full date with nonth, day, year and default type', () => {
47+
const wrapper = shallow(
48+
<ContentYear startYear="2018" startMonth="1" startDay="12" />,
49+
);
50+
51+
expect(wrapper.find('.item-year-component').text()).to.be.equal(
52+
'01-12-2018',
53+
);
54+
});
55+
56+
it('should render full date with nonth, day and year and text type', () => {
57+
const wrapper = shallow(
58+
<ContentYear
59+
startYear="2018"
60+
startMonth="1"
61+
startDay="12"
62+
monthType="text"
63+
/>,
64+
);
65+
66+
expect(wrapper.find('.item-year-component').text()).to.be.equal(
67+
'Jan 12, 2018',
68+
);
1469
});
1570
});

build/index.js

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/components/content_body/index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* eslint-disable no-tabs */
12
import React from 'react';
23
import PropTypes from 'prop-types';
34
import styled from 'styled-components';
Lines changed: 85 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* eslint-disable no-tabs */
12
import React from 'react';
23
import PropTypes from 'prop-types';
34
import styled from 'styled-components';
@@ -10,7 +11,7 @@ const YearComponent = styled.div`
1011
padding-bottom: 10px;
1112
position: relative;
1213
text-align: right;
13-
width: 50px;
14+
width: 100px;
1415
1516
&::after {
1617
background: #ccc;
@@ -28,37 +29,96 @@ const YearComponentItem = styled.div`
2829
margin-bottom: 8px;
2930
`;
3031

31-
const ContentYear = props => {
32-
const { startYear, currentYear } = props;
33-
const _date = new Date();
32+
const mapMonth = [
33+
'Jan',
34+
'Feb',
35+
'Mar',
36+
'Apr',
37+
'May',
38+
'Jun',
39+
'Jul',
40+
'Aug',
41+
'Sept',
42+
'Oct',
43+
'Nov',
44+
'Dec',
45+
];
3446

35-
return (
36-
<YearComponent className="year-component">
37-
{currentYear ? (
38-
<>
39-
<YearComponentItem className="item-year-component">
40-
{_date.getFullYear()}
41-
</YearComponentItem>
42-
<YearComponentItem className="item-year-component">
43-
{startYear}
44-
</YearComponentItem>
45-
</>
46-
) : (
47-
<YearComponentItem className="item-year-component">
48-
{startYear}
49-
</YearComponentItem>
50-
)}
51-
</YearComponent>
52-
);
47+
const handleTransformMonth = (month, type) => {
48+
if (type === 'number') {
49+
return month.length === 1 ? `0${month}` : month;
50+
}
51+
const index = month - 1;
52+
return mapMonth[index];
53+
};
54+
55+
const handleGetDate = (month, type, day, year) => {
56+
const newMonth = handleTransformMonth(month, type);
57+
58+
if (day !== '' && month !== '') {
59+
if (type === 'text') {
60+
return `${newMonth} ${day}, ${year}`;
61+
}
62+
return `${newMonth}-${day}-${year}`;
63+
}
64+
if (month !== '') {
65+
if (type === 'text') {
66+
return `${newMonth}, ${year}`;
67+
}
68+
return `${newMonth}-${year}`;
69+
}
70+
return year;
71+
};
72+
73+
const handlePrintDate = (mounth, day, year, monthType, current) => {
74+
const date = new Date();
75+
const startDate = handleGetDate(mounth, monthType, day, year);
76+
77+
if (current) {
78+
return (
79+
<>
80+
<YearComponentItem className="item-year-component">
81+
{date.getFullYear()}
82+
</YearComponentItem>
83+
<YearComponentItem className="item-year-component">
84+
{startDate}
85+
</YearComponentItem>
86+
</>
87+
);
88+
}
89+
return (
90+
<YearComponentItem className="item-year-component">
91+
{startDate}
92+
</YearComponentItem>
93+
);
94+
};
95+
96+
const ContentYear = (props) => {
97+
const {
98+
startMonth, startDay, startYear, monthType, currentYear,
99+
} = props;
100+
101+
return (
102+
<YearComponent className="year-component">
103+
{handlePrintDate(startMonth, startDay, startYear, monthType, currentYear)}
104+
</YearComponent>
105+
);
53106
};
54107

55108
ContentYear.defaultProps = {
56-
currentYear: false
109+
startMonth: '',
110+
monthType: 'number',
111+
startDay: '',
112+
currentYear: false,
57113
};
58114

59115
ContentYear.propTypes = {
60-
startYear: PropTypes.number.isRequired,
61-
currentYear: PropTypes.bool
116+
startMonth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
117+
monthType: PropTypes.oneOf(['text', 'number']),
118+
startDay: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
119+
startYear: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
120+
.isRequired,
121+
currentYear: PropTypes.bool,
62122
};
63123

64124
export default ContentYear;

src/components/description/index.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* eslint-disable no-tabs */
12
import React from 'react';
23
import PropTypes from 'prop-types';
34
import styled from 'styled-components';
@@ -37,9 +38,7 @@ const Description = (props) => {
3738
<DescriptionComponentTextOptional className="optional-description-component">
3839
{optional}
3940
</DescriptionComponentTextOptional>
40-
) : (
41-
''
42-
)}
41+
) : null}
4342
</DescriptionComponent>
4443
);
4544
};

src/components/timeline/index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* eslint-disable no-tabs */
12
import React from 'react';
23
import PropTypes from 'prop-types';
34
import styled from 'styled-components';

0 commit comments

Comments
 (0)