@dhis2/analytics 21.2.2 → 21.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ ## [21.2.3](https://github.com/dhis2/analytics/compare/v21.2.2...v21.2.3) (2022-01-05)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * fetch translations for field labels from api ([#1119](https://github.com/dhis2/analytics/issues/1119)) ([e2fcacc](https://github.com/dhis2/analytics/commit/e2fcaccbd058a8e85a99e032f6341e7f15a83b94))
7
+
1
8
  ## [21.2.2](https://github.com/dhis2/analytics/compare/v21.2.1...v21.2.2) (2021-12-28)
2
9
 
3
10
 
@@ -37,17 +37,13 @@ const TranslationForm = ({
37
37
  }) => {
38
38
  const [newTranslations, setNewTranslations] = (0, _react.useState)();
39
39
  const [translationLocale, setTranslationLocale] = (0, _react.useState)();
40
+ const [fieldsTranslations, setFieldsTranslations] = (0, _react.useState)({});
40
41
  const {
41
42
  show: showError
42
43
  } = (0, _appRuntime.useAlert)(error => error, {
43
44
  critical: true
44
45
  });
45
46
 
46
- const formatFieldLabel = field => {
47
- field.replace(/[a-z][A-Z]/g, match => [match.charAt(0), match.charAt(1)].join(' ')).toLowerCase();
48
- return field.charAt(0).toUpperCase() + field.slice(1);
49
- };
50
-
51
47
  const camelCaseToUnderscores = field => field.replace(/[a-z][A-Z]/g, match => [match.charAt(0), match.charAt(1)].join('_')).toLowerCase();
52
48
 
53
49
  const getTranslationIndexForField = field => newTranslations.findIndex(element => element.locale === translationLocale && element.property.toLowerCase() === camelCaseToUnderscores(field));
@@ -69,6 +65,14 @@ const TranslationForm = ({
69
65
  setNewTranslations(translationIndex === -1 ? [...newTranslations, newTranslation] : newTranslations.map((translation, index) => index === translationIndex ? newTranslation : translation));
70
66
  };
71
67
 
68
+ const [fetchFieldsTranslations] = (0, _appRuntime.useDataMutation)({
69
+ resource: 'i18n',
70
+ type: 'create',
71
+ data: fieldsToTranslate.map(camelCaseToUnderscores)
72
+ }, {
73
+ onComplete: res => setFieldsTranslations(res),
74
+ onError: error => showError(error)
75
+ });
72
76
  const translationsMutationRef = (0, _react.useRef)({
73
77
  resource: "".concat(resource, "/translations"),
74
78
  type: 'update',
@@ -85,9 +89,7 @@ const TranslationForm = ({
85
89
  onTranslationSaved();
86
90
  onClose();
87
91
  },
88
- onError: error => {
89
- showError(error);
90
- }
92
+ onError: error => showError(error)
91
93
  });
92
94
 
93
95
  const onLocaleChange = locale => {
@@ -100,6 +102,11 @@ const TranslationForm = ({
100
102
  });
101
103
 
102
104
  (0, _react.useEffect)(() => setTranslationLocale(window.sessionStorage.getItem(SESSION_STORAGE_TRANSLATION_LOCALE_KEY)), []);
105
+ (0, _react.useEffect)(() => {
106
+ const fetchTranslations = () => fetchFieldsTranslations(fieldsToTranslate);
107
+
108
+ fetchTranslations();
109
+ }, [fieldsToTranslate]);
103
110
  (0, _react.useEffect)(() => setNewTranslations(translations), [translations]);
104
111
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ui.ModalContent, null, /*#__PURE__*/_react.default.createElement(_ui.DataTable, {
105
112
  layout: "fixed"
@@ -114,21 +121,17 @@ const TranslationForm = ({
114
121
  onChange: onLocaleChange
115
122
  })))), /*#__PURE__*/_react.default.createElement(_ui.DataTableBody, null, fieldsToTranslate.map((field, index) => /*#__PURE__*/_react.default.createElement(_ui.DataTableRow, {
116
123
  key: field
117
- }, /*#__PURE__*/_react.default.createElement(_ui.DataTableCell, null, /*#__PURE__*/_react.default.createElement("div", {
118
- className: ""
119
- }, /*#__PURE__*/_react.default.createElement(_ui.InputField, {
120
- label: formatFieldLabel(field),
124
+ }, /*#__PURE__*/_react.default.createElement(_ui.DataTableCell, null, /*#__PURE__*/_react.default.createElement(_ui.InputField, {
125
+ label: fieldsTranslations[field],
121
126
  value: objectToTranslate[field],
122
127
  readOnly: true
123
- }))), translationLocale && /*#__PURE__*/_react.default.createElement(_ui.DataTableCell, null, /*#__PURE__*/_react.default.createElement("div", {
124
- className: ""
125
- }, /*#__PURE__*/_react.default.createElement(_ui.InputField, {
126
- label: formatFieldLabel(field),
128
+ })), translationLocale && /*#__PURE__*/_react.default.createElement(_ui.DataTableCell, null, /*#__PURE__*/_react.default.createElement(_ui.InputField, {
129
+ label: fieldsTranslations[field],
127
130
  value: getTranslationForField(field),
128
131
  onChange: ({
129
132
  value
130
133
  }) => setTranslationForField(field, value)
131
- }))), !translationLocale && index === 0 && /*#__PURE__*/_react.default.createElement(_ui.DataTableCell, {
134
+ })), !translationLocale && index === 0 && /*#__PURE__*/_react.default.createElement(_ui.DataTableCell, {
132
135
  rowSpan: String(fieldsToTranslate.length)
133
136
  }, /*#__PURE__*/_react.default.createElement(_ui.CenteredContent, null, _d2I18n.default.t('Choose a locale to translate from the menu above')))))))), /*#__PURE__*/_react.default.createElement(_TranslationModalActions.TranslationModalActions, {
134
137
  onClose: onClose,
@@ -16,17 +16,13 @@ export const TranslationForm = ({
16
16
  }) => {
17
17
  const [newTranslations, setNewTranslations] = useState();
18
18
  const [translationLocale, setTranslationLocale] = useState();
19
+ const [fieldsTranslations, setFieldsTranslations] = useState({});
19
20
  const {
20
21
  show: showError
21
22
  } = useAlert(error => error, {
22
23
  critical: true
23
24
  });
24
25
 
25
- const formatFieldLabel = field => {
26
- field.replace(/[a-z][A-Z]/g, match => [match.charAt(0), match.charAt(1)].join(' ')).toLowerCase();
27
- return field.charAt(0).toUpperCase() + field.slice(1);
28
- };
29
-
30
26
  const camelCaseToUnderscores = field => field.replace(/[a-z][A-Z]/g, match => [match.charAt(0), match.charAt(1)].join('_')).toLowerCase();
31
27
 
32
28
  const getTranslationIndexForField = field => newTranslations.findIndex(element => element.locale === translationLocale && element.property.toLowerCase() === camelCaseToUnderscores(field));
@@ -48,6 +44,14 @@ export const TranslationForm = ({
48
44
  setNewTranslations(translationIndex === -1 ? [...newTranslations, newTranslation] : newTranslations.map((translation, index) => index === translationIndex ? newTranslation : translation));
49
45
  };
50
46
 
47
+ const [fetchFieldsTranslations] = useDataMutation({
48
+ resource: 'i18n',
49
+ type: 'create',
50
+ data: fieldsToTranslate.map(camelCaseToUnderscores)
51
+ }, {
52
+ onComplete: res => setFieldsTranslations(res),
53
+ onError: error => showError(error)
54
+ });
51
55
  const translationsMutationRef = useRef({
52
56
  resource: "".concat(resource, "/translations"),
53
57
  type: 'update',
@@ -64,9 +68,7 @@ export const TranslationForm = ({
64
68
  onTranslationSaved();
65
69
  onClose();
66
70
  },
67
- onError: error => {
68
- showError(error);
69
- }
71
+ onError: error => showError(error)
70
72
  });
71
73
 
72
74
  const onLocaleChange = locale => {
@@ -79,6 +81,11 @@ export const TranslationForm = ({
79
81
  });
80
82
 
81
83
  useEffect(() => setTranslationLocale(window.sessionStorage.getItem(SESSION_STORAGE_TRANSLATION_LOCALE_KEY)), []);
84
+ useEffect(() => {
85
+ const fetchTranslations = () => fetchFieldsTranslations(fieldsToTranslate);
86
+
87
+ fetchTranslations();
88
+ }, [fieldsToTranslate]);
82
89
  useEffect(() => setNewTranslations(translations), [translations]);
83
90
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ModalContent, null, /*#__PURE__*/React.createElement(DataTable, {
84
91
  layout: "fixed"
@@ -93,21 +100,17 @@ export const TranslationForm = ({
93
100
  onChange: onLocaleChange
94
101
  })))), /*#__PURE__*/React.createElement(DataTableBody, null, fieldsToTranslate.map((field, index) => /*#__PURE__*/React.createElement(DataTableRow, {
95
102
  key: field
96
- }, /*#__PURE__*/React.createElement(DataTableCell, null, /*#__PURE__*/React.createElement("div", {
97
- className: ""
98
- }, /*#__PURE__*/React.createElement(InputField, {
99
- label: formatFieldLabel(field),
103
+ }, /*#__PURE__*/React.createElement(DataTableCell, null, /*#__PURE__*/React.createElement(InputField, {
104
+ label: fieldsTranslations[field],
100
105
  value: objectToTranslate[field],
101
106
  readOnly: true
102
- }))), translationLocale && /*#__PURE__*/React.createElement(DataTableCell, null, /*#__PURE__*/React.createElement("div", {
103
- className: ""
104
- }, /*#__PURE__*/React.createElement(InputField, {
105
- label: formatFieldLabel(field),
107
+ })), translationLocale && /*#__PURE__*/React.createElement(DataTableCell, null, /*#__PURE__*/React.createElement(InputField, {
108
+ label: fieldsTranslations[field],
106
109
  value: getTranslationForField(field),
107
110
  onChange: ({
108
111
  value
109
112
  }) => setTranslationForField(field, value)
110
- }))), !translationLocale && index === 0 && /*#__PURE__*/React.createElement(DataTableCell, {
113
+ })), !translationLocale && index === 0 && /*#__PURE__*/React.createElement(DataTableCell, {
111
114
  rowSpan: String(fieldsToTranslate.length)
112
115
  }, /*#__PURE__*/React.createElement(CenteredContent, null, i18n.t('Choose a locale to translate from the menu above')))))))), /*#__PURE__*/React.createElement(TranslationModalActions, {
113
116
  onClose: onClose,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dhis2/analytics",
3
- "version": "21.2.2",
3
+ "version": "21.2.3",
4
4
  "main": "./build/cjs/index.js",
5
5
  "module": "./build/es/index.js",
6
6
  "exports": {