From 0d2f360c22cd9bb50ae04f00a25e5fcc6c21bcdd Mon Sep 17 00:00:00 2001 From: sct Date: Fri, 27 Nov 2020 10:22:22 +0000 Subject: [PATCH] feat(frontend): add translatable strings for request card --- src/components/RequestCard/index.tsx | 38 ++++++++++++++++++++++------ src/i18n/globalMessages.ts | 2 ++ src/i18n/locale/en.json | 4 +++ src/i18n/locale/fr.json | 4 +++ src/i18n/locale/ja.json | 4 +++ 5 files changed, 44 insertions(+), 8 deletions(-) diff --git a/src/components/RequestCard/index.tsx b/src/components/RequestCard/index.tsx index 3431b0ad..3e26415c 100644 --- a/src/components/RequestCard/index.tsx +++ b/src/components/RequestCard/index.tsx @@ -14,6 +14,13 @@ import axios from 'axios'; import Button from '../Common/Button'; import { withProperties } from '../../utils/typeHelpers'; import Link from 'next/link'; +import { defineMessages, useIntl } from 'react-intl'; +import globalMessages from '../../i18n/globalMessages'; + +const messages = defineMessages({ + requestedby: 'Requested by {username}', + seasons: 'Seasons', +}); const isMovie = (movie: MovieDetails | TvDetails): movie is MovieDetails => { return (movie as MovieDetails).title !== undefined; @@ -34,6 +41,7 @@ interface RequestCardProps { } const RequestCard: React.FC = ({ request }) => { + const intl = useIntl(); const { hasPermission } = useUser(); const { locale } = useContext(LanguageContext); const url = @@ -90,25 +98,35 @@ const RequestCard: React.FC = ({ request }) => {
- Requested by {requestData.requestedBy.username} + {intl.formatMessage(messages.requestedby, { + username: requestData.requestedBy.username, + })}
{requestData.media.status === MediaStatus.AVAILABLE && ( - Available + + {intl.formatMessage(globalMessages.available)} + )} {requestData.media.status === MediaStatus.PARTIALLY_AVAILABLE && ( - Partially Available + + {intl.formatMessage(globalMessages.partiallyavailable)} + )} {requestData.media.status === MediaStatus.PROCESSING && ( - Unavailable + + {intl.formatMessage(globalMessages.unavailable)} + )} {requestData.media.status === MediaStatus.PENDING && ( - Pending + + {intl.formatMessage(globalMessages.pending)} + )}
{request.seasons.length > 0 && (
- Seasons + {intl.formatMessage(messages.seasons)} {request.seasons.map((season) => ( {season.seasonNumber} @@ -137,7 +155,9 @@ const RequestCard: React.FC = ({ request }) => { clipRule="evenodd" /> - Approve + + {intl.formatMessage(globalMessages.approve)} + @@ -158,7 +178,9 @@ const RequestCard: React.FC = ({ request }) => { clipRule="evenodd" /> - Decline + + {intl.formatMessage(globalMessages.decline)} +
diff --git a/src/i18n/globalMessages.ts b/src/i18n/globalMessages.ts index f2cc0eda..4dd99e8c 100644 --- a/src/i18n/globalMessages.ts +++ b/src/i18n/globalMessages.ts @@ -11,6 +11,8 @@ const globalMessages = defineMessages({ movies: 'Movies', tvshows: 'Series', cancel: 'Cancel', + approve: 'Approve', + decline: 'Declined', }); export default globalMessages; diff --git a/src/i18n/locale/en.json b/src/i18n/locale/en.json index 82d07714..faad52da 100644 --- a/src/i18n/locale/en.json +++ b/src/i18n/locale/en.json @@ -49,6 +49,8 @@ "components.PlexLoginButton.loggingin": "Logging in...", "components.PlexLoginButton.loginwithplex": "Login with Plex", "components.RequestBlock.seasons": "Seasons", + "components.RequestCard.requestedby": "Requested by {username}", + "components.RequestCard.seasons": "Seasons", "components.RequestModal.cancel": "Cancel Request", "components.RequestModal.cancelling": "Cancelling...", "components.RequestModal.cancelrequest": "This will remove your request. Are you sure you want to continue?", @@ -267,9 +269,11 @@ "components.UserList.userlist": "User List", "components.UserList.username": "Username", "components.UserList.usertype": "User Type", + "i18n.approve": "Approve", "i18n.approved": "Approved", "i18n.available": "Available", "i18n.cancel": "Cancel", + "i18n.decline": "Declined", "i18n.declined": "Declined", "i18n.movies": "Movies", "i18n.partiallyavailable": "Partially Available", diff --git a/src/i18n/locale/fr.json b/src/i18n/locale/fr.json index d7dd6310..d72be512 100644 --- a/src/i18n/locale/fr.json +++ b/src/i18n/locale/fr.json @@ -49,6 +49,8 @@ "components.PlexLoginButton.loggingin": "Connexion en cours...", "components.PlexLoginButton.loginwithplex": "Se Connecter avec Plex", "components.RequestBlock.seasons": "Saisons", + "components.RequestCard.requestedby": "", + "components.RequestCard.seasons": "", "components.RequestModal.cancel": "Annuler la Demande", "components.RequestModal.cancelling": "Annulation...", "components.RequestModal.cancelrequest": "Votre demande d'ajout va être annulée. Êtes-vous sûr de vouloir annuler?", @@ -267,9 +269,11 @@ "components.UserList.userlist": "", "components.UserList.username": "", "components.UserList.usertype": "", + "i18n.approve": "", "i18n.approved": "", "i18n.available": "", "i18n.cancel": "", + "i18n.decline": "", "i18n.declined": "", "i18n.movies": "", "i18n.partiallyavailable": "", diff --git a/src/i18n/locale/ja.json b/src/i18n/locale/ja.json index 8b7d5b62..10ee53c4 100644 --- a/src/i18n/locale/ja.json +++ b/src/i18n/locale/ja.json @@ -49,6 +49,8 @@ "components.PlexLoginButton.loggingin": "", "components.PlexLoginButton.loginwithplex": "", "components.RequestBlock.seasons": "", + "components.RequestCard.requestedby": "", + "components.RequestCard.seasons": "", "components.RequestModal.cancel": "", "components.RequestModal.cancelling": "", "components.RequestModal.cancelrequest": "このリクエストをキャンセルしてよろしいですか？", @@ -267,9 +269,11 @@ "components.UserList.userlist": "", "components.UserList.username": "", "components.UserList.usertype": "", + "i18n.approve": "", "i18n.approved": "", "i18n.available": "", "i18n.cancel": "", + "i18n.decline": "", "i18n.declined": "", "i18n.movies": "", "i18n.partiallyavailable": "",