@dhis2-ui/calendar 8.12.1 → 8.12.3

Sign up to get free protection for your applications and to get access to all the features.
@@ -23,6 +23,8 @@ const wrapperBorderColor = _uiConstants.colors.grey300;
23
23
  const headerBackground = _uiConstants.colors.grey050;
24
24
 
25
25
  const NavigationContainer = _ref => {
26
+ var _currYear$label;
27
+
26
28
  let {
27
29
  languageDirection,
28
30
  pickerOptions
@@ -36,7 +38,10 @@ const NavigationContainer = _ref => {
36
38
  nextYear,
37
39
  prevMonth,
38
40
  prevYear
39
- } = pickerOptions;
41
+ } = pickerOptions; // Ethiopic years - when localised to English - add the era (i.e. 2015 ERA1), which is redundant in practice (like writing AD for gregorian years)
42
+ // there is an ongoing discussion in JS-Temporal polyfill whether the era should be included or not, but for our case, it's safer to remove it
43
+
44
+ const currentYearLabel = (_currYear$label = currYear.label) === null || _currYear$label === void 0 ? void 0 : _currYear$label.toString().replace(/ERA1/, '');
40
45
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
41
46
  className: _style.default.dynamic([["3883083596", [_uiConstants.spacers.dp4, _uiConstants.colors.grey600, _uiConstants.colors.grey200, _uiConstants.colors.grey900, _uiConstants.colors.grey300, _uiConstants.spacers.dp8, _uiConstants.spacers.dp4, wrapperBorderColor, headerBackground]]]) + " " + "navigation-container"
42
47
  }, /*#__PURE__*/_react.default.createElement("div", {
@@ -82,8 +87,9 @@ const NavigationContainer = _ref => {
82
87
  }))), /*#__PURE__*/_react.default.createElement("div", {
83
88
  className: _style.default.dynamic([["3883083596", [_uiConstants.spacers.dp4, _uiConstants.colors.grey600, _uiConstants.colors.grey200, _uiConstants.colors.grey900, _uiConstants.colors.grey300, _uiConstants.spacers.dp8, _uiConstants.spacers.dp4, wrapperBorderColor, headerBackground]]]) + " " + "curr"
84
89
  }, /*#__PURE__*/_react.default.createElement("span", {
90
+ "data-test": "calendar-current-year",
85
91
  className: _style.default.dynamic([["3883083596", [_uiConstants.spacers.dp4, _uiConstants.colors.grey600, _uiConstants.colors.grey200, _uiConstants.colors.grey900, _uiConstants.colors.grey300, _uiConstants.spacers.dp8, _uiConstants.spacers.dp4, wrapperBorderColor, headerBackground]]]) + " " + "label"
86
- }, currYear.label)), /*#__PURE__*/_react.default.createElement("div", {
92
+ }, currentYearLabel)), /*#__PURE__*/_react.default.createElement("div", {
87
93
  className: _style.default.dynamic([["3883083596", [_uiConstants.spacers.dp4, _uiConstants.colors.grey600, _uiConstants.colors.grey200, _uiConstants.colors.grey900, _uiConstants.colors.grey300, _uiConstants.spacers.dp8, _uiConstants.spacers.dp4, wrapperBorderColor, headerBackground]]]) + " " + "next"
88
94
  }, /*#__PURE__*/_react.default.createElement("button", {
89
95
  onClick: nextYear.navigateTo,
@@ -30,6 +30,9 @@ var _steps = require("cypress-cucumber-preprocessor/steps");
30
30
  cy.get('[data-test="calendar-previous-month"]').click();
31
31
  cy.contains(months.previous).should('be.visible');
32
32
  });
33
+ (0, _steps.And)('the era should not be displayed in the year', () => {
34
+ cy.get('[data-test="calendar-current-year"]').should('not.contain.text', 'ERA1');
35
+ });
33
36
  (0, _steps.Then)('we should be able to select a day', () => {
34
37
  const date = '2014-02-03';
35
38
  cy.get("[data-test=\"".concat(date, "\"]")).click();
@@ -13,6 +13,7 @@ Feature: The Calendar renders in the Ethiopic calendar system
13
13
  Given an Ethiopic calendar is rendered in "english"
14
14
  Then days should be rendered in "english"
15
15
  And months should be rendered in "english" with navigation
16
+ And the era should not be displayed in the year
16
17
 
17
18
  Scenario: Select a day in the Ethiopic calendar in English
18
19
  Given an Ethiopic calendar is rendered in English
@@ -56,7 +56,8 @@ const EthiopicWithAmharic = buildCalendar({
56
56
  });
57
57
  exports.EthiopicWithAmharic = EthiopicWithAmharic;
58
58
  const EthiopicWithEnglish = buildCalendar({
59
- calendar: 'ethiopic',
59
+ calendar: 'ethiopian',
60
+ // using "ethiopian" rather than the correct "ethiopic" to immitate DHIS2 calendar types
60
61
  locale: 'en-ET',
61
62
  date: '2014-02-03' // 13 Oct 2021
62
63
 
@@ -7,6 +7,8 @@ import i18n from '../locales/index.js';
7
7
  const wrapperBorderColor = colors.grey300;
8
8
  const headerBackground = colors.grey050;
9
9
  export const NavigationContainer = _ref => {
10
+ var _currYear$label;
11
+
10
12
  let {
11
13
  languageDirection,
12
14
  pickerOptions
@@ -20,7 +22,10 @@ export const NavigationContainer = _ref => {
20
22
  nextYear,
21
23
  prevMonth,
22
24
  prevYear
23
- } = pickerOptions;
25
+ } = pickerOptions; // Ethiopic years - when localised to English - add the era (i.e. 2015 ERA1), which is redundant in practice (like writing AD for gregorian years)
26
+ // there is an ongoing discussion in JS-Temporal polyfill whether the era should be included or not, but for our case, it's safer to remove it
27
+
28
+ const currentYearLabel = (_currYear$label = currYear.label) === null || _currYear$label === void 0 ? void 0 : _currYear$label.toString().replace(/ERA1/, '');
24
29
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
25
30
  className: _JSXStyle.dynamic([["3883083596", [spacers.dp4, colors.grey600, colors.grey200, colors.grey900, colors.grey300, spacers.dp8, spacers.dp4, wrapperBorderColor, headerBackground]]]) + " " + "navigation-container"
26
31
  }, /*#__PURE__*/React.createElement("div", {
@@ -66,8 +71,9 @@ export const NavigationContainer = _ref => {
66
71
  }))), /*#__PURE__*/React.createElement("div", {
67
72
  className: _JSXStyle.dynamic([["3883083596", [spacers.dp4, colors.grey600, colors.grey200, colors.grey900, colors.grey300, spacers.dp8, spacers.dp4, wrapperBorderColor, headerBackground]]]) + " " + "curr"
68
73
  }, /*#__PURE__*/React.createElement("span", {
74
+ "data-test": "calendar-current-year",
69
75
  className: _JSXStyle.dynamic([["3883083596", [spacers.dp4, colors.grey600, colors.grey200, colors.grey900, colors.grey300, spacers.dp8, spacers.dp4, wrapperBorderColor, headerBackground]]]) + " " + "label"
70
- }, currYear.label)), /*#__PURE__*/React.createElement("div", {
76
+ }, currentYearLabel)), /*#__PURE__*/React.createElement("div", {
71
77
  className: _JSXStyle.dynamic([["3883083596", [spacers.dp4, colors.grey600, colors.grey200, colors.grey900, colors.grey300, spacers.dp8, spacers.dp4, wrapperBorderColor, headerBackground]]]) + " " + "next"
72
78
  }, /*#__PURE__*/React.createElement("button", {
73
79
  onClick: nextYear.navigateTo,
@@ -27,6 +27,9 @@ And('months should be rendered in "{word}" with navigation', language => {
27
27
  cy.get('[data-test="calendar-previous-month"]').click();
28
28
  cy.contains(months.previous).should('be.visible');
29
29
  });
30
+ And('the era should not be displayed in the year', () => {
31
+ cy.get('[data-test="calendar-current-year"]').should('not.contain.text', 'ERA1');
32
+ });
30
33
  Then('we should be able to select a day', () => {
31
34
  const date = '2014-02-03';
32
35
  cy.get("[data-test=\"".concat(date, "\"]")).click();
@@ -13,6 +13,7 @@ Feature: The Calendar renders in the Ethiopic calendar system
13
13
  Given an Ethiopic calendar is rendered in "english"
14
14
  Then days should be rendered in "english"
15
15
  And months should be rendered in "english" with navigation
16
+ And the era should not be displayed in the year
16
17
 
17
18
  Scenario: Select a day in the Ethiopic calendar in English
18
19
  Given an Ethiopic calendar is rendered in English
@@ -40,7 +40,8 @@ export const EthiopicWithAmharic = buildCalendar({
40
40
 
41
41
  });
42
42
  export const EthiopicWithEnglish = buildCalendar({
43
- calendar: 'ethiopic',
43
+ calendar: 'ethiopian',
44
+ // using "ethiopian" rather than the correct "ethiopic" to immitate DHIS2 calendar types
44
45
  locale: 'en-ET',
45
46
  date: '2014-02-03' // 13 Oct 2021
46
47
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dhis2-ui/calendar",
3
- "version": "8.12.1",
3
+ "version": "8.12.3",
4
4
  "description": "UI Calendar",
5
5
  "repository": {
6
6
  "type": "git",
@@ -31,15 +31,15 @@
31
31
  "styled-jsx": "^4"
32
32
  },
33
33
  "dependencies": {
34
- "@dhis2-ui/button": "8.12.1",
35
- "@dhis2-ui/card": "8.12.1",
36
- "@dhis2-ui/input": "8.12.1",
37
- "@dhis2-ui/layer": "8.12.1",
38
- "@dhis2-ui/popper": "8.12.1",
39
- "@dhis2/multi-calendar-dates": "1.0.0-alpha.18",
34
+ "@dhis2-ui/button": "8.12.3",
35
+ "@dhis2-ui/card": "8.12.3",
36
+ "@dhis2-ui/input": "8.12.3",
37
+ "@dhis2-ui/layer": "8.12.3",
38
+ "@dhis2-ui/popper": "8.12.3",
39
+ "@dhis2/multi-calendar-dates": "1.0.2",
40
40
  "@dhis2/prop-types": "^3.1.2",
41
- "@dhis2/ui-constants": "8.12.1",
42
- "@dhis2/ui-icons": "8.12.1",
41
+ "@dhis2/ui-constants": "8.12.3",
42
+ "@dhis2/ui-icons": "8.12.3",
43
43
  "classnames": "^2.3.1",
44
44
  "prop-types": "^15.7.2"
45
45
  },