Repository: kiwicom/mobile
Pull request #1397 (2019-01-03 14:48:20)

Translation fix
[jira](https://jira.kiwi.com/browse/MOBILE-2147)

RobinCsl: @tbergq Test is failing.

Patch:
diff --git a/app/hotels/src/filter/price/PriceFilter.js b/app/hotels/src/filter/price/PriceFilter.js
index b12fc7fc..0ed84769 100644
--- a/app/hotels/src/filter/price/PriceFilter.js
+++ b/app/hotels/src/filter/price/PriceFilter.js
@@ -1,7 +1,7 @@
 // @flow
 
 import * as React from 'react';
-import { TextIcon, Logger } from '@kiwicom/mobile-shared';
+import { TextIcon, Logger, Price } from '@kiwicom/mobile-shared';
 import {
   Translation,
   TranslationFragment,
@@ -91,9 +91,8 @@ class PriceFilter extends React.Component<PropsWithContext, State> {
       return (
         <TranslationFragment>
           <Translation passThrough="< " />
-          <Translation
-            id="hotels_search.filter.price_popup.price_label"
-            values={{
+          <Price
+            price={{
               amount: end * daysOfStay,
               currency: currency,
             }}
@@ -105,9 +104,8 @@ class PriceFilter extends React.Component<PropsWithContext, State> {
       return (
         <TranslationFragment>
           <Translation passThrough="> " />
-          <Translation
-            id="hotels_search.filter.price_popup.price_label"
-            values={{
+          <Price
+            price={{
               amount: start * daysOfStay,
               currency: currency,
             }}
@@ -117,17 +115,15 @@ class PriceFilter extends React.Component<PropsWithContext, State> {
     }
     return (
       <TranslationFragment>
-        <Translation
-          id="hotels_search.filter.price_popup.price_label"
-          values={{
+        <Price
+          price={{
             amount: start * daysOfStay,
             currency: currency,
           }}
         />
         <Translation passThrough=" - " />
-        <Translation
-          id="hotels_search.filter.price_popup.price_label"
-          values={{
+        <Price
+          price={{
             amount: end * daysOfStay,
             currency: currency,
           }}
diff --git a/app/hotels/src/filter/price/PricePopup.js b/app/hotels/src/filter/price/PricePopup.js
index 5d456616..663cf4f8 100644
--- a/app/hotels/src/filter/price/PricePopup.js
+++ b/app/hotels/src/filter/price/PricePopup.js
@@ -8,6 +8,7 @@ import {
   Slider,
   StyleSheet,
   SliderLabels,
+  Price,
 } from '@kiwicom/mobile-shared';
 import { Translation } from '@kiwicom/mobile-localization';
 import { defaultTokens } from '@kiwicom/mobile-orbit';
@@ -89,21 +90,19 @@ export default class PricePopup extends React.Component<Props, State> {
             max={max}
             min={min}
             startLabel={
-              <Translation
-                id="hotels_search.filter.price_popup.price_label"
-                values={{
+              <Price
+                price={{
                   amount: start * daysOfStay,
-                  currency: currency,
+                  currency,
                 }}
               />
             }
             startValue={start}
             endLabel={
-              <Translation
-                id="hotels_search.filter.price_popup.price_label"
-                values={{
+              <Price
+                price={{
                   amount: end * daysOfStay,
-                  currency: currency,
+                  currency,
                 }}
               />
             }
diff --git a/packages/localization/src/TranslationHelpers.js b/packages/localization/src/TranslationHelpers.js
index 57ae977c..ce5e313f 100644
--- a/packages/localization/src/TranslationHelpers.js
+++ b/packages/localization/src/TranslationHelpers.js
@@ -5,6 +5,8 @@ import DefaultVocabulary, {
   type TranslationKeysObject,
 } from './DefaultVocabulary';
 
+const NATIVE_TRANSLATION_PARAM_REGEX = /%([0-9]+)\$@/g;
+
 export const getTranslation = (
   translatedString: ?string,
   translationId: TranslationKeys,
@@ -28,7 +30,6 @@ export const getTranslation = (
   // %1$@, so we lose information about the variables.
   // We add this information back in:
   try {
-    const NATIVE_TRANSLATION_PARAM_REGEX = /%([0-9]+)\$@/g;
     const compatibleTranslatedString = translatedString.replace(
       NATIVE_TRANSLATION_PARAM_REGEX,
       (match, variableIndex) => {
@@ -41,9 +42,11 @@ export const getTranslation = (
         );
 
         if (originalParamMatches == null || originalParamMatches.length !== 1) {
-          throw new Error(
-            `There was a problem with translationId ${translationId}`,
+          console.warn(
+            `Missing translation parameter for ${translationId} variableIndex = ${variableIndex}`,
           );
+          // Translation has probably changed, but not been upated on phraseApp
+          return '';
         }
 
         return originalParamMatches[0];
diff --git a/packages/localization/src/vocabularies/Hotels.js b/packages/localization/src/vocabularies/Hotels.js
index 17be560e..44ff8639 100644
--- a/packages/localization/src/vocabularies/Hotels.js
+++ b/packages/localization/src/vocabularies/Hotels.js
@@ -38,7 +38,6 @@ export default {
   'hotels_search.filter.price_popup.save': 'Save',
   'hotels_search.filter.price_popup.title': 'Price range',
   'hotels_search.filter.price_popup.subtitle': 'per stay',
-  'hotels_search.filter.price_popup.price_label': '__1_amount__ __2_currency__',
   'hotels_search.filter.score_filter.rating': 'Rating',
   'hotels_search.filter.score_filter.rating.6': 'pleasant 6+',
   'hotels_search.filter.score_filter.rating.7': 'good 7+',
diff --git a/packages/shared/src/SliderLabels.js b/packages/shared/src/SliderLabels.js
index a0561358..503d7607 100644
--- a/packages/shared/src/SliderLabels.js
+++ b/packages/shared/src/SliderLabels.js
@@ -3,16 +3,16 @@
 import * as React from 'react';
 import { defaultTokens } from '@kiwicom/mobile-orbit';
 import { View } from 'react-native';
-import type { OnLayout } from '@kiwicom/mobile-shared';
+import { type OnLayout, Price } from '@kiwicom/mobile-shared';
 import { type TranslationType } from '@kiwicom/mobile-localization';
 
 import Text from './Text';
 import StyleSheet from './PlatformStyleSheet';
 
 type Props = {|
-  +startLabel: TranslationType,
+  +startLabel: TranslationType | React.Element<typeof Price>,
   +startValue: number,
-  +endLabel?: TranslationType,
+  +endLabel?: TranslationType | React.Element<typeof Price>,
   +endValue?: number,
   +max: number,
   +min: number,


Test patch:
diff --git a/packages/localization/src/__tests__/TranslationHelpers.test.js b/packages/localization/src/__tests__/TranslationHelpers.test.js
index 3d6ce67a..25554ff9 100644
--- a/packages/localization/src/__tests__/TranslationHelpers.test.js
+++ b/packages/localization/src/__tests__/TranslationHelpers.test.js
@@ -5,6 +5,8 @@ import { getTranslation } from '../TranslationHelpers';
 const vocabulary = {
   'single_hotel.hotel_review.reviews': '__count__ Reviews',
   'hotels.gallery.pagination': '__1_photoNumber__ of __2_totalPhotos__',
+  'single_hotel.book_now.description':
+    '__1_personCount__ Guests · __2_numberOfRooms__ Rooms',
 };
 
 describe('getTranslation:', () => {
@@ -40,12 +42,20 @@ describe('getTranslation:', () => {
     );
   });
 
+  it('handles changed translations', () => {
+    const translationId = 'single_hotel.book_now.description';
+    const translatedString = 'Počet hostů: %1$@ · Počet pokojů: %2$@ · %3$@';
+    expect(getTranslation(translatedString, translationId, vocabulary)).toBe(
+      'Počet hostů: __1_personCount__ · Počet pokojů: __2_numberOfRooms__ · ',
+    );
+  });
+
   it('returns translated string if parameter matching is not possible', () => {
     const translationId = 'hotels.gallery.pagination';
     const translatedString = '%1$@ of %2$@';
     const mistake = ' and MISTAKE %3$@';
     expect(
       getTranslation(translatedString + mistake, translationId, vocabulary),
-    ).toBe(translatedString + mistake);
+    ).toBe('__1_photoNumber__ of __2_totalPhotos__ and MISTAKE ');
   });
 });