miklo
/
soapbox
sforkowany z mirror/soapbox
1
0
Forkuj 0
Kod Zgłoszenia Oczekujące zmiany Packages Projekty Wydania Wiki Aktywność

Do not define translatable messages inline 

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
mention-reblog-author
marcin mikołajczak 2022-11-12 00:07:02 +01:00
rodzic 84ff4d928d
commit f2c5e138f3
5 zmienionych plików z 108 dodań i 94 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

12
app/soapbox/features/notifications/components/notification.tsx
Wyświetl plik

@ -1,6 +1,6 @@
import React, { useCallback } from 'react';
import { HotKeys } from 'react-hotkeys';
import { defineMessages, useIntl, FormattedMessage, IntlShape, MessageDescriptor } from 'react-intl';
import { defineMessages, useIntl, FormattedMessage, IntlShape, MessageDescriptor, defineMessage } from 'react-intl';
import { useHistory } from 'react-router-dom';
import { mentionCompose } from 'soapbox/actions/compose';
@ -55,6 +55,11 @@ const icons: Record<NotificationType, string> = {
update: require('@tabler/icons/pencil.svg'),
};
const nameMessage = defineMessage({
id: 'notification.name',
defaultMessage: '{link}{others}',
});
const messages: Record<NotificationType, MessageDescriptor> = defineMessages({
follow: {
id: 'notification.follow',
@ -115,10 +120,7 @@ const buildMessage = (
instanceTitle: string,
): React.ReactNode => {
const link = buildLink(account);
const name = intl.formatMessage({
id: 'notification.name',
defaultMessage: '{link}{others}',
}, {
const name = intl.formatMessage(nameMessage, {
link,
others: totalCount && totalCount > 0 ? (
<FormattedMessage

107
app/soapbox/features/ui/components/modals/verify-sms-modal.tsx
Wyświetl plik

@ -1,5 +1,5 @@
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { useIntl } from 'react-intl';
import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
import OtpInput from 'react-otp-input';
import { verifyCredentials } from 'soapbox/actions/auth';
@ -10,6 +10,37 @@ import { FormGroup, PhoneInput, Modal, Stack, Text } from 'soapbox/components/ui
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
import { getAccessToken } from 'soapbox/utils/auth';
const messages = defineMessages({
verificationInvalid: {
id: 'sms_verification.invalid',
defaultMessage: 'Please enter a valid phone number.',
},
verificationSuccess: {
id: 'sms_verification.success',
defaultMessage: 'A verification code has been sent to your phone number.',
},
verificationFail: {
id: 'sms_verification.fail',
defaultMessage: 'Failed to send SMS message to your phone number.',
},
verificationExpired: {
id: 'sms_verification.expired',
defaultMessage: 'Your SMS token has expired.',
},
verifySms: {
id: 'sms_verification.modal.verify_sms',
defaultMessage: 'Verify SMS',
},
verifyNumber: {
id: 'sms_verification.modal.verify_number',
defaultMessage: 'Verify phone number',
},
verifyCode: {
id: 'sms_verification.modal.verify_code',
defaultMessage: 'Verify code',
},
});
interface IVerifySmsModal {
onClose: (type: string) => void,
}
@ -47,10 +78,7 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
setStatus(Statuses.IDLE);
dispatch(
snackbar.error(
intl.formatMessage({
id: 'sms_verification.invalid',
defaultMessage: 'Please enter a valid phone number.',
}),
intl.formatMessage(messages.verificationInvalid),
),
);
return;
@ -59,10 +87,7 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
dispatch(reRequestPhoneVerification(phone!)).then(() => {
dispatch(
snackbar.success(
intl.formatMessage({
id: 'sms_verification.success',
defaultMessage: 'A verification code has been sent to your phone number.',
}),
intl.formatMessage(messages.verificationSuccess),
),
);
})
@ -70,10 +95,7 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
.catch(() => {
dispatch(
snackbar.error(
intl.formatMessage({
id: 'sms_verification.fail',
defaultMessage: 'Failed to send SMS message to your phone number.',
}),
intl.formatMessage(messages.verificationFail),
),
);
});
@ -102,20 +124,11 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
const confirmationText = useMemo(() => {
switch (status) {
case Statuses.IDLE:
return intl.formatMessage({
id: 'sms_verification.modal.verify_sms',
defaultMessage: 'Verify SMS',
});
return intl.formatMessage(messages.verifySms);
case Statuses.READY:
return intl.formatMessage({
id: 'sms_verification.modal.verify_number',
defaultMessage: 'Verify phone number',
});
return intl.formatMessage(messages.verifyNumber);
case Statuses.REQUESTED:
return intl.formatMessage({
id: 'sms_verification.modal.verify_code',
defaultMessage: 'Verify code',
});
return intl.formatMessage(messages.verifyCode);
default:
return null;
}
@ -126,12 +139,13 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
case Statuses.IDLE:
return (
<Text theme='muted'>
{intl.formatMessage({
id: 'sms_verification.modal.verify_help_text',
defaultMessage: 'Verify your phone number to start using {instance}.',
}, {
instance: title,
})}
<FormattedMessage
id='sms_verification.modal.verify_help_text'
defaultMessage='Verify your phone number to start using {instance}.'
values={{
instance: title,
}}
/>
</Text>
);
case Statuses.READY:
@ -149,10 +163,10 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
return (
<>
<Text theme='muted' size='sm' align='center'>
{intl.formatMessage({
id: 'sms_verification.modal.enter_code',
defaultMessage: 'We sent you a 6-digit code via SMS. Enter it below.',
})}
<FormattedMessage
id='sms_verification.modal.enter_code'
defaultMessage='We sent you a 6-digit code via SMS. Enter it below.'
/>
</Text>
<OtpInput
@ -184,10 +198,7 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
})
.catch(() => dispatch(
snackbar.error(
intl.formatMessage({
id: 'sms_verification.invalid',
defaultMessage: 'Your SMS token has expired.',
}),
intl.formatMessage(messages.verificationExpired),
),
));
};
@ -201,10 +212,10 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
return (
<Modal
title={
intl.formatMessage({
id: 'sms_verification.modal.verify_title',
defaultMessage: 'Verify your phone number',
})
<FormattedMessage
id='sms_verification.modal.verify_title'
defaultMessage='Verify your phone number'
/>
}
onClose={() => onClose('VERIFY_SMS')}
cancelAction={status === Statuses.IDLE ? () => onClose('VERIFY_SMS') : undefined}
@ -212,10 +223,12 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
confirmationAction={onConfirmationClick}
confirmationText={confirmationText}
secondaryAction={status === Statuses.REQUESTED ? resendVerificationCode : undefined}
secondaryText={status === Statuses.REQUESTED ? intl.formatMessage({
id: 'sms_verification.modal.resend_code',
defaultMessage: 'Resend verification code?',
}) : undefined}
secondaryText={status === Statuses.REQUESTED ? (
<FormattedMessage
id='sms_verification.modal.resend_code'
defaultMessage='Resend verification code?'
/>
) : undefined}
secondaryDisabled={requestedAnother}
>
<Stack space={4}>

24
app/soapbox/features/verification/email_passthru.tsx
Wyświetl plik

@ -28,6 +28,11 @@ const messages = defineMessages({
tokenNotFoundBody: { id: 'email_passthru.token_not_found.body', defaultMessage: 'Your email token was not found. Please request a new email confirmation from the {bold} from which you sent this email confirmation.' },
tokenExpiredHeading: { id: 'email_passthru.token_expired.heading', defaultMessage: 'Token Expired' },
tokenExpiredBody: { id: 'email_passthru.token_expired.body', defaultMessage: 'Your email token has expired. Please request a new email confirmation from the {bold} from which you sent this email confirmation.' },
emailConfirmed: { id: 'email_passthru.success', defaultMessage: 'Your email has been verified!' },
genericFail: { id: 'email_passthru.fail.generic', defaultMessage: 'Unable to confirm your email' },
tokenExpired: { id: 'email_passthru.fail.expired', defaultMessage: 'Your email token has expired' },
tokenNotFound: { id: 'email_passthru.fail.not_found', defaultMessage: 'Your email token is invalid.' },
invalidToken: { id: 'email_passthru.fail.invalid_token', defaultMessage: 'Your token is invalid' },
});
const Success = () => {
@ -116,30 +121,21 @@ const EmailPassThru = () => {
dispatch(confirmEmailVerification(token))
.then(() => {
setStatus(Statuses.SUCCESS);
dispatch(snackbar.success(intl.formatMessage({ id: 'email_passthru.success', defaultMessage: 'Your email has been verified!' })));
dispatch(snackbar.success(intl.formatMessage(messages.emailConfirmed)));
})
.catch((error: AxiosError<any>) => {
const errorKey = error?.response?.data?.error;
let message = intl.formatMessage({
id: 'email_passthru.fail.generic',
defaultMessage: 'Unable to confirm your email',
});
let message = intl.formatMessage(messages.genericFail);
if (errorKey) {
switch (errorKey) {
case 'token_expired':
message = intl.formatMessage({
id: 'email_passthru.fail.expired',
defaultMessage: 'Your email token has expired.',
});
message = intl.formatMessage(messages.tokenExpired);
setStatus(Statuses.TOKEN_EXPIRED);
break;
case 'token_not_found':
message = intl.formatMessage({
id: 'email_passthru.fail.not_found',
defaultMessage: 'Your email token is invalid.',
});
message = 'Your token is invalid';
message = intl.formatMessage(messages.tokenNotFound);
message = intl.formatMessage(messages.invalidToken);
setStatus(Statuses.TOKEN_NOT_FOUND);
break;
default:

24
app/soapbox/features/verification/steps/email-verification.tsx
Wyświetl plik

@ -1,6 +1,6 @@
import { AxiosError } from 'axios';
import React from 'react';
import { useIntl } from 'react-intl';
import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
import snackbar from 'soapbox/actions/snackbar';
import { checkEmailVerification, postEmailVerification, requestEmailVerification } from 'soapbox/actions/verification';
@ -8,6 +8,13 @@ import Icon from 'soapbox/components/icon';
import { Button, Form, FormGroup, Input, Text } from 'soapbox/components/ui';
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
const messages = defineMessages({
verificationSuccess: { id: 'email_verification.success', defaultMessage: 'Verification email sent successfully.' },
verificationFail: { id: 'email_verification.fail', defaultMessage: 'Failed to request email verification.' },
verificationFailTakenAlert: { id: 'emai_verifilcation.exists', defaultMessage: 'This email has already been taken.' },
verificationFailTaken: { id: 'email_verification.taken', defaultMessage: 'is taken' },
});
const Statuses = {
IDLE: 'IDLE',
REQUESTED: 'REQUESTED',
@ -77,26 +84,23 @@ const EmailVerification = () => {
dispatch(
snackbar.success(
intl.formatMessage({
id: 'email_verification.exists',
defaultMessage: 'Verification email sent successfully.',
}),
intl.formatMessage(messages.verificationSuccess),
),
);
})
.catch((error: AxiosError) => {
const errorMessage = (error.response?.data as any)?.error;
const isEmailTaken = errorMessage === 'email_taken';
let message = intl.formatMessage({ id: 'email_verification.fail', defaultMessage: 'Failed to request email verification.' });
let message = intl.formatMessage(messages.verificationFail);
if (isEmailTaken) {
message = intl.formatMessage({ id: 'email_verification.exists', defaultMessage: 'This email has already been taken.' });
message = intl.formatMessage(messages.verificationFailTakenAlert);
} else if (errorMessage) {
message = errorMessage;
}
if (isEmailTaken) {
setErrors([intl.formatMessage({ id: 'email_verification.taken', defaultMessage: 'is taken' })]);
setErrors([intl.formatMessage(messages.verificationFailTaken)]);
}
dispatch(snackbar.error(message));
@ -111,7 +115,9 @@ const EmailVerification = () => {
return (
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'>{intl.formatMessage({ id: 'email_verification.header', defaultMessage: 'Enter your email address' })}</h1>
<h1 className='text-center font-bold text-2xl'>
<FormattedMessage id='email_verification.header' defaultMessage='Enter your email address' />
</h1>
</div>
<div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>

35
app/soapbox/features/verification/steps/sms-verification.tsx
Wyświetl plik

@ -1,6 +1,6 @@
import { AxiosError } from 'axios';
import React from 'react';
import { useIntl } from 'react-intl';
import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
import OtpInput from 'react-otp-input';
import snackbar from 'soapbox/actions/snackbar';
@ -8,6 +8,13 @@ import { confirmPhoneVerification, requestPhoneVerification } from 'soapbox/acti
import { Button, Form, FormGroup, PhoneInput, Text } from 'soapbox/components/ui';
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
const messages = defineMessages({
verificationInvalid: { id: 'sms_verification.invalid', defaultMessage: 'Please enter a valid phone number.' },
verificationSuccess: { id: 'sms_verification.success', defaultMessage: 'A verification code has been sent to your phone number.' },
verificationFail: { id: 'sms_verification.fail', defaultMessage: 'Failed to send SMS message to your phone number.' },
verificationExpired: { id: 'sms_verification.expired', defaultMessage: 'Your SMS token has expired.' },
});
const Statuses = {
IDLE: 'IDLE',
REQUESTED: 'REQUESTED',
@ -38,10 +45,7 @@ const SmsVerification = () => {
setStatus(Statuses.IDLE);
dispatch(
snackbar.error(
intl.formatMessage({
id: 'sms_verification.invalid',
defaultMessage: 'Please enter a valid phone number.',
}),
intl.formatMessage(messages.verificationInvalid),
),
);
return;
@ -50,18 +54,12 @@ const SmsVerification = () => {
dispatch(requestPhoneVerification(phone!)).then(() => {
dispatch(
snackbar.success(
intl.formatMessage({
id: 'sms_verification.success',
defaultMessage: 'A verification code has been sent to your phone number.',
}),
intl.formatMessage(messages.verificationSuccess),
),
);
setStatus(Statuses.REQUESTED);
}).catch((error: AxiosError) => {
const message = (error.response?.data as any)?.message || intl.formatMessage({
id: 'sms_verification.fail',
defaultMessage: 'Failed to send SMS message to your phone number.',
});
const message = (error.response?.data as any)?.message || intl.formatMessage(messages.verificationFail);
dispatch(snackbar.error(message));
setStatus(Statuses.FAIL);
@ -78,10 +76,7 @@ const SmsVerification = () => {
dispatch(confirmPhoneVerification(verificationCode))
.catch(() => dispatch(
snackbar.error(
intl.formatMessage({
id: 'sms_verification.invalid',
defaultMessage: 'Your SMS token has expired.',
}),
intl.formatMessage(messages.verificationExpired),
),
));
};
@ -97,7 +92,7 @@ const SmsVerification = () => {
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'>
{intl.formatMessage({ id: 'sms_verification.sent.header', defaultMessage: 'Verification code' })}
<FormattedMessage id='sms_verification.sent.header' defaultMessage='Verification code' />
</h1>
</div>
@ -136,7 +131,9 @@ const SmsVerification = () => {
return (
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-800 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'>{intl.formatMessage({ id: 'sms_verification.header', defaultMessage: 'Enter your phone number' })}</h1>
<h1 className='text-center font-bold text-2xl'>
<FormattedMessage id='sms_verification.header' defaultMessage='Enter your phone number' />
</h1>
</div>
<div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>