nicolium: i18n cleanup

Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>

packages/nicolium/src/features/auth-login/components/otp-auth-form.tsx

@@ -13,12 +13,6 @@ import Input from '@/components/ui/input';
 import { useAppDispatch } from '@/hooks/use-app-dispatch';
 
 const messages = defineMessages({
-  otpCodeHint: {
-    id: 'login.fields.otp_code_hint',
-    defaultMessage:
-      'Enter the two-factor code generated by your phone app or use one of your recovery codes',
-  },
-  otpCodeLabel: { id: 'login.fields.otp_code_label', defaultMessage: 'Two-factor code:' },
   otpLoginFail: { id: 'login.otp_log_in.fail', defaultMessage: 'Invalid code, please try again.' },
 });
 
@@ -64,8 +58,15 @@ const OtpAuthForm: React.FC<IOtpAuthForm> = ({ mfa_token, small }) => {
   const form = (
     <Form onSubmit={handleSubmit}>
       <FormGroup
-        labelText={intl.formatMessage(messages.otpCodeLabel)}
-        hintText={intl.formatMessage(messages.otpCodeHint)}
+        labelText={
+          <FormattedMessage id='login.fields.otp_code_label' defaultMessage='Two-factor code:' />
+        }
+        hintText={
+          <FormattedMessage
+            id='login.fields.otp_code_hint'
+            defaultMessage='Enter the two-factor code generated by your phone app or use one of your recovery codes'
+          />
+        }
         errors={codeError ? [intl.formatMessage(messages.otpLoginFail)] : []}
       >
         <Input name='code' type='text' autoComplete='one-time-code' autoFocus required />

packages/nicolium/src/features/external-login/components/external-login-form.tsx

@@ -83,7 +83,9 @@ const ExternalLoginForm: React.FC = () => {
 
   return (
     <Form className='⁂-external-login' onSubmit={handleSubmit} data-testid='external-login'>
-      <FormGroup labelText={intl.formatMessage(messages.instanceLabel)}>
+      <FormGroup
+        labelText={<FormattedMessage id='login.fields.instance_label' defaultMessage='Instance' />}
+      >
         <Input
           aria-label={intl.formatMessage(messages.instancePlaceholder)}
           placeholder={intl.formatMessage(messages.instancePlaceholder)}

packages/nicolium/src/features/security/mfa/disable-otp-form.tsx

@@ -60,7 +60,9 @@ const DisableOtpForm: React.FC = () => {
       </Stack>
 
       <FormGroup
-        labelText={intl.formatMessage(messages.passwordPlaceholder)}
+        labelText={
+          <FormattedMessage id='mfa.mfa_setup.password_placeholder' defaultMessage='Password' />
+        }
         hintText={
           <FormattedMessage
             id='mfa.mfa_disable_enter_password'

packages/nicolium/src/features/security/mfa/otp-confirm-form.tsx

@@ -109,7 +109,7 @@ const OtpConfirmForm: React.FC = () => {
         </Text>
 
         <FormGroup
-          labelText={intl.formatMessage(messages.codePlaceholder)}
+          labelText={<FormattedMessage id='mfa.mfa_setup.code_placeholder' defaultMessage='Code' />}
           hintText={
             <FormattedMessage
               id='mfa.mfa_setup.code_hint'
@@ -131,7 +131,9 @@ const OtpConfirmForm: React.FC = () => {
 
         {features.manageMfaRequiresPassword && (
           <FormGroup
-            labelText={intl.formatMessage(messages.passwordPlaceholder)}
+            labelText={
+              <FormattedMessage id='mfa.mfa_setup.password_placeholder' defaultMessage='Password' />
+            }
             hintText={
               <FormattedMessage
                 id='mfa.mfa_setup.password_hint'

packages/nicolium/src/modals/join-event-modal.tsx

@@ -9,10 +9,6 @@ import { useJoinEventMutation } from '@/queries/statuses/use-event-interactions'
 import type { BaseModalProps } from '@/features/ui/components/modal-root';
 
 const messages = defineMessages({
-  hint: {
-    id: 'join_event.hint',
-    defaultMessage: 'You can tell the organizer why do you want to participate in this event:',
-  },
   placeholder: { id: 'join_event.placeholder', defaultMessage: 'Message to organizer' },
   join: { id: 'join_event.join', defaultMessage: 'Request join' },
 });
@@ -63,7 +59,14 @@ const JoinEventModal: React.FC<BaseModalProps & JoinEventModalProps> = ({ onClos
       confirmationText={intl.formatMessage(messages.join)}
       confirmationDisabled={isSubmitting}
     >
-      <FormGroup labelText={intl.formatMessage(messages.hint)}>
+      <FormGroup
+        labelText={
+          <FormattedMessage
+            id='join_event.hint'
+            defaultMessage='You can tell the organizer why do you want to participate in this event:'
+          />
+        }
+      >
         <Textarea
           placeholder={intl.formatMessage(messages.placeholder)}
           value={participationMessage}

packages/nicolium/src/pages/auth/password-reset.tsx

@@ -14,11 +14,6 @@ import { useFeatures } from '@/hooks/use-features';
 import toast from '@/toast';
 
 const messages = defineMessages({
-  nicknameOrEmail: {
-    id: 'password_reset.fields.username_placeholder',
-    defaultMessage: 'Email or username',
-  },
-  email: { id: 'password_reset.fields.email_placeholder', defaultMessage: 'E-mail address' },
   confirmation: {
     id: 'password_reset.confirmation',
     defaultMessage: 'Check your email for confirmation.',
@@ -55,9 +50,19 @@ const PasswordResetPage = () => {
     >
       <Form onSubmit={handleSubmit}>
         <FormGroup
-          labelText={intl.formatMessage(
-            features.logInWithUsername ? messages.nicknameOrEmail : messages.email,
-          )}
+          labelText={
+            features.logInWithUsername ? (
+              <FormattedMessage
+                id='password_reset.fields.username_placeholder'
+                defaultMessage='Email or username'
+              />
+            ) : (
+              <FormattedMessage
+                id='password_reset.fields.email_placeholder'
+                defaultMessage='E-mail address'
+              />
+            )
+          }
         >
           <Input type='text' name='nickname_or_email' placeholder='me@example.com' required />
         </FormGroup>

packages/nicolium/src/pages/developers/settings-store.tsx

@@ -26,12 +26,6 @@ const isJSONValid = (text: any): boolean => {
 
 const messages = defineMessages({
   heading: { id: 'column.settings_store', defaultMessage: 'Settings store' },
-  advanced: { id: 'developers.settings_store.advanced', defaultMessage: 'Advanced settings' },
-  hint: {
-    id: 'developers.settings_store.hint',
-    defaultMessage:
-      'It is possible to directly edit your user settings here. BE CAREFUL! Editing this section can break your account, and you will only be able to recover through the API.',
-  },
 });
 
 const SettingsStore: React.FC = () => {
@@ -78,7 +72,12 @@ const SettingsStore: React.FC = () => {
     <Column label={intl.formatMessage(messages.heading)} backHref='/developers'>
       <Form onSubmit={handleSubmit}>
         <FormGroup
-          hintText={intl.formatMessage(messages.hint)}
+          hintText={
+            <FormattedMessage
+              id='developers.settings_store.hint'
+              defaultMessage='It is possible to directly edit your user settings here. BE CAREFUL! Editing this section can break your account, and you will only be able to recover through the API.'
+            />
+          }
           errors={jsonValid ? [] : ['is invalid']}
         >
           <Textarea
@@ -98,7 +97,14 @@ const SettingsStore: React.FC = () => {
       </Form>
 
       <CardHeader className='mb-4'>
-        <CardTitle title={intl.formatMessage(messages.advanced)} />
+        <CardTitle
+          title={
+            <FormattedMessage
+              id='developers.settings_store.advanced'
+              defaultMessage='Advanced settings'
+            />
+          }
+        />
       </CardHeader>
 
       <List>

packages/nicolium/src/pages/settings/migration.tsx

@@ -16,7 +16,6 @@ import toast from '@/toast';
 
 const messages = defineMessages({
   heading: { id: 'column.migration', defaultMessage: 'Move account' },
-  submit: { id: 'migration.submit', defaultMessage: 'Move followers' },
   moveAccountSuccess: {
     id: 'migration.move_account.success',
     defaultMessage: 'Account successfully moved.',
@@ -29,18 +28,10 @@ const messages = defineMessages({
     id: 'migration.move_account.fail.cooldown_period',
     defaultMessage: 'You have moved your account too recently. Please try again later.',
   },
-  acctFieldLabel: {
-    id: 'migration.fields.acct.label',
-    defaultMessage: 'Handle of the new account',
-  },
   acctFieldPlaceholder: {
     id: 'migration.fields.acct.placeholder',
     defaultMessage: 'username@domain',
   },
-  currentPasswordFieldLabel: {
-    id: 'migration.fields.confirm_password.label',
-    defaultMessage: 'Current password',
-  },
 });
 
 const MigrationPage = () => {
@@ -118,7 +109,14 @@ const MigrationPage = () => {
             </>
           )}
         </Text>
-        <FormGroup labelText={intl.formatMessage(messages.acctFieldLabel)}>
+        <FormGroup
+          labelText={
+            <FormattedMessage
+              id='migration.fields.acct.label'
+              defaultMessage='Handle of the new account'
+            />
+          }
+        >
           <Input
             name='targetAccount'
             placeholder={intl.formatMessage(messages.acctFieldPlaceholder)}
@@ -127,7 +125,14 @@ const MigrationPage = () => {
             required
           />
         </FormGroup>
-        <FormGroup labelText={intl.formatMessage(messages.currentPasswordFieldLabel)}>
+        <FormGroup
+          labelText={
+            <FormattedMessage
+              id='migration.fields.confirm_password.label'
+              defaultMessage='Current password'
+            />
+          }
+        >
           <Input
             type='password'
             name='password'
@@ -139,7 +144,7 @@ const MigrationPage = () => {
         <FormActions>
           <Button
             theme='primary'
-            text={intl.formatMessage(messages.submit)}
+            text={<FormattedMessage id='migration.submit' defaultMessage='Move followers' />}
             type='submit'
             disabled={isLoading}
           />