fix(FEC-11219): share tooltip not localized (#595)

Use Localizer for the share buttons Solves FEC-11219
kaltura · May 9, 2021 · e436218 · e436218
1 parent 9ad55b9
commit e436218
Show file tree

Hide file tree

Showing 8 changed files with 141 additions and 22 deletions.
diff --git a/src/components/share-overlay/share-overlay.js b/src/components/share-overlay/share-overlay.js
@@ -54,17 +54,19 @@ const ShareButton = (props: Object): React$Element<any> => {
   };
 
   return (
-    <Button
-      ref={el => {
-        props.addAccessibleChild(el);
-      }}
-      title={props.config.title}
-      role="link"
-      aria-label={props.config.ariaLabel}
-      className={[style.btnRounded, style[props.config.iconType], props.config.iconType].join(' ')}
-      onClick={share}>
-      <Icon style={props.config.iconType === 'svg' ? `background-image: url(${props.config.svg})` : ``} type={props.config.iconType} />
-    </Button>
+    <Localizer>
+      <Button
+        ref={el => {
+          props.addAccessibleChild(el);
+        }}
+        title={<Text id={props.config.title} />}
+        role="link"
+        aria-label={<Text id={props.config.ariaLabel} />}
+        className={[style.btnRounded, style[props.config.iconType], props.config.iconType].join(' ')}
+        onClick={share}>
+        <Icon style={props.config.iconType === 'svg' ? `background-image: url(${props.config.svg})` : ``} type={props.config.iconType} />
+      </Button>
+    </Localizer>
   );
 };
 

diff --git a/src/components/share/default-config.js b/src/components/share/default-config.js
@@ -2,24 +2,24 @@ const defaultConfig = [
   {
     name: 'facebook',
     templateUrl: 'https://www.facebook.com/sharer/sharer.php?u={shareUrl}',
-    title: 'Share on Facebook',
-    ariaLabel: 'Share on Facebook',
+    title: 'share.share-on-facebook',
+    ariaLabel: 'share.share-on-facebook',
     iconType: 'default',
     svg: ''
   },
   {
     name: 'linkedin',
     templateUrl: 'https://www.linkedin.com/shareArticle?mini=true&url={shareUrl}',
-    title: 'Share on Linkedin',
-    ariaLabel: 'Share on Linkedin',
+    title: 'share.share-on-linkedin',
+    ariaLabel: 'share.share-on-linkedin',
     iconType: 'default',
     svg: ''
   },
   {
     name: 'twitter',
     templateUrl: 'https://twitter.com/share?url={shareUrl}',
-    title: 'Share on Twitter',
-    ariaLabel: 'Share on Twitter',
+    title: 'share.share-on-twitter',
+    ariaLabel: 'share.share-on-twitter',
     iconType: 'default',
     svg: ''
   }

diff --git a/translations/de.i18n.json b/translations/de.i18n.json
@@ -43,7 +43,10 @@
       "embed_options": "Einbettungsoptionen",
       "start_video_at": "Startzeitpunkt Video",
       "email": "Per E-Mail teilen",
-      "embed": "Einbettungscode generieren"
+      "embed": "Einbettungscode generieren",
+      "share-on-facebook": "Auf Facebook teilen",
+      "share-on-twitter": "Auf Twitter teilen",
+      "share-on-linkedin": "Auf Linkedin teilen"
     },
     "overlay": {
       "close": "Schließen"

diff --git a/translations/en.i18n.json b/translations/en.i18n.json
@@ -45,7 +45,10 @@
       "embed_options": "Embed Options",
       "start_video_at": "Start video at",
       "email": "Share on Email",
-      "embed": "Get embed code"
+      "embed": "Get embed code",
+      "share-on-facebook": "Share on Facebook",
+      "share-on-linkedin": "Share on Linkedin",
+      "share-on-twitter": "Share on Twitter"
     },
     "overlay": {
       "close": "Close"

diff --git a/translations/es.i18n.json b/translations/es.i18n.json
@@ -43,7 +43,10 @@
       "embed_options": "Insertar opciones",
       "start_video_at": "Iniciar vídeo en el",
       "email": "Compartir por correo electrónico",
-      "embed": "Obtener código de inserción"
+      "embed": "Obtener código de inserción",
+      "share-on-facebook": "Compartir en Facebook",
+      "share-on-twitter": "Compartir en Twitter",
+      "share-on-linkedin": "Compartir en Linkedin"
     },
     "overlay": {
       "close": "Cerrar"

diff --git a/translations/fr.i18n.json b/translations/fr.i18n.json
@@ -43,7 +43,10 @@
       "embed_options": "Options intégrées",
       "start_video_at": "Commencer la vidéo à",
       "email": "Partager par mail",
-      "embed": "Obtenir le code intégré"
+      "embed": "Obtenir le code intégré",
+      "share-on-facebook": "Partager sur Facebook",
+      "share-on-twitter": "Partager sur Twitter",
+      "share-on-linkedin": "Partager sur Linkedin"
     },
     "overlay": {
       "close": "Fermer"

diff --git a/translations/it.i18n.json b/translations/it.i18n.json
@@ -43,7 +43,10 @@
       "embed_options": "Integra opzioni",
       "start_video_at": "Avvia video a",
       "email": "Condividi su e-mail",
-      "embed": "Ottieni codice integrazione"
+      "embed": "Ottieni codice integrazione",
+      "share-on-facebook": "Condividi su Facebook",
+      "share-on-twitter": "Condividi su Twitter",
+      "share-on-linkedin": "Condividi su Linkedin"
     },
     "overlay": {
       "close": "Chiudi"

diff --git a/translations/ko.i18n.json b/translations/ko.i18n.json
@@ -0,0 +1,102 @@
+{
+  "ko": {
+    "controls": {
+      "play": "재생",
+      "pause": "중지",
+      "share": "공유",
+      "language": "언어",
+      "settings": "설정",
+      "fullscreen": "전체 화면",
+      "rewind": "뒤로 가기",
+      "forward": "앞으로 가기",
+      "vrStereo": "vr스테레오",
+      "live": "라이브",
+      "mute": "음소거",
+      "unmute": "음소거 해제",
+      "next": "다음",
+      "prev": "이전",
+      "startOver": "처음부터 재생",
+      "pictureInPicture": "화면 속 화면",
+      "pictureInPictureExit": "화면 속 화면 나가기",
+      "logo": "로고",
+      "seekBarSlider": "슬라이더"
+    },
+    "unmute": {
+      "unmute": "음소거 해제"
+    },
+    "copy": {
+      "button": "URL 복사"
+    },
+    "settings": {
+      "title": "설정",
+      "quality": "화질",
+      "speed": "재생 속도",
+      "speedNormal": "보통",
+      "qualityAuto": "자동"
+    },
+    "language": {
+      "title": "언어",
+      "audio": "오디오",
+      "captions": "자막",
+      "advanced_captions_settings": "고급 자막 설정"
+    },
+    "share": {
+      "title": "공유",
+      "embed_options": "옵션 포함",
+      "start_video_at": "비디오 재생",
+      "email": "이메일로 공유하기",
+      "embed": "임베드 코드",
+      "share-on-facebook": "페이스북에 공유",
+      "share-on-twitter": "트위터에 공유",
+      "share-on-linkedin": "링크드인에 공유"
+    },
+    "overlay": {
+      "close": "닫기"
+    },
+    "error": {
+      "default_error": "오류가 발생했습니다",
+      "default_session_text": "강연 ID",
+      "retry": "재시도"
+    },
+    "ads": {
+      "ad_notice": "광고",
+      "learn_more": "자세히 보기",
+      "skip_ad": "광고 건너뛰기",
+      "skip_in": "건너뛰기"
+    },
+    "cvaa": {
+      "title": "고급 자막 설정",
+      "sample_caption_tag": "샘플",
+      "sample_custom_caption_tag": "자막 변경",
+      "set_custom_caption": "자막 설정하기",
+      "edit_caption": "자막 편집",
+      "size_label": "사이즈",
+      "font_color_label": "글꼴 색",
+      "font_family_label": "글꼴 계열",
+      "font_style_label": "글꼴 스타일",
+      "font_opacity_label": "글꼴 불투명도",
+      "background_color_label": "배경색",
+      "background_opacity_label": "배경 불투명도",
+      "apply": "적용",
+      "caption_preview": "자막 미리 보기입니다"
+    },
+    "cast": {
+      "play_on_tv": "TV에서 재생",
+      "disconnect_from_tv": "TV에서 연결 끊기",
+      "status": {
+        "connecting_to": "연결 중",
+        "connected_to": "연결됨",
+        "playing_on": "재생 중"
+      }
+    },
+    "playlist": {
+      "prev": "이전",
+      "next": "다음",
+      "up_next": "다음 영상",
+      "cancel": "취소"
+    },
+    "pictureInPicture": {
+      "overlay_text": "화면 속 화면 모드 실행 중"
+    }
+  }
+}